Question

我阅读了很多关于“Access-Control-Allow-Origin”问题的论坛。大多数论坛要求使用dataType：'jsonp'，但通常jsonp会点击GET请求，我想做POST请求。最终GET请求也不起作用。

实际上我将iPhone应用程序转换为PhoneGap，因此将Objective-c代码重写为HTML-5＆amp; Jquery移动。我想要击中的网址在objective-c中非常有效。

这是objective-c代码

NSString *username=[self urlEncodeValue:[userNameField.text stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceCharacterSet]]];
NSString *password=[self urlEncodeValue:[passWordField.text stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceCharacterSet]]];
NSString *params = [[NSString alloc] initWithFormat:@"username=%@&password=%@",username,password];

NSData *paramData = [params dataUsingEncoding:NSASCIIStringEncoding allowLossyConversion:YES];
[params release];
NSString *paramsLength = [NSString stringWithFormat:@"%d", [paramData length]];

NSString *urlString=[[NSString alloc] initWithFormat:@"%@?",[dict valueForKey:@"LoginAuthentication"]];

NSURL *authURL = [NSURL URLWithString:urlString];
[urlString release]; 

NSHTTPURLResponse *authenticationResponse= nil; 
NSMutableURLRequest *authenticationRequest = [NSMutableURLRequest requestWithURL:authURL];
[authenticationRequest setHTTPMethod:@"POST"];
[authenticationRequest setValue:paramsLength forHTTPHeaderField:@"Content-Length"];
[authenticationRequest setHTTPBody:paramData];
NSError *error = nil;
int errorCode;

NSData *responseData = [NSURLConnection sendSynchronousRequest:authenticationRequest  
          returningResponse:&authenticationResponse 
             error:&error]; 

if ([authenticationResponse respondsToSelector:@selector(allHeaderFields)]) {
    //success
}

以上代码效果很好。

这是我转换为javascript的代码，它给出了“Access-Control-Allow-Origin”错误

$(document).ready( function() {
    $.ajax({
        type: "POST",
        crossDomain: true,
        //dataType:'jsonp',
        //callback: '?',
        url : "https://externalserver.com/loginAuth?", 
            data : {'username' : 'username', 'password' : 'password'},
        success : function (response) {
            alert('login failed');
        }, 
        error: function(e){
            console.log(e);              
        }
    });
});

我尝试使用GET / POST请求，并尝试在某个本地服务器上运行此本地文件。什么都行不通。

我收到以下错误消息

XMLHttpRequest无法加载https://externalserver.com/loginAuth？   Access-Control-Allow-Origin不允许使用null。

XMLHttpRequest无法加载https://externalserver.com/loginAuth？   Access-Control-Allow-Origin不允许使用null。

Answer 1

浏览器不允许您从其他域请求资源（图像和脚本文件是此规则的明显例外）。

这可以通过几种方式解决。

第一种方法是使用JSONP调用（当前的跨域访问标准），是的JSONP只允许GET。但这只是解决方案的一部分。还需要更改服务器端以允许跨域调用。

为了能够从javascript访问外部资源。远程资源必须在响应头中包含access-control-allow-origin。如果您可以控制该资源，则需要将此响应标头添加到*（如果您想要更受限制的访问控制，则需要添加您的域）。当然，这部分解决方案将取决于您的服务器端架构（PHP，ASP.NET，JSP ......）

这是一个详细描述的PHP / jQuery解决方案：http://www.fbloggs.com/2010/07/09/how-to-access-cross-domain-data-with-ajax-using-jsonp-jquery-and-php/

同样返回结果必须包装到jsonpCallback函数中，所以返回应该看起来像这样：
```
someFunction("{...}");
```
someFunction 是回调函数的名称，经典JSON是{....}。你可以看到，它包含在 someFunction（。

jQuery方应该看起来像这样：
```
$.ajax({url: server_url,
    type: "GET",       
    data: save_data,
    dataType: "jsonp",
    jsonpCallback: 'successCallback',
    async: true,
    beforeSend: function() {

    },
    complete: function() {

    },
    success: function (result) {

    },
    error: function (request,error) {

    }, 
    successCallback:function(){

    }
});
```
http://devlog.info/2010/03/10/cross-domain-ajax/
或代理解决方案。我不打算写它，因为我从未测试过它。仅当您无权访问服务器端代码时才使用此解决方案：

http://jquery-howto.blogspot.com/2009/04/cross-domain-ajax-querying-with-jquery.html http://developer.yahoo.com/javascript/howto-proxy.html

Answer 2

PhoneGap应用程序被视为移动应用程序，而不是浏览器，因此交叉来源很好。您需要更改服务器代码才能添加此标题

Access-Control-Allow-Origin: *

这将允许空来源，这是PhoneGap请求被发送的内容。这应该适用于GET和POST请求，而无需使用JSONP。

发送jQuery Post的Access-Control-Allow-Origin错误

2 个答案: