背景
需要在本地开发环境中(localhost),调用线上接口(跨域),但是有个关键点,本地 localhost 无法模拟线上登入(因为线上登入是 wordpress 的一个页面,而本地是纯前端项目)
解决过程
1. 现在线上完成登入
在线上完成登入,确保 cookeis 存储成功
2. 本地将接口代理下
将本地接口请求全部改成 /api
这样会请求 locahost/api
然后在通过下方代理配置
proxy: {
"/api": {
target: "线上接口地址", // 目标后端接口
changeOrigin: true, // 修改 Origin 头为目标 URL
secure: true // 如果是 https 接口,且自签名证书,需要设成 false
}
},
转发到线上,这样做的目的是让本地的 cookeis 发送过去。因为浏览器禁止跨域发送 cookies
3. 手动复制 cookeis
在线上网站打开 Devtools 中的 Application,然后在 cookies 中找到线上网站设置的所有条目(domain 为线上网站的)
然后切换到本地开发环境运行的网站,在 Devtools 的 Application 添加对应的条目