uniapp之封装一个公共的带token的请求方法

1 创建一个文件名为config.js

const baseurl = 'http://xxx:9090/';  //公共接口请求地址
export default baseurl;

2 在登录接口返回数据的那步，将token存进缓存中

                 // 存储token
                        uni.setStorage({
                            key: 'token',
                            data: res.data.access_token,
                            success: function () {
                                uni.getStorage({
                                    key: 'token',
                                    success: function (res) {
                                        console.log(res.data);
                                    }
                                });
                            }
                        });

 在uni.getStorage  API中打印，会发现已经可以拿到缓存的token数据了

3 创建一个公共请求文件 requst.js

如果token不存在，就返回到登录界面。baseurl为公共的接口地址

 import baseurl from './config.js'
// 公共的请求
 const request = function(options) {
     options.url = baseurl + options.url;
     try {
       const token = uni.getStorageSync('token');
       const username = uni.getStorageSync('username');
       debugger
       if (token) {
         options.header = {
           'Authorization' : 'Bearer ' + token
         };
        }else{
            uni.navigateTo({
                url: '../../login/login/login' 
            });
            return;
        }
     } catch (err) {
      console.log(err)
    }
    return uni.request(options);
  }
export default request;

4 去相应界面使用

  import request from '../../../request.js'               //引进requst方法

  onShow:function(){
            request({
                url:"message/messages",
                method:'get',
                success: function (res) {
                    console.log(res.data);
                }
            })    
        }

 

上面的方法，有一点残缺的地方，就是比如有接口的基础地址不是baseurl，该如何？ 有接口的请求头有新的要求，又该如何？ 不想每个界面都引入request文件，又该如何？

增加几个判断，使得封装更严谨。

如果不想每个界面都引入，可以全局注册。

1、在main.js中注册

2、 去相应界面使用，用this.$requset