uniapp 解决H5跨域的问题

简介: uniapp 解决H5跨域的问题

uniapp 解决h5跨域问题

manifest.json

manifest.json文件中,点击“源码视图”,在此对象的最后添加以下代码:

"h5" : {
    "devServer" : {
         "port" : 8080, //端口号
          "disableHostCheck" : true,
          "proxy" : {
              "/api" : {
                  "target" : "请求的url地址前缀", //目标接口域名
                   "changeOrigin" : true,  //是否跨域
                   "secure" : true,  // 设置支持https协议的代理
            "pathRewrite": {  
             "^/api": ""  
           }  
             }
        }
    }
}

 

意思就是用"/api"代替 baseUrl,baseUrl就是基本url路径的意思。

request.js请求数据的页面中,如果是写的baseUrl都要用“/api”来代替之前的baseUrl地址。

此时,页面请求数据,从报错信息"cros cross origin跨域"变成了"304",此时也是可以获取到数据的,但是"304"的代码状态也是不对的,这个报“304”的原因是因为缓存。重新编译后就可以了。

小程序请求数据

小程序请求数据,需要在:

开发开发设置中的服务器域名中添加 baseUrl基本url路径即可。

 

 

目录
相关文章
|
7月前
|
前端开发 API
uniapp中为什么会出现跨域问题,如何解决
uniapp中为什么会出现跨域问题,如何解决
2455 0
|
7月前
|
移动开发
Uniapp 多功能富文本编辑组件 可多端使用 H5插入
Uniapp 多功能富文本编辑组件 可多端使用 H5插入
155 0
|
7月前
|
移动开发 小程序 JavaScript
Uniapp 中,能够同时兼容H5、web、app、微信小程序的引入高德地图的语法格式
Uniapp 中,能够同时兼容H5、web、app、微信小程序的引入高德地图的语法格式
652 0
|
2月前
|
移动开发 Android开发 容器
uniapp中使用videojs构建H5直播播放器
【10月更文挑战第14天】这两天在开发H5直播带货功能模块,使用原生的video播放器播放不了m3u8的流地址,于是找了videojs,参考了网上的一些资料研究了一下,感觉还不错,videojs播放m3u8流地址还挺稳定的,下面就简单记录一下uniapp里面使用方式
|
2月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
263 3
|
2月前
|
Web App开发 移动开发 前端开发
uniapp环境H5运行及发行(入门必学)
uniapp环境H5运行及发行(入门必学)
184 5
|
2月前
|
移动开发 小程序 数据可视化
一招学会DIY官网可视化设计支持导出微擎、UNIAPP、H5、微信小程序源码
一招学会DIY官网可视化设计支持导出微擎、UNIAPP、H5、微信小程序源码
43 2
|
4月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
109 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
4月前
|
移动开发 JavaScript 前端开发
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
这篇文章介绍了在UniApp H5项目中处理跨域问题的两种方法:通过修改manifest.json文件配置h5设置,或在项目根目录创建vue.config.js文件进行代理配置,并提供了具体的配置代码示例。
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
|
4月前
|
移动开发 开发框架 JavaScript
在UniApp的H5项目中,生成二维码和扫描二维码的操作处理
在UniApp的H5项目中,生成二维码和扫描二维码的操作处理