Vue request接口get请求正常,post请求失效,一直处于pending状态

在做项目中,我们要是自己搭建一个vue项目框架需要耗费很多时间。所以很多时候方便快速开发,直接利用网上的各种框架。最近在网上下了一个vue2模板项目,在开发过程中利用它封装的request方法请求接口过程中,发现一个post接口请求一直响应超时,但是在postman上测试接口,数据能正常返回,奇怪的是get请求也能够请求成功,说明代理配置上也是没问题的。

以前用若依框架也没遇到过这个问题啊。网上各种搜有人分析是post的数据格式。但是我看request方法里面格式也没做处理啊,寻思一翻最终想到这个罪魁祸首mock。

大家先了解一下mock:

在 vue 或 react 项目中使用 mockjs 搭建 mock server_react 添加mock_不怕麻烦的鹿丸的博客-CSDN博客

我这个框架有登录,所以用到了mock,mock对请求做了处理,判断你系统有没有引入mock,看下vue.config.js配置里这行属性:

最终网友的解决办法来了:

两种办法,再次处理返回数据格式和直接注释mock引入。要是没用到数据模拟的话,直接注释就好。重启项目请求访问正常了。

proxy: {
    
    
    '/dev-api': {
    
    
        target: 'http://1x.xx.x.xxx:xxxx', //
        changeOrigin: true,
        pathRewrite: {
    
    
          '^/dev-api': ''
        },
        //第一种方法
        onProxyReq: function(proxyReq, req, res, options) {
    
    
          if (req.body) {
    
    
            const bodyData = JSON.stringify(req.body)
            // incase if content-type is application/x-www-form-urlencoded -> we need to change to application/json
            proxyReq.setHeader('Content-Type', 'application/json')
            proxyReq.setHeader('Content-Length', Buffer.byteLength(bodyData))
            // stream the content
            proxyReq.write(bodyData)
          }
       }
   }
},
//第二种方法,注释这行
before: require('./mock/mock-server.js')