大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺
flyio:
一个支持所有JavaScript运行环境的基于Promise的、支持请求转发、自动转换JSON、支持请求/响应拦截器、强大的http请求库。
可以让您在多个端上尽可能大限度的实现代码复用。
flyio官方文档
flyio下载地址
原生微信小程序中使用flyio请求,封装代码如下
一、在src/utils下新建request.js文件,文件代码如下:
/*flyio: 一个支持所有JavaScript运行环境的基于Promise的、支持请求转发、强大的http请求库。 可以让您在多个端上尽可能大限度的实现代码复用。 */
/**配置fly 请求体 */
//引入下载的源码文件
const Fly = require("./fly/dist/npm/wx")
const fly =new Fly()//创建fly实例
import {
doLogin} from '../utils/wechat'
//设置超时时间
fly.config.timeout = 60000
//获取白名单
import whiteList from './whiteList'
//添加请求拦截器
fly.interceptors.request.use((request) => {
wx.showLoading({
title: '加载中',
'mask': true
})
//不显示加载中页面的接口
if(whiteList.loading.indexOf(request.url) == -1){
//indexOf()如果要检索的字符串值没有出现,则该方法返回 -1
//隐藏loading遮罩
wx.hideLoading();
}
//默认加入3rd_session
let third_session = wx.getStorageSync("third_session");
if(!third_session){
//不存在third_session,重新登录
request.body['third_session'] = '';
}else{
request.body['third_session'] = third_session;
}
request.params = request.body;
request.headers['Content-Type'] = 'application/json;charset=utf-8';
console.log("request.body:"+JSON.stringify(request.body));
return request;
});
//添加响应拦截器,响应拦截器会在then/catch处理之前执行
fly.interceptors.response.use((response, promise) => {
console.log("response",response)
wx.hideLoading()
switch(response.data.returnCode){
case 200: //正常
break;
case 400: //后台自定义错误
wx.showToast({
title:response.data.msg,
icon: 'none',
duration: 2000
})
break;
case 401: //pp_session过期
//重新静默登录获取code
wx.removeStorageSync('loginFlag')
doLogin()
break;
case 403: //登录状态失效
wx.removeStorageSync('loginFlag')
wx.showToast({
title:'登录状态丢失,请重新登录',
icon: 'none'
})
//跳转登录页面
wx.navigateTo({
url: '/pages/login/login',
})
break;
case 500: //服务器错误
wx.showToast({
title:'服务器错误,请稍后重试',
icon: 'none'
})
break;
default:
}
return promise.resolve(response.data)
},(err, promise) => {
wx.hideLoading()
wx.showToast({
title:'网络错误,请检查网络后重试',
icon: 'none'
})
return promise.resolve()
})
export default fly
二、在src/utils下新建api.js文件
api.js文件中,引入 request.js: import fly from ‘./request.js’,然后调用fly 的封装的请求方法,最后 export default api,以为其他页面调用。代码如下:
//业务api
import fly from './request.js'
const baseURL = 'http://192.168.0.77:8083'//测试环境 http
const api ={
baseURL: baseURL,
//code换取session
code2Session:(code) => fly.post('/wx/code2Session',{
wx_code:code
},{
baseURL: baseURL
}),
//登录或注册
loginOrRegister:(data) => fly.post('/wx/loginOrRegister',data,{
baseURL: baseURL
}),
//获取用户基本信息
getUserInfo:() => fly.get('/user/getUserInfo',{
},{
baseURL: baseURL
}),
//获取图片列表信息
getImgList:(pageNum,paseSize) => fly.post('/img/getImgList',{
pageNum:pageNum,paseSize:paseSize
},{
baseURL: baseURL
})
}
//获取图片详情信息
export function getImgDetail(query){
return fly.request({
baseURL: baseURL,
url: '/img/getImgDetail?id='+query,
method: 'get'
})
}
//添加图片信息
export function addImg(data){
return fly.request({
baseURL: baseURL,
url: '/img/addImg',
method: 'post',
body: data,
params: data, //可自定义配置项
})
}
export default api
三、接口的使用
1.在 js页面引入api : import api from ‘…/…/utils/api’
2.调用 api.js中 export的方法
3.示例:
// pages/my/my.js
//获取应用实例
const app = getApp()
import api from '../../utils/api'
Page({
/** * 页面的初始数据 */
data: {
userInfo: {
},
},
/** * 生命周期函数--监听页面显示 */
onShow: function () {
//请求第三方服务器API获取用户基本信息
this.getUserInfo()
},
//获取用户信息
getUserInfo(){
api.getUserInfo().then(res =>{
console.log("getUserInfo",res)
if(res.returnCode == 200){
let userInfo = res.data
this.setData({
userInfo: userInfo
})
}
})
},
})
注意事项
1.flyio API 文档 简单总结与注意事项
2.小程序中 api.js 中 方法请求参数问题:
由于使用flyio封装wx.request请求,请求参数自动填加到 request请求体的body中,服务器后台获取参数方法受限,get请求参数获取正常;post请求报异常,需要特殊处理,比较麻烦(使用常规方法获取参数,第一次正常,第二次报异常),解决方法:
使用flyio封装时,把请求参数(request请求体的body内容) 赋值给 request请求体的params,服务后台 get请求 和
post请求 ,处理参数的方法一致采用 处理get请求参数的方法。
处理get请求参数的方法:
request.getParameter()
或request.getParameterMap()
request.js中:
服务器后台代码(获取请求参数,转map):
/** * 处理get请求参数: * get请求主要使用ParameterMap进行获取请求参数集合 * @param request * @return */
public static Map<String, Object> getMethod(HttpServletRequest request) {
Map<String, Object> resultMap = new HashMap<String, Object>();
Map<String, String[]> properties = request.getParameterMap();//把请求参数封装到Map<String, String[]>中
//iterator:迭代器
Iterator<Entry<String, String[]>> iterator=properties.entrySet().iterator();
String name ="";
String value ="";
//遍历
while(iterator.hasNext()){
Entry<String, String[]> entry = iterator.next();
name=entry.getKey();
Object valueObject = entry.getValue();
if(null == valueObject){
value ="";
}else if(valueObject instanceof String[]){
String[] values=(String[]) valueObject;
for(int i=0; i<values.length; i++){
value = values[i]+",";
}
value = value.substring(0, value.length()-1);//去除最后一个逗号
}else{
value = valueObject.toString();//用于请求参数中请求参数名唯一
}
resultMap.put(name, value);
}
return resultMap;
}
好了,内容到这里就结束了,希望对需要的人有帮助。
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/196051.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...