Aidex 移动端快速开发框架# RuoYi-Uniapp项目,uniapp vue app项目跨域问题

参考地址:

manifest.json官方配置文档:manifest.json 应用配置 | uni-app官网

Chrome 调试跨域问题解决方案之插件篇:

uni-app H5跨域问题解决方案(CORS、Cross-Origin) - DCloud问答

其实uni-app官方有解决跨域的办法,官方推荐使用HBuilderX中内置的浏览器去预览,在内置的浏览器中不会存在跨域问题,但是要是在Chrome 浏览器中预览的话就会出现这个跨域问题,官方推荐使用Allow-Control-Allow-Origin: *插件的方式去解决,但是我试过这个插件,不知道是什么问题,并没有效果,跨域问题依旧还是存在,后面再仔细的看了下文档,看到了下面的提示。

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

manifest.json h5配置devServer,

与vue项目webpack项目vue.config.js配置格式一样,在ruoyi的项目在vue.config.js配置不生效。需要在此文件配置

复制代码
"h5": {
    "template": "template.h5.html",
    "router": {
      "mode": "hash",
      "base": ""
    },
    "optimization": {
      "treeShaking": {
        "enable": false
      }
    },
    "title": "porraycloudApp",
    "devServer": {
      "disableHostCheck": true,
      "port": 8081,
      "proxy": {
        "/api": {
          "target": "http://gh.xksskj.com/webapi",
          "changeOrigin": true,
          "secure": false,
            "pathRewrite": {
              "^/api": ""
            }
        }
      }
    }

config.js baseUrl需要置空

调用登录Post的接口路径 测试

在路径前面加:/api,用来做跨域匹配替换。

现在调试跨域问题解决了。

相关推荐
小光学长1 分钟前
基于Web的课前问题导入系统pn8lj4ii(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面。
java·前端·数据库
Mintopia6 分钟前
🌐 跨模态迁移学习:WebAIGC多场景适配的未来技术核心
前端·javascript·aigc
JarvanMo11 分钟前
使用 MediaPipe 在 Flutter web 中识别姿势
前端
saadiya~12 分钟前
基于 Vue3 封装大华 RTSP 回放视频组件(PlayerControl.js 实现)
前端·vue3·大华视频相机前端播放
LSL666_18 分钟前
spring多配置文件
java·服务器·前端·spring
万少1 小时前
HarmonyOS preview 预览文件 Kit 的入门讲解
前端
IT_陈寒1 小时前
JavaScript 性能优化实战:我从 V8 源码中学到的 7 个关键技巧
前端·人工智能·后端
jenchoi4131 小时前
软件供应链npm/pypi投毒预警情报【2025-11-09】
前端·安全·web安全·网络安全·npm·node.js
艾小码1 小时前
别再只会用默认插槽了!Vue插槽这些高级用法让你的组件更强大
前端·javascript·vue.js
JaguarJack1 小时前
CSS 也要支持 if 了 !!!CSS if() 函数来了!
前端·css