Невозможно получить заголовки из запроса jQuery AJAX в ASP.NET Web API
У меня есть ASP.NET Web API, который размещен на Azure. Я интегрировал обработчик HTTP-сообщений в этот API. Обработчик сообщений получает удар, когда я нажимаю его с помощью вызова AJAX. Я также отправляю заголовок запроса в моем вызове AJAX. Проблема в том, что я не получаю заголовок, отправленный из вызова AJAX в Обработчик сообщений, интегрированный в Web API. См. Изображение: скриншот отладчика
Ниже приведен код моего запроса AJAX:
$.ajax({
url: "https://someservicename.azurewebsites.net/Service/RequestHandler",
beforeSend: function (xhr) {
xhr.setRequestHeader('Token', '86810e135958961ad4880ad');
},
type: "POST",
crossDomain: true,
data: {
param: "Passed Parameter"
},
success: function (msg) {
console.log(msg);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
console.log(textStatus);
}
});
Обработчик сообщений в Web API выглядит следующим образом:
protected async override Task<HttpResponseMessage> SendAsync(HttpRequestMessage request, CancellationToken cancellationToken)
{
string authToken;
try
{
authToken = request.Headers.GetValues("Token").FirstOrDefault();
if (authToken != "86810e135958961ad4880ad")
{
return await Task.Factory.StartNew(() =>
{
return new HttpResponseMessage(HttpStatusCode.BadRequest)
{
Content = new StringContent("Unauthorized access!")
};
});
}
else
{
return await base.SendAsync(request, cancellationToken);
}
}
catch (System.InvalidOperationException)
{
return null;
}
}
Когда я запускаю код с моего IIS localhost, отправляемый запрос выглядит примерно так:
Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:token
Access-Control-Request-Method:POST
Connection:keep-alive
Host:someservicename.azurewebsites.net
Origin:http://localhost:12522
Referer:http://localhost:12522/pocppd.html
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36
И ответ, который я получаю в консоли:
https://someservicename.azurewebsites.net/Service/RequestHandler. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:12522' is therefore not allowed access. The response had HTTP status code 500.
С клиентом POSTMAN запрос работает нормально, но с localhost он возвращает ошибку. Пожалуйста, дайте мне знать причину отсутствия заголовка в моем обработчике сообщений?
2 ответа
Вы должны добавить это в ваш Web.config (вы можете изменить значения, как вам нужно):
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Authorization, Token" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE" />
</customHeaders>
</httpProtocol>
Перед вашим запросом отправляется запрос OPTIONS, чтобы убедиться, что вам разрешено выполнять запрос. Как говорится в сообщении об ошибке: "Ответ на предварительный запрос не проходит проверку контроля доступа: в запрошенном ресурсе отсутствует заголовок" Access-Control-Allow-Origin ".". Добавление вышеуказанных строк в Web.config передаст необходимый заголовок.
MDN говорит: "В отличие от простых запросов (описанных выше), " предварительно проверенные "запросы сначала отправляют заголовок запроса HTTP OPTIONS ресурсу в другом домене, чтобы определить, является ли фактический запрос безопасным для отправки. Межсайтовые запросы предварительно просвечиваются. как это, так как они могут иметь последствия для пользовательских данных. "
Попробуй это
$.ajax({
url: "https://someservicename.azurewebsites.net/Service/RequestHandler",
headers: {
"Token": "86810e135958961ad4880ad"
},
type: "POST",
crossDomain: true,
data: {
param: "Passed Parameter"
},
success: function (msg) {
console.log(msg);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
console.log(textStatus);
}
});