通过nginx反向代理实现跨域访问
通过nginx反向代理实现跨域访问
同源策略
- 同源策略是一种约定，它是浏览器最核心也最基本的安全功能
- 同源 指的是 域名、协议、端口都相同。如果其中有一个不同，浏览器会认为不同源，也就是跨域
跨域访问实现过程
- 写一段最简单的请求后台的代码，将后台返回结果在控制台输出，此时，浏览器请求地址和代码里请求后台的url地址是同源的，页面没有报错，后台返回的结果输出到控制台里：
前端html代码
请求结果
- 然后，我换个请求后台的url地址，将a.tankhui.cn 换成 b.tankhui.cn 但在nginx中实际他们指向的访问目录是一样的。此时，浏览器请求地址a.tankhui.cn和代码里请求后台的url地址 b.tankhui.cn 不同源，所以，页面出现了跨域报错 。
将a.tankhui.cn 换成 b.tankhui.cn
出现跨域报错
- 下面是此时的后台 ngixn配置：
nginx配置
- 现在为了可以访问 b.tankhui.cn 的内容，又要解决跨域的问题，我在前端代码中还是请求 a.tankhui.cn ，然后，在nginx配置中，将来自 a.tankhui.cn 的后端请求代理到 b.tankhui.cn，此时可以正常访问 b.tankhui.cn的内容
请求代理到 b.tankhui.cn
来自 b.tankhui.cn的请求结果
- 为了证实请求确实被转发到 b.tankhui.cn，我在nginx配置中，将访问日志记录到特定的文件下：
设置 b.tankhui.cn的访问日志，注意server_name 是 b.tankhui.cn
- 当我访问 http://a.tankhui.cn/index.html 时，能看到 b.tankhui.cn 网站的访问日志确实有记录：
b.tankhui.cn nginx 日志记录
- 此时，已经实现了跨域的访问。然而，上面是将所有来自 a.tankhui.cn 的后台请求，都转发到了 b.tankhui.cn, 这种方式比较粗暴，实际工作中，只有一部分请求，需要代理到其他网站。
- 下面，为了标识需要代理到b.tankhui.cn 的请求，请求后台的 url地址 后面加一个flag=1的参数：
请求参数加了 flag=1
- 相应地，在后台nginx配置中，给 flag先赋一个初始值 0，只有当请求参数中带有 flag=1的，将flag的值变为1，认为需要代理到 b.tankhui.cn。
根据 flag的值判断是否需要代理到 b.tankhui.cn
- 现在我改变不同的请求后台的url地址，发现,只有 带有flag=1的请求，才会被代理到b.tankhui.cn, 并能在b.tankhui.cn 的nginx访问日志中看到。
改变 url的值，请求文件和flag不同
url='http://a.tankhui.cn/newTest.php?flag=1'
url = 'http://a.tankhui.cn/test.php'
b.tankhui.cn nginx日志
- 这样就可以将特定的请求代理到其他网站，实现跨域访问。
