配置vue的跨域，请求数据库里的数据 接上篇

第一步 : 我们需要在vue目录下面建一个文件vue.config.js

vue.config.js属性可以参考一下官网 配置参考 | Vue CLI (vuejs.org)

vue.config.js是使用module.exports来进行抛出的，因为它是用node来读取的，在vue里面抛出是import当文件里有它时默认就会执行，

在vue.config.js里面写配置文件夹

module.exports = {
  devServer: {
    open: true,   //设置open为true时项目启动浏览器默认打开
                 //proxy:{'/api':{}},代理器中设置/api,项目中请求路径为/api的替换为target
    proxy: {    //代理配置
      "/api": { 
        target: "http://10.161.58.15:3000",  //代理地址，这里设置的地址会代替axios中设置的baseURL
        changOrigin: true, // 如果接口跨域，需要进行这个参数配置
        pathRewrite: {   //pathRewrite方法重写url
          "^/api": "",.
                //pathRewrite: {'^/api': '/'} 重写之后url为 http://192.168.1.16:8085/xxxx
                //pathRewrite: {'^/api': '/api'} 重写之后url为http://192.168.1.16:8085/api/xxxx
        },
      },
    },
  },
};

target里的 http：//10.161.58.15 是你电脑里面的ip, 后面的 :3000 是你在koa里面写的端口号

这样跨域配置好了，下面是请求数据库里的数据

请求数据库里的数据

1 首先写axios请求

在axios请求时，

定义一个方法来请求数据 url里面的路径就是你在koa方法里面定义的路径

在页面里面调用这个方法就可以拿到你数据里面的值了，这里我用的vue3