使用jQuery / ajax进行基本身份validation

我正在尝试创建基本身份validation页面，其中我的表单有三个字段

1. 用户名
2. 密码
3. 授予类型

在提交表单时，我只想在JSON格式的HTML上显示来自服务器的返回响应。 我对Web服务的AJAX调用还需要设置Authorization标头。 但不知何故标题没有设置。 我在尝试

beforeSend : function(xhr) { xhr.setRequestHeader('Authorization', "Basic ******"); xhr.setRequestHeader("contentType", "application/json;charset=UTF-8"); } 

但是当我在控制台中调试代码时，似乎断点永远不会进入这个function。 我是Ajax的新手，并通过在互联网上搜索下面的代码。 我在下面发布完整的代码。

码：

 $(document).ready(function() { // process the form $('form').submit(function(event) { // get the form data var formData = { 'username': $('#username').val(), 'password': $('#password').val(), 'grant_type': $('#grantType').val() }; // process the form $.ajax({ type : 'POST', url : 'http://localhost:9090/oauth/token', beforeSend: function (xhr) { xhr.setRequestHeader("Authorization", "Basic ******"); xhr.setRequestHeader("contentType", "application/json;charset=UTF-8"); }, data : formData, // our data object dataType : 'json', // what type of data do we expect back from the server encode : true }) // using the done promise callback .done(function(data) { // log data to the console so we can see console.log(data); alert(data); // here we will handle errors and validation messages }) .fail(function (jqXHR, textStatus){ alert('Status : ' + textStatus + '' + JSON.stringify(jqXHR)); }); // stop the form from submitting the normal way and refreshing the page event.preventDefault(); }); }); 

它导致不在我的代码中设置标头的原因。 请指正。

在网络标签的控制台（谷歌浏览器）中，我可以看到下面的请求标题

 Accept:*/* Accept-Encoding:gzip, deflate, sdch Accept-Language:en-US,en;q=0.8 Access-Control-Request-Headers:accept, authorization, content-type, contenttype Access-Control-Request-Method:POST Connection:keep-alive Host:192.168.1.128:9090 Origin:null User-Agent:Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36 

控制台中出现以下错误。

当从Google Chrome的Advanced Rest Client扩展程序调用相同的API时，它会向我显示所有标题

 User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36 Origin: chrome-extension://hgmloofddffdnphfgcellkdfbfbjeloo contentType: application/json;charset=UTF-8 Authorization: Basic ********** Content-Type: application/x-www-form-urlencoded Accept: */* Accept-Encoding: gzip, deflate Accept-Language: en-US,en;q=0.8 

我只是使用文件协议运行我的网页。

例如： file:///E:/Mahendra/Practice%20Example/Test/OauthTest.html

我不确定这是否会导致问题。

Answer 1

我通常会添加这样的Headers（代码来自“在Sharepoint中使用Web代理查询远程服务”， 这里 ）：

  $.ajax({ url: "../_api/SP.WebProxy.invoke", type: "POST", data: JSON.stringify( { "requestInfo": { "__metadata": { "type": "SP.WebRequestInfo" }, "Url": url, "Method": "GET", "Headers": { "results": [{ "__metadata": { "type": "SP.KeyValue" }, "Key": "Accept", "Value": "application/json;odata=verbose", "ValueType": "Edm.String" }] } } }), headers: { "Accept": "application/json;odata=verbose", "Content-Type": "application/json;odata=verbose", "Authorization": "yourkeyvalueforauthorizationEXAMPLE", "X-RequestDigest": $("#__REQUESTDIGEST").val() }, success: successHandler, error: errorHandler }); 

让我知道事情的后续