uniapp本地调试跨域问题

192.168.1.1
192.168.1.1
192.168.1.1
6623
文章
0
评论
2022年11月9日09:51:42 电脑教程 阅读 10,498

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

uniapp本地调试跨域问题

//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') }); 

以上内容由“WiFi之家网”整理收藏!。

相关推荐

台式电脑多少价位可剪辑视频

在当今数字化时代,视频剪辑已经成为许多人日常生活中的重要一部分,尤其是在自媒体和短视频行业的快速发展下,越来越多的人开始尝试制作和编辑视频。然而,进行视频编辑并不仅仅依赖于软件的操...

台式电脑显卡推荐

在选购台式电脑时,显卡是一个至关重要的部件,因为它直接影响到电脑的图形处理能力和整体性能。无论是玩游戏、进行图形设计工作,还是观看高清视频,显卡的选择都直接关系到用户的体验。因此,...

台式电脑音响插哪个接口

在现代家庭或办公室中,台式电脑已成为不可或缺的设备,音响作为增强音频体验的重要配件,其连接方式也显得尤为重��。了解如何正确地将音响连接到台式电脑,不仅关系到音质的发挥,还能避免不...

台式电脑没有声音怎么解决

在现代社会中,台式电脑已经成为人们日常生活和工作中不可或缺的工具。无论是游戏娱乐、视频欣赏还是日常办公,声音都扮演着至关重要的角色。然而,许多用户在使用台式电脑时,可能会遇到没有声...

台式电脑品牌前十名

在现代科技迅速发展的环境中,台式电脑已成为我们日常生活和工作中不可或缺的一部分。它们不光是个人办公、学习的工具,更是艺术创作、游戏娱乐以及专业设计等多个领域的核心设备。选择一款优秀...

台式电脑哪个品牌质量好

随着科技的不断进步,台式电脑已经成为现代生活中不可或缺的一部分。不同品牌的台式电脑各具特色,从性能到外观设计都各有千秋。然而,对于许多消费者来说,选择一个质量可靠的品牌显得尤为重要...

台式电脑当前密码忘了怎么办

在数字化时代,密码管理成为了我们日常生活中的重要一环。无论是个人电脑、手机,还是各种智能设备,密码的安全性都直接关系到我们的信息安全。然而,在使用台式电脑的过程中,往往会遇到密码忘...