uniapp本地调试跨域问题

最新推荐文章于 2025-06-09 09:04:52 发布

原创

最新推荐文章于 2025-06-09 09:04:52 发布 · 2.6k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #npm #vue.js

本文介绍了uniapp本地调试中解决跨域问题的步骤，包括修改manifest.json设置代理，创建并利用request.js和api-method.js进行接口调用的封装，以及在VUE文件中如何调用这些接口。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.调整 manifest.json（设置代理）

 "h5" : {
        "devServer" : {
            "https" : false,
            "port" : 8080,
			"proxy": {  
					"/webapi": {  
						"target": "http://192.168.1.39:8888",
						"changeOrigin": true,   
						"secure": false,
						"pathRewrite": {
							"^/webapi": "/"  
						}  
					}  
				}
        }
    }

2.新建文件utils 创建 request.js ，api-method.js

//request.js

import store from '../store/index.js'; //vuex  

//服务地址

let server_url = 'http://localhost:8080';  //使用代理这里需要改成本机地址

let base_url = '/gfweb'; //请求地址
let token = ''; //凭证
let NeedToken = true //'yes' or 'no' 是否需要token
// process.env.NODE_ENV === 'development' ? '192.168.0.1' : 'http://***/api' ; //环境配置

function service(options = {}) {
	/**
	 * 从vuex中获取登录凭证
	 */
	store.state.user.token && (token = store.state.user.token);
	/**
	 * 判断是否请求路径需要token
	 * @options.NeedToken	('yes' | 'no')
	 * @NeedToken (true | false)
	 */
	NeedToken = optio