uniapp使用luch-request

最新推荐文章于 2025-10-31 15:16:09 发布

原创

最新推荐文章于 2025-10-31 15:16:09 发布 · 2.5k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#luch-request

本文档介绍了如何在项目中配置并使用luch-request插件进行HTTP请求，包括下载插件、设置请求基础路径、配置全局参数、请求拦截器的使用，以及在不同环境下的处理方式。在main.js中引入并挂载到Vue原型上，最后展示了在页面中调用get和post请求的例子。

官网：https://www.quanzhan.co/luch-request/

1、下载luch-request插件，将插件放在common目录里

2、在根目录下的common目录里创建http目录，新建index.js

3、commom/http/index.js

import Request from '@/common/luch-request/index.js'
const http = new Request();
import {baseUrl} from './baseUrl.js'

let defaultUrl = ''
if(process.env.NODE_ENV === 'production'){
	defaultUrl = baseUrl
}else{
	defaultUrl = 'xxxx'
}

http.setConfig((config) => { /* 设置全局配置 */
	config.baseURL = defaultUrl
	config.custom = {
		loading:true
	} 
	config.header = {
		
		// a: 1, // 演示用
		// b: 2 // 演示用
	}
	return config
})

//请求前拦截，用来动态加参
http.interceptors.request.use((config) => { // 可使用async await 做异步操作
	if(config.url !== '/logins' && config.url!=='/captcha/logins'){
		config.header.Authorization ='Bearer '+ uni.getStorageSync("token")
	}
	
	console.log('请求前拦截header',config)
	if(config.url == '/images'){
		config.header = {
        'A