vue2中使用mockjs,碰到404和431解决问题记录

647 阅读1分钟

首先说一下在vue项目中怎么使用mockjs
// 这里解释一下-D是说我们在开发也就是在本地写代码时用到的。在打包后线上是不用的,所以我们没有用-S。
1、安装mockjs: npm install mockjs -D
2、在src下api文件夹里创建了一个monck.js (不在api里也行,在src下直接创建也行) 3、在main.js里引用mock.js,这里我做了一下判断。如果是开发环境我们就走我们的mock.js文件

20221011-095416.jpg
4、编写mock.js模拟后台给的路径和返回的数据

const Mock = require('mockjs')
Mock.mock('/api/antv',()=>{
    code:200,
    msg:'成功'data:{
    // 这里就是你和后端写的是什么 字段,data是对象还是数组,自己写就行了
    id: 'Classification', children: [ { id: 'Logistic regression', }]
    }
})

5、在vue组件里写

import axios from 'axios'
export default{
methods:{
     getAntv(){
     // 注意这个/api/antv要和你mock.js里的路径一致
     axios.get('/api/antv').then(res=>{
         console.log('res',res)
     })
     }
}
}

6、就这样我就开始用了,然后先遇到了404
这个问题是因为我vue.config.js里配置了代理,代理地址是后台的,我把代理地址的target改成我的localhost:8080就解决吧
7、又遇到了431
这个问题我把vue组件里的 axios.get改成了 axios.post好了。因为我的项目没有登录没有token这一说,网上好些说是因为这个。我的就是改成axios.post就好了