本文主要介绍Cookie跨域问题解决方案的代码示例，在本文中非常详细。对大家的学习或者工作都有一定的参考价值，有需要的朋友可以参考一下。

一、前言

随着项目模块越来越多，现在很多模块都是独立部署的。模块之间的通信有时可以通过cookie来完成。例如，门户和应用程序分别部署在不同的机器或web容器中。如果用户登录并在浏览器客户端写了一个cookie(记录了用户的上下文信息)，而应用又想获取门户下的cookie，这就导致了cookie跨域的问题。

二、介绍一下cookiev　

Cookie路径：

一般来说，cookie是由访问页面的用户创建的，但并不是只有创建cookie的页面才能访问这个cookie。默认情况下，出于安全原因，只能访问与创建cookie的页面位于同一目录或位于创建cookie的页面的子目录中的网页。这时，如果你想让父网页或者整个网页都能够使用cookie，就需要设置路径。

指示路径cookie所在的目录。默认的ASP.NET是/，它是根目录。在同一个服务器上，有如下目录：/test/、/test/cd/、/test/dd/。现在，cookie1的路径是/test/，cookie2的路径是/test/cd/，所以所有被测页面都可以访问cookie1，但是/test/和/test/dd/的子页不能访问cookie2。这是因为cookie可以使其路径path下的页面可访问。

如何使其他目录或父目录可以访问该cookie集：

document.cookie=' name=valuepath=/'；

Cookie域：

域是指cookie所在的域，默认为请求的地址。例如，如果URL是www.jb51.net/test/test.aspx,则域默认为www.jb51.net。以及跨域访问，比如A域是t1test.com；并且域B是t2.test.com，那么要在域A中生成一个域A和域B都可以访问的cookie，cookie的域应该设置为. test.com如果您想在域A中生成一个域A不能访问但域B可以访问的cookie，您应该将cookie的域设置为t2.test.com。

三、解决cookie跨域问题之nginx反向代理

反向代理概念

反向代理是指代理服务器在互联网上接受连接请求，然后将请求转发给内部网络上的服务器；并将从服务器获得的结果返回给请求互联网连接的客户机，此时代理服务器对外界表现为服务器。

反向代理服务器对于客户端来说就像原服务器一样，客户端不需要任何特殊的设置。向客户端反向代理的名称空间中的内容发送一个公共请求，然后反向代理将确定将请求转发到哪里(原始服务器)，并将获得的内容返回给客户端，就像它是自己的一样。

场景模拟

web1和Web2两个项目部署在同一台机器上的不同tomcat上，Web1项目的index.html请求如下：

然后点击链接请求web2项目的index.jsp，内容如下：

再看一下nginx的配置，如下所示：

工作进程2；

事件{

工人_连接65535；

}

http {

包括mime.types

default_type应用程序/八位字节流；

log _ format main ' $ remote _ addr-$ remote _ user[$ time _ local]' $ request ' '

$ status $ body _ bytes _ sent ' $ http _ referer ' '

“$ http _ user _ agent”“$ http _ x _ forwarded _ for”；

服务器名称哈希桶大小128；

client _ header _ buffer _ size 32k

large _ client _ header _ buffers 4 32k；

client _ body _ buffer _ size 8m

server_tokens关闭；

ignore _ invalid _ headers on

recursive _ error _ pages on

server _ name _ in _ redirect off

在上发送文件；

tcp _ nopush on

tcp_nodelay打开；

# keepalive _ time out 0；

keepalive _ timeout 65

上游网站1{

服务器127 . 0 . 0 . 1:8089 max _ fails=0 weight=1；

}

上游网站2 {

服务器127 . 0 . 0 . 1:8080 max _ fails=0 weight=1；

}

服务器{

听80；

server _ name 127 . 0 . 0 . 1；

字符集utf-8；

索引index.html；

位置/web/web1 {

proxy _ pass http://web 1/web 1；

proxy_set_header主机127 . 0 . 0 . 1；

proxy _ set _ header X-Real-IP $ remote _ addr；

proxy _ set _ header X-Forwarded-For $ proxy _ add _ X _ Forwarded _ For；

proxy _ set _ header Cookie $ http _ Cookie；

上的log _ subrequest

}

位置/web/web2 {

proxy _ pass http://web 2/web 2；

proxy_set_header主机127 . 0 . 0 . 1；

proxy _ set _ header X-Real-IP $ remote _ addr；

proxy _ set _ header X-Forwarded-For $ proxy _ add _ X _ Forwarded _ For；

proxy _ set _ header Cookie $ http _ Cookie；

上的log _ subrequest

}

位置/nginxstatus {

stub _ status on

access _ log on

}

error _ page 500 502 503 504/50x . html；

location=/50x.html {

根html

}

}

}

这确保了cookie在同一个域中。2 index.jsp在web2工程中的产量如下：

v

摘要

利用nginx的定向代理来解决cookies的跨域问题，实际上是通过“欺骗”浏览器来实现的。通过nginx，我们可以把不同项目的cookie放在nginx的域下，通过nginx的反向代理，我们可以得到不同项目写的cookie。实际上，美元。上述场景中的cookie ('user '，' hjzgg '，{ path:'/web ' })；Path in可以写成“/”，这样使得nginx的配置更简单，如下。

位置/网站1 {

proxy _ pass http://web1

proxy_set_header主机127 . 0 . 0 . 1；

proxy _ set _ header X-Real-IP $ remote _ addr；

proxy _ set _ header X-Forwarded-For $ proxy _ add _ X _ Forwarded _ For；

proxy _ set _ header Cookie $ http _ Cookie；

上的log _ subrequest

}

位置/网站2 {

proxy _ pass http://web2

proxy_set_header主机127 . 0 . 0 . 1；

proxy _ set _ header X-Real-IP $ remote _ addr；

proxy _ set _ header X-Forwarded-For $ proxy _ add _ X _ Forwarded _ For；

proxy _ set _ header Cookie $ http _ Cookie；

上的log _ subrequest

}

四、解决cookie跨域问题之jsonp方式请求

Jquery跨域请求：

JQuery对于Ajax跨域请求有两种解决方案，但都只支持get。分别是JQuery的JQuery.ajaxjsonp格式和jquery.getScript格式。

Jsonp格式：如果采集的数据文件存储在远程服务器上(不同域名，即跨域数据采集)，需要使用jsonp类型。如果使用这种类型，查询字符串参数callback=？此参数将被追加到请求的URL。服务器应该用回调函数名作为JSON数据的前缀，以完成一个有效的JSONP请求。是指远程服务器需要对返回的数据进行处理，根据客户端提交的回调的参数返回一个回调(json)数据，客户端会将返回的数据以脚本的形式进行处理来处理json数据。JQuery.getJSON也支持jsonp的数据模式调用。

场景模拟：

Web1和Web2两个项目部署在同一台本地机器上的不同tomcat上，它们的端口分别是8080和8089。

2/index.html内容如下：

web2/cooke.jsp内容如下：

web1/index.html的内容如下：

测试过程，先访问http://localhost:8089/web 2/index . html，F12，通过Google浏览器进行网络查看，检查内容如下：

或者通过浏览器设置-显示高级设置-隐私设置查看写入的cookie。过程如下。

然后，打开另一个窗口，访问http://localhost:8080/web 1/index . html，这个页面就是请求web2项目写入的cookie(注意，如果我们不通过jsonp访问，浏览器会提示不允许跨域访问)。类似地，F12，网络视图，如下检查返回的数据。

至此，cookies的跨域携带通过jsonp的请求完成，即web1项目成功从web2项目目录中获取cookies。可以发现，jsonp会通过回调函数处理服务器返回的数据，因为返回的可执行js代码(即cookie的路径和域被重写)，然后自动执行返回的js代码，从而达到目的。

五、解决cookie跨域问题之nodejs superagent

package.json中的模块依赖于：

调用superagent api请求：

六、同一域下，不同工程下的cookie携带问题

跨域访问后，cookie可以成功写入本地域。本地前端项目请求后端项目时，很多都是ajax请求。ajax默认不支持携带cookie，所以现在有以下两种方案：

(1).使用jsonp格式发送。

(2)将字段xhrfields:{ with credentials:true }添加到2)中。ajax请求，这样就可以携带cookie了。

因此，后台配置受到限制，并且需要配置用于跨域访问的过滤器。此外，头字段Access-Control-Allow-Origin的值不能是' * '，但必须是一个确定的域。

这就是本文的全部内容。希望对大家的学习有帮助，支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。