热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

优化后的标题:利用UniApp封装小程序API请求接口的最佳实践

在本文中,我们将探讨如何使用UniApp封装小程序API请求接口的最佳实践。通过创建`request.js`文件,定义基础URL并传入后端提供的URL作为请求参数。同时,配置请求方法(如GET、POST)和请求头(例如包含token的认证信息),以实现高效、安全的API调用。此外,我们还将介绍如何处理请求和响应的错误,以及如何优化请求性能,确保应用在不同平台上的兼容性和稳定性。

//建一个request.jsconst BASE_URL = 'url' //后端给的url// 传入请求参数// method: method,// // 配置请求类型// header: method == 'get' ? {'token': token, 'X-Requested-With': 'XMLHttpRequest',"Accept": `application/json, text/plain, */*`,"Content-Type": "application/json; charset=UTF-8"} : {'token': token,'X-Requested-With': 'XMLHttpRequest','Content-Type': 'application/json; charset=UTF-8'},
export const myRequest = (options) => {return new Promise((resolve,reject)=> {let authtoken = uni.getStorageSync('authtoken')uni.request({url:BASE_URL + options.url,data:options.data || {},method:options.method || 'get',header: options.method == 'get' ? {'token': uni.getStorageSync('authtoken'), 'X-Requested-With': 'XMLHttpRequest',"Accept": `application/json, text/plain, */*`,"Content-Type": "application/json; charset=UTF-8"} : {'token': uni.getStorageSync('authtoken'),'X-Requested-With': 'XMLHttpRequest','Content-Type': 'application/json; charset=UTF-8'},// header:{// 'Content-type': 'application/json',// "X-Auth-Token": uni.getStorageSync('authtoken') //这里的token指的是微信授权登录的token,用来判断小程序是否属于登录状态// },dataType:'json',success:res => {if(res.data.code !== 0){}resolve(res)},fail:err => {// uni.showToast({// title:"请求接口失败",// })console.log('err',err)reject(err)}})})
}

main.js

import {myRequest} from "@/request/request.js"
Vue.prototype.$myRequest=myRequest

页面中

this.$myRequest({url: `接口url`, method:'get',data:{}
}).then(data=>{if(data.data.code == 200){}})


推荐阅读
author-avatar
搞笑--林佳豪_533_654
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有