JS请求跨域问题及URL的结构分析
1.URL结构分析
以下面地址为例： http://www.aespxfans.com.cn:8080/news/index.aspboardId=5&Id=24618&page=1&pageNum#name
URL组成包括：协议，域名，端口，路径组成。
从上面的URL可以看出：
①协议部分：该URL协议部分是“http:”，在互联网（Internet）中还有多种协议，例如HTTP，HTTPS，FTP等等，跟在HTTP后的双斜杠不是协议组成部分，这“//”是与域名或者IP地址分隔符。
②域名部分：“www.aespxfans.com.cn”是域名部分，在URL中还可以使用IP地址表示。
③端口部分：8080是该URL的端口，端口不是必须部分，如果省略则访问默认的端口。
④路径部分：端口后面表示路径组成部分。
2 .同源问题
如果两个URL协议，域名，端口相同则表示同源。
- 跨域问题
跨域，指的是浏览器不能执行其他网站的脚本。同源策略规定，AJAX 请求只能发给同源的网址，否则就报错。
跨域请求通常不会携带 cookies 信息，为了能让跨域请求带上 cookies，需要在前端设置：
xhr.withCredentials = true
这个配置需要后端的配合，需要在服务器端在响应是带上 Access-Control-Allow-Credentials , 同时它的值必须为 true：
Access-Control-Allow-Credentials: true
设置 withCredentials 为true 后, 在与服务器进行通信时会携带这个域名下的所有 cookies。
4.参考资料
https://www.extlight.com/2017/09/26/%E8%AE%B0%E4%B8%80%E6%AC%A1%E8%B7%A8%E5%9F%9F%E9%97%AE%E9%A2%98%E7%9A%84%E8%A7%A3%E5%86%B3%E6%96%B9%E6%A1%88/
网友评论