前端从跨域到跑路

前端跨域问题

• 解决跨域问题首先必须了解同源策略

同源策略，它是由Netscape提出的一个著名的安全策略。
现在所有支持JavaScript 的浏览器都会使用这个策略。所谓同源是指，域名，协议，端口相同。
例如：
当你从你本地http://127.0.0.1:8080访问你的项目接口http://www.xxxxxx.cn/api/..时,
http://127.0.0.1:8080 中 http就是协议  127.0.0.1为你本机ip地址  端口号为8080
而在你项目接口中  
www.xxxxx/cn即为域名(一般域名都会被DNS解析为ip地址) 端口号也有默认值
此时很明显，我们没有做到同源策略的规定，没有保证三者(协议，域名，端口号)一致，跨域的问题便接踵而来

怎么解决？其实网上有大多解决方案，此处我要记录的不是此问题，所以就不做阐述

 一般跨域解决方案，当然也是我比较常用的，如下
1.通过jsonp跨域;
2.nodejs中间件代理跨域,如vue+node.js
3.nginx代理跨域等等,当然适自己的情况而定
4.此外还可以对chrome浏览设置 可参考：https://www.cnblogs.com/cshi/p/5660039.html

• 记录一大坑----- cookies跨域问题

项目中开始做登录，在使用ajax请求登录接口的时候，后台返回给我的set-cookie居然没有保存到我本地?

说明：

1.后台采用php的laravel框架，将状态信息保存在服务器session，返回给客户端的set-cookies虽然在响应信息中，但是没有保存到我本地cookies;

2.关于登录状态信息的保存一般会使用cookie会话机制和token;

就在发现这个问题的时候，后台说让我用form表单提交，不用ajax了，what？？？？

登录接口使用ajax，set-cookies保存不到本地，然后我就使用表单提交

看来表单提交一瞬间就成功的跳转页面了，返回登录成功的json信息，结果奇迹出现了，set-cookies的值保存到了本地

可是一看，不对劲啊，页面跳转了，而且本地cookie中的域名不在是我本地的了 127.0.0.1，变成了项目域名www.xxxx.cn

然后尝试各种模拟表单提交的骚操作，比如：ifream隐藏，禁止页面跳转等等，结果都不行。能不麻烦别人就别麻烦别人嘛！

问题还是要解决的，把代码从本地提交到服务器上一跑，乖乖，奇迹出现了。切，这算什么奇迹，不就是当前本地地址换成了和接口相同的域名吗，直到此刻，才发现cookie跨域是个坑

对cookie没有深入了解，还是自己的锅！！！！