Запрос JSON из локального html-файла на сервер вызывает ошибку CORS: доступ к XMLHttpRequest на <URL>из источника 'null' был заблокирован политикой CORS

Question

У меня есть ЛОКАЛЬНЫЙ HTML-файл, который содержит HTTP-запрос JSON к серверу. Хотя запрос работает в IE, он не работает в Chrome, что приводит к ошибке:

Доступ к XMLHttpRequest в 'http://SERVERNAME/QuestionnaireExample/METHODNAME' из источника' null 'был заблокирован политикой CORS: в запрошенном ресурсе отсутствует заголовок' Access-Control-Allow-Origin '.

Код XMLHTTP, который вызывает ошибку:

            $.support.cors = true;

            //upload the questionnaire
            $.ajax({
                url: 'http://SERVERNAME/QuestionnaireExample/METHODNAME',
                type: 'GET',
                success: function (result) {
                    // CODE for success
                },

                error: function (result) {
                    // CODE for error
                }
            });
        });

Диагностика сети показывает:

Общее

Request URL: http://SERVERNAME/QuestionnaireExample/METHODNAME
Request Method: GET
Status Code: 401 Unauthorized
Remote Address: [::1]:80
Referrer Policy: no-referrer-when-downgrade

Заголовки запроса:

Provisional headers are shown
Accept: */*
Origin: null
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36

Как я уже говорил, в IE тот же код работает из локального файла

            $.support.cors = true;

            //upload the questionnaire
            $.ajax({
                url: 'http://SERVERNAME/QuestionnaireExample/METHODNAME',
                type: 'GET',
                success: function (result) {
                    // CODE for success
                },

                error: function (result) {
                    // CODE for error
                }
            });
        });

Answer 1

Браузерам просто не разрешено выполнять запрос cors из локального файла. Он должен быть запущен с веб-сервера. Если вы откроете файл типа «C: \ temp.html» и запустите скрипт там, эта ошибка произойдет. Однако, если вы откроете его из 'http://localhost/temp.html',, запрос cors может быть разрешен, учитывая, что принимающий сервер разрешает запросы cors, и вы отправляете запрос cors до отправки запроса ajax. Я не уверен, что ваша строка $ .support.cors = true; достаточно включить Cors для этого конкретного запроса. Возможно, эта строка включает ее глобально, но вам все равно нужно присоединить заголовок cors к запросу ajax.