uniapp + vue3 设置 axios proxy 代理,并重写路径

uniapp + vue2 设置代理如下:

已生成的项目架构里面找到manifest.json文件,通过源码视图的方式打开文件,在文件中添加一下代码即可完成代理:

"h5": {"devServer": {"disableHostCheck": true, //禁止访问本地host文件"port": 8000, //修改项目端口"proxy": {/**配置服务器路径**/"/api": {"target": "https://api.xxx.com",// 目标服务器"changeOrigin": true,/**重写路径**/"pathRewrite": {"^/api": ""}}}}
}

但是注意,这仅限于使用的是vue2,现在新项目都是vue3,因此这个写法作废了,

看下官方怎么说,事情的本质官方说的比较明白了:


uni-app 中 manifest.json->h5->devServer,vue2 实际上对应 webpack 的 devServer,vue3 实际上对应 vite 的 server,鉴于 manifest 为 json 文件,故 webpack.config.js->devServer 及 vite.config.js->server 配置项下的简单类型属性均可在manifest.json->h5->devServer节点下配置,funciton 等复杂类型暂不支持。

官方链接:https://uniapp.dcloud.net.cn/collocation/manifest.html#devserver
在这里插入图片描述
也就是说vue2用的是webpack,vue3用的是vite,因此要用vue3 + vite的方式来配置这个proxy,

但是在vite中,重写路径是通过函数来做的,上面uniapp说了不支持函数写法,所以只能换另一种方式,不在uniapp的文件中配。

在这里插入图片描述

Vue3的方式

在项目根目录下面创建一个名为vite.config.js的文件(如果不存在),在文件中编辑一下内容即可:

这里就是直接新建vite文件来操作使用即可啦。

import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'export default defineConfig({plugins: [uni()],server: {port: 3000,proxy: {'/api': {target: 'https://api.xxx.com', // 目标服务  changeOrigin: true,rewrite: path => path.replace(/^\/api/, ''),}}}
})

在这里插入图片描述

参考了:https://blog.csdn.net/m0_53536475/article/details/130144830

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/705214.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

多区域OSPF路由配置

一、基础配置 1.搭建实验拓扑图 2.实验编址 具体如何配置可以看这一篇详细的博文:单区域OSPF实验-CSDN博客 3.分别检查六个路由器的配置: 使用命令display ip interface brief R1的配置 其他大家可以调出来,再与实验拓扑图进行比对&#…

Java中的数组、Set、List、Map类型的互相转换总结

序言 数组、Set、List、Map是Java语言非常常用的几种数据类型,他们之间存在着千丝万缕的联系。关于底层的数据结构我这里就不再多说啦,直接从应用出发,总结他们之间的转换方法,并给出推荐方法。 大家可以点赞收藏等到需要的时候…

【考研数学】进入强化,基础过关《660》不会做怎么办?

做题没思路,说明学习的过程中走了弯路 很多人,按部就班的学习,觉得课我也听了,讲义也看了,怎么别人做题很顺,自己翻开书就一头雾水。搞清楚其中的差别,也就解决了做题没思路的问题。 首先我们…

波搜索算法(WSA)-2024年SCI新算法-公式原理详解与性能测评 Matlab代码免费获取

​ 声明:文章是从本人公众号中复制而来,因此,想最新最快了解各类智能优化算法及其改进的朋友,可关注我的公众号:强盛机器学习,不定期会有很多免费代码分享~ 目录 原理简介 一、初始化阶段 二、全…

【35分钟掌握金融风控策略28】贷中模型体系策略应用

目录 贷中模型体系策略应用 信用模型体系和模型在策略中的应用 反欺诈模型体系和模型在策略中的应用 运营模型体系和模型在策略中的应用 贷中模型体系策略应用 在贷前模型部分已经讲过,贷前开发的很多模型是可以在贷中直接使用的。贷中与贷前的不同点在于&…

webhook 和 API:你了解吗

Webhooks 是许多 API 的补充。通过设置 webhook 系统,系统 B 可以注册接收有关系统 A 某些更改的通知。当更改发生时,系统 A 推送 更改到系统 B,通常是以发出 HTTP POST 请求的形式。 Webhooks 旨在消除或减少不断轮询数据的需要。但根据我的…

软考一年只能考一次吗?24软考各科目考试时间一览表

软考考试次数: 软考高级【系统分析师】及【系统架构设计师】是一年考两次的。 此外,软考中级【软件设计师】和【网络工程师】也是一年考两次的。 其他科目一年都只开考一次,或者上半年开考,或者下半年开考,具体考试…

k8s 二进制安装 优化架构之 部署负载均衡,加入master02

目录 一 实验环境 二 部署 CoreDNS 1,所有node加载coredns.tar 镜像 2,在 master01 节点部署 CoreDNS 3, DNS 解析测试 4, 报错分析 5,重新 DNS 解析测试 三 master02 节点部署 1&#xff0…

DeepSpeed

文章目录 一、关于 DeepSpeed1、DeepSpeed 是什么2、深度学习训练和推理的极致速度和规模3、DeepSpeed 的四大创新支柱1)DeepSpeed 训练2)DeepSpeed 推理3)DeepSpeed 压缩4)DeepSpeed4Science 4、DeepSpeed 软件套件DeepSpeed 库推…

Golang RPC实现-day02

导航 Golang RPC实现一、客户端异步并发多个请求1、 客户端结构体2、 一个客户端,异步发送多个请求,使用call结构体代表客户端的每次请求3、客户端并发多个请求4、客户端接收请求 Golang RPC实现 day01 我们实现了简单的服务端和客户端。我们简单总结一…

景源畅信电商:做抖音有哪些未开发的蓝海领域?

在互联网信息爆炸的今天,抖音已经成为人们获取信息和娱乐的重要渠道。然而,随着用户数量的增加和内容的丰富,抖音的红海竞争也日益激烈。在这样的背景下,寻找还未被充分开发的蓝海领域,对于内容创作者来说,…

思科模拟器--2.静态路由和默认路由配置24.5.15

首先,创建三个路由器和两个个人电脑。 接着,配置两台电脑的IP,子网掩码和默认网关 对Router 0,进行以下命令: 对Router进行以下命令: 对Router2进行以下命令: 本实验完成。 验证:PC…

MT3036 第一节离数课后

思路: 这道题与之前的表达式求值题目不同的是,有not这个单目运算符。而且如果表达式错误,要输入error。 把true和false成为操作数,把and or not成为运算符。 考虑error的情况: 1.and 和 or是双目运算符&#xff0c…

线性模型之岭回归的用法

实战:使用岭回归模型 完整代码: import numpy as np import matplotlib.pyplot as plt from sklearn.linear_model import LinearRegression from sklearn.datasets import make_regression from sklearn.model_selection import train_test_split fro…

pytest教程-46-钩子函数-pytest_sessionstart

领取资料,咨询答疑,请➕wei: June__Go 上一小节我们学习了pytest_report_testitemFinished钩子函数的使用方法,本小节我们讲解一下pytest_sessionstart钩子函数的使用方法。 pytest_sessionstart 是 Pytest 提供的一个钩子函数&#xff0c…

实战+代码!Selenium + Phantom JS爬取天天基金数据

功能: 通过程序实现从基金列表页,获取指定页数内所有基金的近一周收益率以及每支基金的详情页链接。再进入每支基金的详情页获取其余的基金信息,将所有获取到的基金详细信息按近6月收益率倒序排列写入一个Excel表格。 思路: 1.…

fastadmin对登录token的处理

fastadmin对token的操作 最近开发遇到一个场景,需要绕过验证获取登录,所以恶补了一下这个知识点,这个主要就是控制fastadmin的token的问题 代码分步实现 class Xcxuser extends Api {//关于鉴权protected $noNeedLogin [login,getopenid,…

错误: 找不到或无法加载主类问题(已解决)

今天在虚拟机中安装了idea2023.2的版本,运行代码时发现错误找不到主类! 直接说结论: 我先clean了一下target,然后重新build,发现maven报错了,idea2023.2默认使用了内置的maven,然后我切换了一下…

Yalmip使用教程(8)-常见报错及调试方法

博客中所有内容均来源于自己学习过程中积累的经验以及对yalmip官方文档的翻译:https://yalmip.github.io/tutorials/ 这篇博客将详细介绍使用yalmip工具箱编程过程中的常见错误和相应的解决办法。 1.optimize的输出参数 众所周知,optimize是yalmip用来求…

中国农业大学:学硕11408复试线上涨40分,今年还会持续涨吗?中国农业大学计算机考研考情分析!

中国农业大学(China Agricultural University),简称“中国农大”,坐落于中国首都北京,由中华人民共和国教育部直属,中央直管副部级建制,水利部、农业部和北京市共建,位列国家“双一流…