跨域问题原因是前端代码放在A服务器上,其中的脚本需要访问B服务器的接口,此时在浏览器上因为安全问题限制访问
因此需要在B服务器的配置白名单中加上A。
服务器需要向发出的 http 响应中添加一些 Access-Control 标头,以指示哪些网页有权从 Web 浏览器读取该信息
"Access-Control-Allow-Origin": "*"
如果只是调试用,可以在A服务器上配置代理到B服务器,如nginx配置如下:
location /proxy {
proxy_pass B服务器地址;
}
然后将代码中访问B服务接口的地址都改成A服务代理地址,这样浏览器认为只访问A一个域名,就不会引起跨域问题了。
cookie跨域问题
在登录认证中经常存在如下场景,从A服务器认证后返回cookie,然后用该cookie去B服务器鉴权。此时因为跨域浏览器不会自动带上cookie。
如果是js代码,需要加上如下语句
fetch(url , {credentials : "include"});
如果是unity webgl,需要在html中重载fetch函数
const originalfetch = fetch;
fetch = function( url,data) {
console.log("url received: " + url);
if (url.indexOf('https://www.replacethatwithyourserveraddress.com/') === 0 || url.indexOf('http://localhost:4000') === 0 || url.indexOf('http://127.0.0.1:4000') === 0) {
data = {...data, ...{credentials : "include"}};
console.log("withCredentials set to true " + JSON.stringify(data) + " url: " + url );
} else {
console.log("withCredentials NOT SET for URL: " + url);
}
return originalfetch(url,data);
};