uiapp请求方法封装

简介: uiapp请求方法封装

uiapp请求方法封装

// 请求接口
const commoneUrl = "http://xxxxxxxxxx.com/";
// new 域名
//get请求封装
function getRequest(url, data) {
  var promise = new Promise((resolve, reject) => {
    var postData = data;
    uni.request({
      url: commoneUrl + url,
      data: postData,
      method: "GET",
      dataType: 'json',
      header: {
        'content-type': 'application/json'   
      },
      success: function(res) {
        if (res.statusCode === 200) {
          resolve(res.data);
        } else {
          resolve(res.data)
        }
      },
      error: function(e) {
        reject('网络出错');
      }
    });
  });
  return promise;
}
//post请求封装
function postRequest(url, data) {
  var promise = new Promise((resolve, reject) => {
    var postData = data;
    uni.request({
      url: commoneUrl + url,
      data: postData,
      method: 'POST',
      // withCredentials:true,
      header: {
        'content-type': 'application/x-www-form-urlencoded',
        // "Authorization":'22'
      },
      success: function(res) {
        // console.log(res);
        if (res.statusCode === 200 && res.data.resultCode == 0) {
          resolve(res.data);
        } else {
          resolve(res.data)
        }
      },
      error: function(e) {
        reject('网络出错');
      }
    })
  });
  return promise;
}
//post请求封装
function postHeaderRequest(url, data) {
  var promise = new Promise((resolve, reject) => {
    var postData = data;
    uni.request({
      url: commoneUrl + url,
      data: postData,
      method: 'POST',
      header: {
        'content-type': 'application/json',
        'Authorization': 'Bearer ' + postHeader
      },
      success: function(res) {
        if (res.statusCode === 200 && res.data.resultCode == 0) {
          resolve(res.data);
        } else {
          resolve(res.data)
        }
      },
      error: function(e) {
        reject('网络出错');
      }
    })
  });
  return promise;
}
module.exports = {
  postRequest,
  postHeaderRequest,
  getRequest,
  commoneUrl
}

mian.js全局挂载

// 请求方法
import http from './utils/request.js'
Vue.prototype.$http = http

页面调用 举例

// 收藏
      collectFun() {
        let id = this.shopInfo.goods_id
        const url = 'Goods/collect_goods';
        let bodyParam = {
          openid: this.$store.state.openid,
          goods_id: id
        }
        this.$http.postRequest(url, bodyParam).then(res => {
          // console.log(res);
          if (res.status === 1) {
            this.$uti.total(res.msg)
            this.shopBox(id)
          }
          if (res.status === 2) {
            this.$uti.total(res.msg)
            this.shopBox(id)
          }
        })
      },
相关文章
|
缓存 JavaScript 前端开发
【axios】二次封装——避免重复发送请求
【axios】二次封装——避免重复发送请求
503 0
【axios】二次封装——避免重复发送请求
|
网络协议 网络架构
数据从发出到接收的细节介绍{封装与解封装}
本文将介绍了详细的封装在每一层的具体的操作,可以让大家学习到数据从发出到收到的具体过程。
|
7月前
|
前端开发
AJAX发送请求方法封装和请求函数底层刨析以及axios二次封装
AJAX发送请求方法封装和请求函数底层刨析以及axios二次封装
|
存储 小程序 前端开发
小程序封装网络请求和拦截器
在开发小程序时,实际上我们通常需要封装网络请求和拦截器,以实现统一处理状态码和存储用户登录信息等功能。这样可以提高开发效率,减少代码重复,同时也可以提高代码的可维护性和可读性。
257 0
|
前端开发
封装ajax请求接口
封装ajax请求接口
121 0
|
消息中间件 JavaScript 小程序
OkHttp完美封装,一行搞完外部请求
OkHttp完美封装,一行搞完外部请求
|
JSON 前端开发 JavaScript
详细自定义封装Axios请求库,你还不会二次封装吗?(一)
使用Vue的时候,Axios几乎已经是必用的请求库了,但是为了更方便搭配项目使用,很多开发者会选择二次封装,Vue3就很多人选择二次封装elementPlus,那其实,Axios我们也是经常会去封装的。
784 0
|
JavaScript API 开发者
详细自定义封装Axios请求库,你还不会二次封装吗?(二)
使用Vue的时候,Axios几乎已经是必用的请求库了,但是为了更方便搭配项目使用,很多开发者会选择二次封装,Vue3就很多人选择二次封装elementPlus,那其实,Axios我们也是经常会去封装的。
283 0
|
数据挖掘 Java
封装,分用、客户端服务器以及请求响应
封装,分用、客户端服务器以及请求响应
125 0
封装,分用、客户端服务器以及请求响应