uniapp网络请求封装

1、在喜欢的位置新建request.js文件。

// uni.request请求封装
const baseUrl = '' //请求的根路径
const request = (options = {}) => {
    
    // const whiteList = [ // 白名单,后端的接口地址
    //         '/wx/getSessionId',
    //         '/wx/authLogin'
    //     ]
        
    //     if(whiteList.indexOf(options.url) === -1 && uni.getStorageSync("token") == '') {
    //         uni.switchTab({ // 登录校验不成功则跳转的登录页面
    //             url:"./pages/index/index",
    //         })
    //         uni.showToast({
    //             title: '请先登录'
    //         });
    //         return new Promise((resolve, reject)=>{
    //             resolve('未登录');
    //         })
    //     }
  
  return new Promise((resolve, reject)=>{
    // 配置默认请求头
    options.header = {
         "Content-Type": "application/x-www-form-urlencoded",
    }
    uni.request({
      url: baseUrl + options.url || '',
      method: options.method || 'GET', 
      data: options.data || {},
      header: options.header || {}
      
    }).then( data => {
      let [err, res] = data
      if(res.statusCode === 200){
        // console.log('请求接口成功');
        resolve(res)
      }else{
        console.log('请求接口没有找到');
        reject(res)
      }
      // console.log(res);
    }).catch( error => {
      reject(error)
    })
  })
}
 
// GET请求
const get = (url, data={}, options={}) => {
  options.url = url
  options.method = 'GET'
  options.data = data
  return request(options)
}
 
// POST请求
const post = (url, data={}, options={}) => {
  options.url = url
  options.method = 'POST'
  options.data = data
  return request(options)
}
 
// 默认向外暴露的数据
export default  {
    request,
    get,
    post
}
2、在main.js中全局注册，这样就不用在页面中单独引入了，方便使用。

import http from 'common/request.js'
Vue.prototype.$http = http
3、页面使用

this.$http.get('url').then(res=>{
                    console.log('请求的数据'，res)
                })