JS 解惑 - 跨域 cookie 文件

Question

本文主要说一个容易理解错误的地方，和常见的 2 种跨域方式。

概念

经常有人会说，如何解决跨域 cookie 携带的问题，具体指哪里的 cookie 呢？我们知道，既然跨域了，那么前台和后台肯定不在同一个域上，也就是出现了两个域。

比如：

1. 前端的域为：www.page.com
2. 后台的域为：www.back.com

那么，使用 www.page.com 调用 www.back.com 的接口时，是携带哪个的 cookie 呢？明确告诉你，是 www.back.com。

这个写出来大家可能都知道，但是实际中有时候就搞混了，比如，你通过 chrome F12 看到当前页面 www.page.com 下有 cookie，但是就是请求后台接口 www.back.com 的时候没携带上，你就说跨域了，没带 cookie 有问题。

其实，你应该是去看 www.back.com 这个域下本身有没有 cookie！！！

对于这个问题，我也犯了一次混。

就是在手机 H5 页面上，H5 是通过 Webview 打开的，H5 所在的域下面手机客户端写了一堆 cookie。但是与后台通信的时候，命名配置了跨域处理，而且允许携带 cookie 了，但是就是没带到后台。现在大家知道为什么了吧？

场景

为什么跨域操作要携带参数给后台，有一种场景可能经常用。

比如：前台后完全分离的系统，前台登录后，后台会写入一些登录的凭证到 cookie，以后前台再调用后台接口的时候，如果后台接口的 cookie 的数据能在请求的时候自动携带上，那么后台就可以校验，请求是否合法。

跨域的 2 种常见处理

1. 使用 CORS 跨域处理，参考： 阮一峰-跨域资源共享 CORS 详解
2. jsonp 处理（这个不能带 cookie，而且其实全部是 get 请求）

补充

对于无法携带 cookie 的情况，前台可以用参数的形式将后台需要的数据，再每次调用接口时传递，但是这种情况，安全性就是个考研。