背景

需要在本地开发环境中(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 添加对应的条目