Express. js Конфигурация CORS, PUT не работает?

Question

У меня есть приложение React и Nodejs (Express) в бэкэнде. После развертывания на хост-сервере перестала работать должным образом функция обновления некоторых документов. Выдает ошибку CORS:

У меня есть эта строка кода для обработки политики CORS на моем сервере. js:

app.use((req, res, next) => {
  res.set({"Access-Control-Allow-Origin" : "*", 
           "Access-Control-Allow-Methods" : "HEAD, OPTIONS, GET, POST, PUT, PATCH, DELETE", 
           "Access-Control-Allow-Headers" : "Content-Type, Authorization, X-Requested-With"})
  next();
});

Это нормально для методов GET и POST, но не работает для PUT (Не знаю, работает ли Delete, не пробовал)

Я много времени нахожусь над этой проблемой; попробовал это: { ссылка }

искал кучу решений на net, пытался настроить его из файла IIS web.config, но моя проблема не решилась. Какую часть я могу пропустить?

Answer 1

Как указано в MDN:

Кроме того, для методов HTTP-запросов, которые могут вызывать побочные эффекты на данных сервера (в частности, для методов HTTP , отличных от GET, или для использования POST с определенными типами MIME ), спецификация обязывает браузеры «предварительно проверять» запрос, запрашивая поддерживаемые методы с сервера с помощью метода запроса HTTP OPTIONS, а затем, после «одобрения» с сервера, отправка фактического запроса методом фактического HTTP-запроса.

Таким образом, вы должны ответить на предварительные запросы:

  app.options("*", (req, res) => {
    res.status(200).send("Preflight request allowed");
  });

Подробнее о предварительных запросах здесь .

Answer 2

Скорее всего, ошибка No 'Access-Control-Allow-Origin' header is present, которую вы видите, исходит из предварительного запроса OPTIONS, который наиболее вероятно даже не достигает вашего express бэкэнда, но обрабатывается веб-сервером спереди.

Либо организуйте передачу запросов OPTIONS также на ваш express бэкэнд в конфигурации вашего веб-сервера, либо дайте указание веб-серверу ответить на него необходимыми заголовками.

Проверьте это:

https://support.plesk.com/hc/en-us/articles/115001338265-How-to-set-up-CORS-cross-origin-resource-sharing-in-Plesk-for-Linux-

https://support.plesk.com/hc/en-us/articles/360005431913-Is-it-possible-to-enable-CORS-cross-origin-resource-sharing-on-Plesk-for-Windows

https://talk.plesk.com/threads/iis-cors-configuration-problem-for-node-js-backend.355677/

Answer 3

Это должно работать, я использовал эту конфигурацию CORS

  app.use(function(req,res,next){
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, PATCH");
    res.header("Access-Control-Allow-Headers", "Accept, Content-Type, Authorization, X-Requested-With");

    next();
  });

Answer 4

Вы можете использовать npm пакетные сердечники (https://www.npmjs.com/package/cors) в вашем проекте. Установите его, а затем настройте как промежуточное ПО. И поместите его перед маршрутами вашего приложения.

 const cors = require("cors");

    const corsOptions = {   origin: "*",   methods:
    "GET,HEAD,PUT,PATCH,POST,DELETE",   allowedHeaders:
        "Access-Control-Allow-Headers,Access-Control-Allow-Origin,Access-Control-Request-Method,Access-Control-Request-Headers,Origin,Cache-Control,Content-Type,X-Token,X-Refresh-Token",   credentials: true,   preflightContinue: false,  
    optionsSuccessStatus: 204 };

    app.use(cors(corsOptions));

Answer 5

Вы написали промежуточное программное обеспечение, которое присоединяет заголовок перед строкой кода, которая обрабатывает запрос PUT? У меня есть подобный код, но он работал для меня. Другой подход заключается в использовании модуля npm 'cors'.

Для целей тестирования вы можете прикрепить тест ниже (вы можете прикрепить указанные c заголовки / методы позже):

res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Headers', '*');
res.header('Access-Control-Allow-Methods', '*');

Answer 6

Мы можем использовать пакет npm, чтобы включить это тоже

npm install --save cors

После установки пакета используйте его в качестве промежуточного программного обеспечения следующим образом.

var express = require('express');
var cors = require('cors');
var app = express();
app.use(cors());

Если вам необходимо ограничить доступ к ресурсу одним приложением, что можно сделать следующим образом:

app.use(cors({
  origin: 'http://yourapp.com'
}));

Если вам необходимо добавить доступ к нескольким приложениям, это можно сделать следующим образом:

var allowedOrigins = ['http://localhost:3000',
                      'http://yourapp.com'];
app.use(cors({
  origin: function(origin, callback){
    // allow requests with no origin 
    // (like mobile apps or curl requests)
    if(!origin) return callback(null, true);
    if(allowedOrigins.indexOf(origin) === -1){
      var msg = 'The CORS policy for this site does not ' +
                'allow access from the specified Origin.';
      return callback(new Error(msg), false);
    }
    return callback(null, true);
  }
}));

Answer 7

Пожалуйста, попробуйте следующую конфигурацию

const cors = require('cors');
app.use(cors())

Пожалуйста, дайте мне знать, работает ли у вас или нет.

См. Репозиторий Github для получения дополнительной информации: https://github.com/expressjs/cors