Блог

Я пытался получить данные из файла json (который находится на удаленном сервере) с локального хоста, и я получаю сообщение об ошибке «from origin»http://localhost:5000 » заблокирован политикой CORS: ответ на предполетный запрос не проходит проверку контроля доступа: нет «Access-Control-Allow-Origin»заголовок присутствует на запрошенном ресурсе. ‘

Ниже приведен код, который я использовал для отправки запроса get.

 $.ajax({
        url: 'http://abc/some.json',
        type: "GET",
        dataType: "json",
        headers: {
            "Access-Control-Request-Headers": "*",
            "Access-Control-Request-Method": "*",
            'Content-Type':'application/json'
        },
        success: function (data) {
            alert(data);
            chatbotConfig = data;
            console.log(chatbotConfig);
        }
    })
  

Я могу получить данные с помощью postman. Я понимаю, что postman не является браузером, поэтому он не ограничен политикой CORS. Но я могу загружать содержимое из файла json непосредственно из браузера. Я не могу понять, почему я столкнулся с проблемой, когда попытался получить доступ с локального хоста. Может ли кто-нибудь, пожалуйста, помочь мне решить эту проблему.

Что ж, ошибка CORS может находиться на разных уровнях вашего приложения. Обычно, разрешая все ( * ) источники и заголовки на стороне сервера, ваша проблема должна быть исправлена. Но иногда этого не происходит, и он находится где-то в другом месте, например, в заголовке или теле вашего HTTP-запроса, настройках DNS (убедитесь, что в вашей сети нет сторонних DNS, установленных самостоятельно через ОС) или настройках браузера. Поэтому я кратко опишу все возможные решения здесь.

ПРИМЕЧАНИЕ: Вы можете прочитать больше о политике CORS здесь .

Как решить ошибку CORS

Если у вас есть доступ к настройкам и / или опциям на стороне сервера, вам нужно убедиться (или, если вы этого не делаете, вам нужно спросить своего серверного разработчика), все ли там установлено правильно или нет. Итак, шаги будут следующими:

• Прежде всего, вам нужно убедиться, что настройки вашего сервера для CORS установлены правильно.

  1. Так, например, если вы используете Apache, вы можете установить политику CORS в своем .htaccess файле следующим образом (или просто проверить, существует ли она)::

   // This will allow all origins to access your server
  Header set Access-Control-Allow-Origin "*" // You can set * to whatever domain
  Header add Access-Control-Allow-Methods "*"
    

  2. Если вы используете NodeJS, вы можете проверить или установить его следующим образом:

    app.use((req, res, next) => {
      res.setHeader("Access-Control-Allow-Origin", "*");
      res.header(
        "Access-Control-Allow-Headers",
        "Origin, X-Requested-With, Content-Type, Accept"
      );
      next();
   });
    

  3. Если вы используете Nginx, вы можете проверить или установить его следующим nginx.conf образом:

   server {
    location / {
       add_header Access-Control-Allow-Origin "*";
       add_header Access-Control-Allow-Methods "*";
    }
  }
    

  4. Если вы используете какой-либо другой сервис для своей серверной части, вам следует прочитать документацию об этом, но все они на самом деле одинаковы.

• Если вы выполнили вышеуказанный шаг и политика CORS была установлена правильно на стороне вашего сервера, вам может потребоваться проверить ваш HTTP-запрос и убедиться, что там все установлено правильно. Например, нет необходимости добавлять эти два заголовка

   "Access-Control-Request-Headers": "*",
  "Access-Control-Request-Method": "*",
    

  в вашем запросе, потому что они не существуют в качестве заголовка на стороне клиента. Неправильный адрес или параметры конечной точки API HTTP-запроса (например dataType ), неправильное тело или заголовки HTTP-запроса также могут вызвать ошибку CORS для вашего here . Поэтому вам нужно проверить их все и убедиться, что вы установили их правильно.

• Если ни одно из вышеперечисленных не было проблемой, вы можете попробовать два других подхода. Я в основном рекомендую использовать второй, если ни одно из вышеперечисленных решений не решает вашу проблему.

  1. Сопоставление вашего localhost URL с вашим hosts файлом (обычно находится в etc папке в каждой операционной системе). Вы можете сделать это следующим образом (но лучше прочитать документацию для каждой ОС).

      127.0.0.1   www.test.com ## map 127.0.0.1 to www.test.com
     ## or
     localhost   www.test.com
       

     ПРИМЕЧАНИЕ: Обычно лучше избегать этого подхода.

  2. Используйте плагины для браузера, такие как Разрешить CORS.

В принципе, если вы четко посмотрите в журналы проблем: «из источника»http://localhost:5000 ‘ заблокирован политикой CORS: ответ на предполетный запрос не проходит проверку контроля доступа: заголовок ‘Access-Control-Allow-Origin’ отсутствует на запрошенном ресурсе

В нем говорится, что CORS не включен в ресурсе. это означает, что это должно быть исправлено или разрешено на стороне сервера.