[vue] 前后端不在同一网络下，前端解决跨域

1、vue.config.js中配置devServer

 devServer: {
    proxy: {
      "/api": {
        target: "http://xxx:端口", // 将请求代理到后端的地址
        changeOrigin: true,
        pathRewrite: {
          "^/api": "", // 如果后端接口不包含 '/api' 前缀，可以将其替换为空字符串
        },
      },
    },
  },

request.js中，封装axios时，根路径不用再写一遍后端地址

// 创建axios实例
const service = axios.create({
    baseURL: "/api",
  /*
   * 超时
   * timeout: 90000
   */
});

正常封装api接口

import request from "@/utils/request";


export function getSonglist(data) {
  return request({
    url: "/xxx",
    method: "post",
    data: data,
   
  });
}

————————————————

原文链接：https://blog.csdn.net/weixin_49668076/article/details/135942454