uniapp网络请求封装

最新推荐文章于 2024-10-30 14:40:16 发布

原创

最新推荐文章于 2024-10-30 14:40:16 发布 · 1.1k 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#uni-app

本文介绍了如何在uni-app中进行网络请求的封装，包括创建api文件夹、配置config.js以存放请求地址，编写request.js实现请求功能，利用Promise处理异步操作。同时在index.js中组织接口，并在main.js中全局注册，最后在Vue组件中调用这些封装好的接口进行数据请求。

1、新建api文件夹，config文件存放请求的IP地址，request进行请求，index存放所有接口

2、config.js，存放ip地址

3、request.js,在这里进行网络请求，本质就是在request里面使用uni.request，返回promise对象

记得下载axios

npm i axios -s

import axios from 'axios'
//import store from '../store/index.js'
import urlConfig from './config.js'
const request={}
/**
 * 如果是访问外部链接，可以直接写入url，就不会带入原有的服务器访问地址
 */
const getUrl = (url) => {
	if (url.indexOf('://') == -1) {
		url = urlConfig + url;//地址拼接
	}
	return url
}
request.globalRequest = (url, method, data) => {
    //有需要可以设置头部信息
	 if (store.state.userInfo && store.state.userInfo.session_id) {
	 	var sessionId = store.state.userInfo.session_id;
	 	headers['session-id'] = sessionId
	 }

	 h