zoukankan      html  css  js  c++  java
  • axios发送post请求,服务端无法正常获取参数(比如:node服务器无法通过req.body获取参数)解决方案

    前端通过 axios 方式请求nodejis后端数据的过程中,如果是 get 请求,服务器端能够通过 req.query 获取前端传递的参数再向数据库获取数据;但是如果是 post 请求,服务器却不能通过 req.body 获取参数。

    解决办法:

    前端 引用 “qs” ,然后在发送 axios 请求时,使用 qs.stringify()将数据包裹起来。

    import qs from 'qs'
    点击并拖拽以移动
    import $http from '../../ajax/http.js'
    
    $http({
              method: "POST",
              url: "/blog/check_login_status/",
              data: qs.stringify(values)
            })
            .then(res => {
                localStorage['token'] = 1;
                this.props.history.replace("/");
            })
            .catch(err => {
                notification["error"]({
                    message: '错误图示',
                    description:
                      '用户名或密码错误',
                });
    });

    http.js: 

    import axios from 'axios'
    
    let _this = this;
    
    let HTTP = axios.create({
      baseURL:'/',
      timeout: 10000,        //单位是ms,请求超过这个时间就取消,即请求超时
      responseType: 'json',  //后端返回的数据类型
      // header:{  //自定义请求头
         'custom-header':'xiao',  //Request Headers里面就多了一个custom-header:xiao,后端可以拿到这个数据
      //   'content-type':'application/x-www-form-urlencoded'  //设置这个,那么经过transformRequest处理之后的数据格式就变为了  miaov=ketang&username=leo,只支持POST请求方式
      // },
      params: {  //查询字符串,传给后端的数据,不管是get还是post请求,这条数据都会附在url后面,发送给后端
        //TOKEN: localStorage['TOKEN']
      },
      transformResponse: [function (data) {   //数组格式,用于处理返回的数据格式,data是后端发送回来的数据
        data.abc = 'miaov'  //对返回数据做进一步处理,请求此类地址的返回值都拥有abc这个属性,值是miaov
        return data;  //需要return出来
      }]
    });
    
    //添加一个请求拦截器:请求之前的拦截
    HTTP.interceptors.request.use(function (config) {  //config就是自定义请求的配置信息,即HTTP的配置参数
      //在发送请求之前做某事
      //console.log("拦截请求之前提交的数据:");
      //console.log(config)
      //这里可以对配置项config做处理,取消某些配置或增加
      config.headers.TOKEN = localStorage['TOKEN'];
      return config;  //return config请求会继续进行,否则请求就被拦截了
    }, function (error) {
      //请求错误时做些事
      return Promise.reject(error);
    });
    
    //添加一个请求拦截器:请求之后的拦截
    HTTP.interceptors.response.use(res => {
      // 响应失败
      // if (!res.data.success) {
      //   Toast(res.data.msg);
      // }
    
      /**
      * refresh_token过期
      * 1、清空本地token
      * 2、刷新页面
      */
     //console.log("拦截器拦截的数据:");
     //console.log(res);
    
      // if (res.data.code === '004-1') {
      //   //localStorage.setItem('TOKEN', '')
      //   localStorage['TOKEN'] = '';
      //   window.location.reload();
      // }
    
      return res.data;
    }, error => {
      _this.$notify.error({
        title: "错误",
        message: error.message,
        duration: 0
      });
    })
    
    export default HTTP;
  • 相关阅读:
    序列化
    python_模块与包
    python_常用内置模块
    python_生成器
    python_文件操作
    你好,mysql
    2017年12月20日 内置对象
    2017年12月17日 ASP.NET 12个表单元素&&简单控件/复合控件
    2017年12月16日 ASP.NET基本用法
    2017年12月14日 LinQ高级查&&Asp.net WebForm Asp.net MVC
  • 原文地址:https://www.cnblogs.com/samve/p/14232676.html
Copyright © 2011-2022 走看看