在其他的网站上加载远程js执行一些操作遇到跨域问题:
ccess to XMLHttpRequest at 'http://r.com/index.php/api/index/tpl' from origin 'http://991999.net' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
GET http://r.com/index.php/api/index/tpl net::ERR_FAILED
请求的接口是php服务器,在服务器后端代码添加:
header("Access-Control-Allow-Origin:*");
或者在apache环境修改域名配置:
<VirtualHost *:80>
DocumentRoot "E:\PHP\www\tp\public"
ServerName r.com
ServerAlias
<Directory "E:\PHP\www\tp\public">
Options FollowSymLinks ExecCGI
AllowOverride All
Order allow,deny
Allow from all
Require all granted
Header set Access-Control-Allow-Origin * #添加这一行
</Directory>
</VirtualHost>
nginx环境:
location / {
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
if ($request_method = 'OPTIONS') {
return 204;
}
}
遇到一点问题:
header("Access-Control-Allow-Origin:*");
header("Access-Control-Allow-Methods","GET,POST");
header("Access-Control-Allow-Credentials", "true");
这三行代码一起使用的时候会出错,跨域不了。
只用Origin即可
还可以使用ajax的jsonp。
jquery-1.8.2.min.js:2 Access to XMLHttpRequest at 'http://r.com/index.php/api/index/tpl' from origin 'http://991999.net' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
因为自己的多了withCredentials,注释掉即可:
$.ajax({
type:'GET',
url:url,
async:false,
dataType: 'html',
// xhrFields: {
// withCredentials: true
// },
timeout: 10000,
crossDomain: true,
success:function(data){
var div = document.createElement('div');
div.innerHTML = data;
div.id=id;
document.body.appendChild(div);
}
});
更多: