JQuery Ajax Basic Authentication Header не работает правильно

Question

Я пытаюсь сделать простой запрос GET на сервере в JQuery.

$.ajax({ 
     headers: { 
      "Authorization": "Basic " + btoa("hello" + ":" + "world") 
     }, 
     url: "http://hello.world?Id=1", 
     method: "GET", 
     success: function() { 
     }, 
    }).then(function() { 
    }); 

Проблема в том, что, когда запрос отправляется, заголовок аутентификации не ставится в запрос правильно:

Host: hello.world 
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:43.0) Gecko/20100101 Firefox/43.0 
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 
Accept-Language: de,en-US;q=0.7,en;q=0.3 
Accept-Encoding: gzip, deflate 
Access-Control-Request-Method: GET 
Access-Control-Request-Headers: authorization 
Origin: null 
Connection: keep-alive 
Cache-Control: max-age=0 

Answer 1

При отправке запроса HTTP в другое происхождение, запрос может быть либо " простой "или" непростой ". Запрос становится непростым, если он использует либо (или оба)

• HTTP-глагол, отличный от HEAD, GET или POST; или
• Запрос заголовка кроме Accept, Accept-Language, Content-Language или Content-Type

Поскольку ваш запрос устанавливает заголовок Authorization, он не является простым.

Если запрос прост, браузер сначала отправляет предполетный запрос с использованием метода OPTIONS. Это запрос, который вы видите в своем вопросе. (См. HTML5 Rocks on preflight requests и [мой ответ на How does Access-Control-Allow-Origin header work?). Предполетный период не включает в себя непростые заголовки, но перечисляет их в заголовке Access-Control-Request-Headers.

Если сервер правильно отвечает на предполетный борт, браузер будет , затем выдаст реальный запрос. В этом случае браузер ищет ответный заголовок Access-Control-Allow-Headers: Authorization с сервера, чтобы указать, что непростой заголовок Authorization можно отправить в фактический запрос. Ваш сервер должен включить этот заголовок в свой ответ.