mock数据和后端请求接口如何共存

朝霞暖暖

于 2021-01-08 17:12:26 发布

阅读量3.7k

点赞数 2

本文链接：https://blog.csdn.net/weixin_42401141/article/details/112372461

版权

在开发Vue项目时，需要在已有后端接口的基础上使用Mock数据进行新模块的开发。通过在vue.config.js中配置代理，实现'/user/info'请求转发到Mock，其余请求转发到后端。然而，实际操作中可能会遇到404错误。解决办法是检查和调整代理配置，适应项目中使用的框架包版本，确保Mock数据和后端接口的正确访问。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

mock数据和后端请求接口如何共存

要开发一个vue项目，直接在以前其他项目的代码上改，项目基础模块包括登录已经完成，所以是带后台的，增加新的模块时想先采用mock来模拟后台数据，所以就要考虑到mock数据和后端接口共存的问题。

然后在网上查到的方法都如下：

具体参考：http://www.bubuko.com/infodetail-3099079.html

在项目根路径下的vue.config.js中配置如下：

devServer: {
    port: port,
    open: true,
    overlay: {
      warnings: false,
      errors: true
    },
    proxy: {
      // change xxx-api/login => mock/login
      // detail: https://cli.vuejs.org/config/#devserver-proxy
      [process.env.VUE_APP_BASE_API+‘/user/info‘]: {
        target: `http://localhost:${port}/mock`,
        changeOrigin: true,
        pathRewrite: {
          [‘^‘ + process.env.VUE_APP_BASE_API]: ‘‘
        }
      },
      [process.env.VUE_APP_BASE_API]:{
        target: process.env.VUE_APP_BASE_API,
        changeOrigin: true,
        pathRewrite

最低0.47元/天解锁文章