vue3.7.0跨域

再做尚硅谷的vue外卖项目，改用刚刚升级的vue3.7.0

结果很多问题，public成为静态资源目录，而跨域出了问题

参考其他人经验，项目根目录新建vue.config.js

 

module.exports = {
    devServer: {
        open: true,
        host: 'localhost',
        port: 8081,
        https: false,
        //以上的ip和端口是我们本机的;下面为需要跨域的
        proxy: { //配置跨域
            '/api': {
                target: 'http://localhost:4000', // 填写后台接口
                ws: true,
                changOrigin: true, //允许跨域
                pathRewrite: {
                    '^/api': '' //请求的时候使用这个api就可以
                }
            }

        }
    }
}

然后/src/api/index.js

import ajax from './ajax'
const BASE_URL = '/api'

//  [1、根据经纬度获取位置详情](#1根据经纬度获取位置详情)<br/>
export const reqAddress = (geohash) => ajax(`${BASE_URL}/position/${geohash}`)

//  [2、获取食品分类列表](#2获取食品分类列表)<br/>
export const reqFoodTypes = () => ajax(BASE_URL+'/index_category')

结果还是不行

折腾好久……

最后server端按一下ctrl+c，准备重启，这个时候，开始接收数据，然后就跑通了

无语了