小程序用Promise封裝（get,put,post,delete）請求庫

1.邏輯是這樣的用戶登錄成功，我們把token和用戶的信息存儲到本地

 

2.config是存放baseUrl的文件

const config = {

        url: 'https:XXX/index.php'
}
export {
    config
}

 

3.在請求庫requset.js, http請求函數返回的是一個 promise 的對象，利用微信的wx.request接口，請求成功的時候resolve，請求失敗時reject 

import {
    config
} from './config.js'
import Toast from '../ui/dist/toast/toast'

//公共請求接口方法
var onoff = true
const http = (method, url, data) => {

    //加載動畫
    wx.showLoading({
        title: '加載中...',
        showCancel: true,
        mask: true
    });

    //用戶信息對象

    let loginInfo = wx.getStorageSync('login_info') ? JSON.parse(wx.getStorageSync('login_info')) : {
        token: null,
        id: null
    };
    return new Promise(function(resolve, reject) {

        wx.request({
            method: method, //請求類型
            url: config.url + url, //請求地址
            header: { //請求頭
                'content-type': 'application/json',
                'token': loginInfo.token,
                'id': loginInfo.id
            },
            data: data, //請求參數
            success: res => {
                wx.hideLoading(); //請求完成關閉加載動畫
                //token過期 清除用戶信息（根據后端返回相應的狀態碼就行攔截）
                if (res.data.error_code == 21000) {
                    console.log("登錄超時")
                    if(!onoff) return
                    wx.showModal({
                        title: '提示',
                        content: '登錄已過期',
                        confirmText:"重新登錄",
                        showCancel:false,
                        success (res) {
                          if (res.confirm) {
                            wx.removeStorageSync("login_info");
                            wx.setStorageSync('isLogin', false);
                            wx.reLaunch({ url: "/pages/login/pages/guide/guide" });
                            // onoff=!onoff;
                          } 
                        }
                      })
             
                    return
                }
                if (res.statusCode == 200) {
                    onoff=true;
                    resolve(res.data); //成功回調
                } else {
                    console.log(res.data, 666)
                    wx.showToast({
                        title:res.data.msg ||'網絡錯誤！',
                        icon: 'none',
                        duration: 2000
                      })
                }
            },
            fail: err => {
                console.log(err,"請求失敗了")
                reject(err); //失敗回調
                wx.hideLoading(); //請求完成關閉加載動畫
     
            },
            complete: info => {

                
            }
        })
    })
}

const Get = (url, data) => http('GET', url, data)
const Post = (url, data) => http('POST', url, data)
const PUT = (url, data) => http('PUT', url, data)
const DELETE = (url, data) => http('DELETE', url, data)
export {
    Get,
    Post,
    DELETE,
    PUT
}

4.api文件

import {
    Get,
    Post,
    PUT
} from '../utils/request.js'
//賬號登錄接口
export function loginHandle(params) {
    return Post('/api/v1/login', params)
}

5.頁面調用

import {

loginHandle

 } from '../utils/request.js'

loginHandle().then(res=>{

　　console.log(res,"請求成功的返回值")
})