uniapp本地调试跨域问题

2022-03-02 14:35:12 阅读：208 来源： 互联网

标签：uniapp NeedToken 跨域 url res token data options 调试

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 = options.NeedToken == 'no' ? false : true
	// console.log(`${options.url} === ${options.NeedToken} === ${NeedToken}`)

	// *** 处理请求配置options ***
	options.url = `${server_url}${base_url}${options.url}`;
	//配置请求头
	options.header = {
		'content-type': 'application/x-www-form-urlencoded',
		'accessToken': NeedToken ? `${token}` : '' //Bearer //根据	NeedToken	判断是否需要传token
	};

	return new Promise((resolved, rejected) => {
		//成功
		options.success = (res) => {
			if (Number(res.data.code) !== 200) { //请求成功
				if (Number(res.data.code) == 401) { //登陆失效
					store.commit("app/SET_NEED_LOGIN", true)
					uni.showModal({
						title: "重新登陆",
						content: `${res.data.message}`,
						success: function(result) {
							if (result.confirm) {
								store.commit("user/SET_TOEKN", '')
								store.commit("user/SET_MEMBER_ID", '')
								/**
								 * 重定向刷新页面
								 */
								// console.log('vuex保存的重定向地址',store.state.app.redirectPage)
								wx.navigateTo({
								 
								url: '/pages/Login/Login',
								 
								});
							} else if (result.cancel) {
								// console.log('用户点击取消');
							}
						}
					})
				} else {
					uni.showToast({
						icon: 'none',
						duration: 3000,
						title: `${res.data.message}`
					});
				}
			}

			// rejected(res.data.message);//错误
			resolved(res.data);

		}
		//错误
		options.fail = (err) => {
			rejected(err); //错误
		}
		// console.log("请求Options",options)
		uni.request(options);

	});
}
export default service;

//api-method.js

import request from "./request.js"
import qs from 'qs'

// **noneToken请求
export const NoTokenRequest = (url, data,method) => {
	const NeedToken = 'no'//是否需要token //'yes' or 'no'
	return request({
		url: url,
		method: method.toUpperCase(),
		data,
		NeedToken
	})
}

// **get请求
export const getRequest = (url, data) => {
	return request({
		url: url,
		method: 'GET',
		data
	})
}

// **post请求
export const postRequest = (url, data) => {
	return request({
		url: url,
		method: 'POST',
		data
	})
}

3.封装调用方法根目录创建API文件夹创建index.js

import {
	NoTokenRequest,
	getRequest,
	postRequest
} from "@/utils/api-method.js"


// 登陆
export const login = (params) => {
	return NoTokenRequest('/szgf/app/login/appLogin', params, 'POST')
}

4.VUE文件调用接口

import{ login } from "../../api/index.js"



login(params).then(res=>{

if(res.code==200){

console.log('success')

}else{

}

console.log('0000000')

});

标签：uniapp,NeedToken,跨域,url,res,token,data,options,调试
来源： https://blog.csdn.net/smiong/article/details/123229076

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

uniapp本地调试跨域问题