深入理解ajax跨域问题

in 笔记 with 0 comment

谁的问题

其实跨域问题的产生不是后端的问题,是浏览器做了限制。但只要type不是XHR请求,浏览器是不会去做限制的。
D7328B9CCC8F431EADD98F38AE04AA2B.png

跨域条件

4BE3C484715940F9968D7805F7038DA5.png

跨域的解决方法

F34A94D5CBC144D59A793895A5283ADC.png

浏览器解决跨域

JSONP解决跨域

跨域解决方向

被调用方解决

可以是被调用方的Nginx实现或者服务器Tomcat实现或者Spring框架实现

tomcat应用服务器配置

631F99687DE643CCB58996AC7ED62943.png
53B80B615DEB492C809FB902CFB6BBD1.png
A61C0A71D4304E29B189CF640C80549F.png
8CC169861BCD4FF48A1A52C8133E487C.png
简单请求先执行后判断
F3FA2F0850E742F3A887BE83AD3396D1.png
9894FC78CC3E4DE6979C95950946EDFA.png
预检命令:(非简单请求先判断后执行,浏览器会先发出一个OPTIONS)
4CD79BAB19954EB5A3FE868C8E454496.png
带cookie的ajax跨域(cookie是被调用方的cookie)
15C9CC3325DE479A9EBB0204C6E476E9.png
通用方法:动态设置origin
0457E8562A2A42E2B666305FDCBF1627.png
通用方法:动态设置自定义header
32B2DA60B9A44C7889BF0E26622E8D34.png

Nginx配置

3D39C8FB853A4DEC96A01C5F01D127F4.png

Spring配置

8F10FA7A6FA94603BCCF7E927DF7335C.png

调用方解决

846C4A6E1555425C9B0366CA97649894.png
1BDA46BFC2C549EFAA6C7ACAA71F7F6E.png