uniapp——解决编译H5浏览器跨域问题

最新推荐文章于 2024-06-21 17:40:58 发布
最新推荐文章于 2024-06-21 17:40:58 发布
阅读量900 收藏 2
点赞数
文章标签： http 前端 vue.js uni-app
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_48905575/article/details/121712692
版权

解决编译H5浏览器跨域问题

文章目录

前言

一、解决编译H5浏览器跨域问题

在这里插入图片描述

以下是我对解决H5浏览器跨域问题的方法

二、使用步骤

1. 在manifest.json文件中配置跨域

代码：

在这里插入图片描述

"h5": {
		"devServer": {
			"disableHostCheck" : true, // 开启可以用自己的域名
			"proxy": {
				"/api": {
					"target": "http://81.68.254.47/api",
					"changeOrigin": true,	//默认是false,是否需要改变原始主机头部为目标的URL
					"secure" : false,
					"pathRewrite": { 
					"^/api": ""
					}
				}
			}
		}
	}

2.在请求的位置还需做判断处理（很重要）

在这里插入图片描述

代码：

//#ifndef H5
var baseURL = "http://81.68.254.47/api"
// #endif
// #ifdef H5
var baseURL = "/api" //结合manifest.json文件，解决H5跨域问题
// #endif

3.结果

在这里插入图片描述
以上述操作基本上算是成功了，希望对你有一些帮助。
当然你也可以参照这里uin-app官网，我把链接已经转过来了文档

_Giga Pudding
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uni-app 运行在浏览器跨域问题
weixin_44387746的博客
02-18 845
在 manifest.json 根目录下配置代理 "h5": { "devServer": { "port": 8080, //端口号 "disableHostCheck": true, "proxy": { "/api": { "target": "代理域名", //目标接口域名 "changeOrigin": true, //是否跨域 "secure": false, // 设置支持https协议的代理 "pathRewrite":
Jupyter: The port is already in use, trying another port. 打开的端口与设置的端口不一样
一听音频技术
07-23 2907
问题描述： 在~/.jupyter/jupyter_notebook_config.py 中设置了： c.NotebookApp.port =8891 但是在terminal中打开notebook时出现： The port 8891 is already in use, trying another port. 这样就无法使用我们指定的端口。 解决方法： 检查在8891端口的进程： lsof -i:8891 杀掉在这个端口的进程： kill $(lsof -t -i:8891) 如果无效，强制杀死
解决uniapp h5 本地代理实现跨域访问及如何配置开发环境
最新发布
林恒的博客
06-21 1177
如何解决uniapp H5本地代理实现跨域访问？
（port is already in use）端口被占用问题
qq_51066068的博客
06-04 4364
（port is already in use）端口被占用问题
Vue项目每次打开的端口不同，指定端口失效
csxjax的博客
08-20 1155
转载链接：https://blog.csdn.net/marko_zheng/articl...
uniapp-h5解决跨域的问题
weixin_51452515的博客
03-25 1365
uniapp 解决h5跨域的问题
解决“The port 8888 is already in use, trying another port”方法
shuzip的博客
10-08 1万+
精确找到被占用的端口对应的PID netstat -ano|findstr "8888" 末尾显示的是PID得到端口号 接着，查看是哪个进程或程序占用了端口 tasklist|findstr "15044" 得到占用端口的进程为python.exe，调用命令停止它 taskkill /f /t /im python.exe ...
uniapp H5浏览器跨域解决插件
04-26
chrome插件【Allow CORS: Access-Control-Allow-Origin】
C#浏览器提示跨域问题解决方案
08-18
C#浏览器提示跨域问题解决方案 跨域问题是指在Web浏览器中，因为安全性限制，不能从一个域名下的页面访问另一个域名下的资源，这是浏览器的同源策略（Same-origin policy）所致。跨域问题在实际开发中经常遇到，...
完美解决浏览器跨域的几种方法(汇总)
08-30
浏览器跨域解决方法汇总 浏览器跨域问题是指在页面中使用js访问其他网站的数据时出现的错误，例如在网站中使用ajax请求其他网站的...解决浏览器跨域问题有多种方法，可以根据实际情况选择合适的方法来解决跨域问题。
浏览器跨域获取Lrc歌词数据的解决办法
10-30
浏览器跨域获取Lrc歌词数据的解决办法
详解vue或uni-app的跨域问题解决方案
01-19
服务器告诉浏览器：你允许我跨域 具体如何告诉浏览器，请看： // 告诉浏览器，只允许 http://bb.aaa.com:9000 这个源请求服务器 $response->header('Access-Control-Allow-Origin', 'http://bb.aaa.com:9000'); //...
uniapp：h5端解决跨域问题
本以为成功很简单，没想到活成普通人都需拼尽全力！
03-02 3805
解决的跨域的方式有很多，站在前台的角度来讲，无论是vue还是uniapp，解决跨域的方法都是试用proxy代理的方式！请看下方解决步骤 <template> <view class=""><button type="primary" @click="request">request</button></view> </template> <script> export default { methods: {
【小程序--H5跨域问题】最常用，最简单，一看就会的小程序H5跨域问题
qq_52499703的博客
09-09 6476
当然解决方法有很多，这里只用了一种最为简单的解决方法，
解决vue端跨域和uni-app的h5跨域问题
qq_42815671的博客
04-26 9183
vue端跨域解决办法 //vue-cli生成的项目的config目录下的index.js文件配置跨域，只是在开发阶段起作用，打包的不起作用，需要在nginx服务器配置反向代理 module.exports = { dev: { assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { ...
uni-appH5解决跨域问题
Grass丶叁叶
10-16 5621
uni-appH5解决跨域问题 今天在h5端测试接口的时候遇到了久违的跨域问题，一开始按照官方的解决方案来，然而发现并没有解决问题，后面参考了一位仁兄的文章才解决了问题 官方方案：https://ask.dcloud.net.cn/article/35267，也不知道是不是我的问题，你们也可以尝试一下官方的解决办法。 我先是用以前在vue项目里面解决跨域的方式，设置反向代理,毕竟uniapp这个框...
uniapp 解决开发期间H5端跨域的问题
weixin_46337813的博客
07-02 308
参考：https://juejin.cn/post/6844904063855755271 文章的评论说在新建vue.config.js配置代理不生效，这个我没尝试过 以上截图是我在项目中manifest.json文件做devServer配置是可以实现跨域请求
H5+跨域请求
潇洒小杰杰的博客
01-30 1041
加粗样式@H5+跨域请求 var xhr = new plus.net.XMLHttpRequest(); xhr.onreadystatechange = function(){ switch(xhr.readyState){ case 4: if(xhr.status == 200){ console.log(JSON.parse(xhr.responseText)); } } } ①xhr....
ajax跨域问题以及解决方案
热门推荐
默默前行，勿喜、勿悲、一切随缘！
06-24 4万+
在工作中，大家应该都遇到过ajax跨域问题，浏览器的错误如下： XMLHttpRequest cannot load http://目标地址 No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://当前页面地址' is therefore not allowed a
uniapp 运行到浏览器 如何解决跨域问题
05-01
在将 Uniapp 应用运行到浏览器时，由于浏览器的同源策略，可能会遇到跨域问题。那么如何解决呢？以下是几种可能的解决方案。 1. 在后台设置跨域请求头。如果 Uniapp 应用需要访问后台接口，可以在后台服务器上设置...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值