关于flyio对于快应用的http请求的封装(开箱即用)
第一步 肯定是对于第三方的安装下载
npm install flyio
更多关于 flyio 可以直接访问官网
当我们安装成功就可以开始封装util文件了
1.http.js
var fetch = require("@system.fetch")
var Fly = require("../../node_modules/flyio/dist/npm/hap")//引入路径根据自己放置的目录配置
var service = new Fly(fetch)
import storage from '@system.storage' // 快应用 自带 本地存储
import prompt from '@system.prompt' // 快应用自带 提示框
service.config.baseURL = '';// 设置baseURL
// 简单的设置请求头
service.interceptors.request.use((request) => {
//给所有请求添加自定义header
request.headers["X-Tag"] = "flyio";
storage.get({
key: 'A1',
success: function (data) {
let token = data
console.log(token);
if (token) {
//设置 http 请求 携带 请求头
request.headers["Authorization"] = token;
}
},
});
return request;
})
// 设置 请求拦截
service.interceptors.response.use(
(response) => {
if(response.data.code == 200) {
return response
} else {
return prompt.showToast({
message: response.data.msg
})
}
},
(err) => {
//请求出错,根据返回状态码判断出错原因
console.log(err,'996')
// 你也是 9 9 6 么
if (err.status == 0) {
return prompt.showToast({
message: '网络错误'
})
} else if (err.status == 1) {
return "网络连接超时"
} else if (err.status == 401) {
return "用户未登录"
} else {
if (err.response.data.message) {
return err.response.data.message
} else {
return '请求数据失败,请稍后再试'
}
};
// Do something with response error
}
)
export default service
设置好 http.js 当然 是去 引用
import service from '' // http.js 的地址
export default {
// 获取用户名
getPhoneCode (data) {
return service.post('app/tsUser/getPhoneCode', data)
}
}
上面的两步完成 直接 将 api 设置到全局挂载即可
<script>
/**
* 应用级别的配置,供所有页面公用
*/
import app from '@system.app'
import prompt from '@system.prompt'
import webview from '@system.webview'
import router from '@system.router'
import servers from './tools/api.js' // 设置好 自己的 api 路径
/* @desc: 注入方法至全局 global,以便页面调用 */
const hook2global = global.__proto__ || global
hook2global.servers = servers
// 必须 设置
export default {
onCreate() {
servers;
// 必须 设置
},
}
</script>
<style>
</style>
如果 你已完成 上面的步骤那么恭喜你 可以直接使用了
//附上 登录 Login 实例
//登录
Login() {
var phone = this.form.username;
if (!(/^1[34578]\d{9}$/.test(phone))) {
return prompt.showToast({
message: '请输入正确的手机格式'
})
} else if (this.form.code == '') {
return prompt.showToast({
message: '请输入验证码'
})
} else {
servers.LoginCode(this.form).then((res) => {
console.log(res);
if (res.data.code == 200) {
storage.set({
key: 'A1',
value: res.data.token
}) // 快应用 存储
router.push({
uri: 'pages/DemoDetail'
})
}
})
}
},
若有所帮助,还望一键三连 ,有疑问 可下方留言 。