Dov,一个基于axios 体验的微信小程序请求工具

栏目: JavaScript · 发布时间: 6年前

内容简介:基于 axios 体验的微信小程序请求工具,完全使用Promise,并提供了请求和响应的拦截。第二个参数可以追加参数多个请求合并

基于 axios 体验的微信小程序请求工具,完全使用Promise,并提供了请求和响应的拦截。

引入到项目中

import dov from './libs/dov.min.js'

快速使用

// http.js
import dov from './libs/dov.min.js'

dov.get('http://www.baidu.com/user').then(response => {
    console.log(response)
})
// 或者
dov.defaults.baseURL = 'http://www.baidu.com'   // 设置默认地址
dov.get('http://www.baidu.com/user').then(response => {
    console.log(response)
})
复制代码

第二个参数可以追加参数

dov.get('http://www.baidu.com/user', {
    data: {
        username: 'dov',
        password: 'asdkln211232345sa'
    }
}).then(response => {
    console.log(response)
})
复制代码

多个请求合并

function getUserInfo(){
    return dov.get('/userinfo')
}
function getUserPerssion(){
    return dov.get('/userPerssion')
}
dov.all([getUserInfo(), getUserPerssion()]).then(response => {
    console.log(response)
}).catch(error => {
    console.log(error)
})
复制代码

dov API

dov(config)

dov({
  method: 'post',
  url: 'http://www.baidu.com/getUserInfo',
  data: {
    username: 'king',
    password: 'kingpassword'
  }
}).then(response => {
  console.log(response)
})

// 或
dov.defaults.baseURL = 'http://www.baidu.com'
dov({
  method: 'post',
  url: '/getUserInfo',
  data: {
    username: 'king',
    password: 'kingpassword'
  }
}).then(response => {
  console.log(response)
})
复制代码

dov.(url[,config])

dov('http://www.baidu.com/getUserInfo', {
  method: 'post',
  data: {
    username: 'king',
    password: 'kingpassword'
  }
}).then(response => {
  console.log(response)
})

复制代码

小程序中定义了8种请求类型:微信小程序请求方式

  • GET
  • POST
  • PUT
  • DELETE,
  • OPTIONS,
  • HEAD,
  • TRACE,
  • CONNECT

axios.get(url[, config])

axios.post(url[, config])

axios.put(url[, config])

axios.delete(url[, config])

axios.options(url[, config])

axios.head(url[, config])

axios.tracce(url[, config])

axios.connect(url[, config])

创建实例

可能需要多个实例来操作时,可以通过 create 方法来实现。

let server1 = dov.create({
    baseURL: 'https://api.baidu.com'
})
let server2 = dov.create({
    baseURL: 'https://img.baidu.com'
})

server1.get('/getUserInfo').then(response => {
    console.log(response)
})
复制代码

一般的配置参数都是参照微信的

微信小程序 request 请求参数列表

{
    baseURL: '', // 默认地址
    
    url: '',
    
    data: {},
    
    header: {},
    
    method: '',
    
    dataType: '',
    
    responseType: '',
}
复制代码

Interceptors

dov 也提供了和 axios 一样的请求拦截和响应拦截,并且可以配置多个

request

// 1.第一个 request 的拦截器
dov.interceptors.request.use(function (config) {
    config.data.header['Authorization'] = wx.getStorageSync('token')
    // ...
    return config
})
// 2.第二个 request 的拦截器,
dov.interceptors.request.use(function (config) {
    config.data.token = wx.getStorageSync('token')
    // ...
    return config
})
复制代码

response

// 1.第一个 response 的拦截器
dov.interceptors.response.use(function (response) {
   if (response.status === 200) {
       ...
   }
    return response
})
// 2.第二个 response 的拦截器,
dov.interceptors.response.use(function (response) {
    if (response.status === 300) {
       ...
   }
    return response
})
复制代码

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Head First PHP & MySQL

Head First PHP & MySQL

Lynn Beighley、Michael Morrison / O'Reilly Media / 2008-12-29 / USD 44.99

If you're ready to create web pages more complex than those you can build with HTML and CSS, Head First PHP & MySQL is the ultimate learning guide to building dynamic, database-driven websites using P......一起来看看 《Head First PHP & MySQL》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

MD5 加密
MD5 加密

MD5 加密工具

html转js在线工具
html转js在线工具

html转js在线工具