H5W3
当前位置:H5W3 > 其他技术问题 > 正文

vue中使用axios的配置

vue中使用axios需要设置哪些东西,比如使用vue-resource时需要设置
Vue.http.options.emulateJSON = true
设置后chrome工具栏请求栏就是Form Date
clipboard.png

使用axios时,默认请求时,chrome工具栏请求栏就是Request Payload,
具体怎么设置,可以让axios请求变成Form Data形式

回答:

  • 看了你自己回答的部分,应该是对的,而且比较全。

  • 我这里再补充一点,如果你想要操作方便,给所有的axios请求都使用qs.stringify()的话,可以设置axios的全局属性:

var qs = require('qs'); // ES5
// 或者ES6: import qs from 'qs';

axios.defaults.transformRequest = [function(data) {
    return qs.stringify(data)
}];
// 或者使用箭头函数
// axios.defaults.transformRequest = [data => qs.stringify(data)];
  • 注意,上面例子中的函数是放在数组中的。

  • 另外,根据axios文档transformRequest是在发送数据前处理数据的配置,而axios.defaults.XXXX为axios的默认配置项。

回答:

import qs from 'qs'

axios.get('url', qs.stringify(params))

回答:

使用上面基本按文档走就没什么问题的,可以简单抽象一下。

// axios配置
function request(method, url, param, cb, errcb) {
    // token认证
    const userToken = store('userToken')
    const config = {
        url: '/api' + url,
        method: method,
        headers: {
            Authorization: userToken 
        },
        data: param
    }
    axios(config)
        .then((res) => {
            var data = res.data
            if (data.success) {
                // 请求成功
                if (cb) {
                    cb(data.model)
                }
            } else {
                // 请求错误
                console.error(data)
                if (errcb) {
                    errcb(data.msg, data.model)
                } else {
                    alert(data.msg)
                }
            }
        })
        .catch((error) => {
            console.error(error)
            alert('发生错误')
        })

}

export function post(...args) {
    request('post', ...args)
}

export function get(...args) {
    request('get', ...args)
}

至于非json/application的情况,可以转一个data

// 转换json为searchParams 支持请求application/x-www-form-urlencoded
function $stringify(param) {
    var query = []
    for (var k in param) {
        query.push(k + '=' + param[k])
    }
    return query.join('&')
}

本文地址:H5W3 » vue中使用axios的配置

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址