uniapp调接口出现跨域问题。

文章讲述了在uniapp开发中遇到的跨域问题,当在外部浏览器运行项目时,发现存在跨域限制。为了解决这个问题,作者在manifest.json文件中配置了devServer的proxy选项,将/mock路径指向目标接口域名,并设置changeOrigin为true,重启项目后成功解决了跨域问题。然而,尝试通过添加Access-Control-Allow-Origin:*到请求头并未产生预期效果。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

今天在写uniapp项目的时候,使用在线模拟接口的时候,出现跨域问题。

【问题描述】:

①在内嵌浏览器运行,不会出现跨域问题,好像是内嵌浏览器自动去掉了跨域问题。

②在外部浏览器调用的时候会出现跨域问题。(我们要解决的是这个问题)

 前端项目在浏览器运行的为http://localhost:8082/#/pages/index/index

这两个出现跨域问题,端口、域名都不同,只有协议相同,都是http协议。

  

【解决办法】:

在uniapp里面的manifest.json里面修改:

"h5" :{
        // 跨域代理
        "devServer" : {
            "port" : 8082, // 浏览器运行端口
            "disableHostCheck" : true,
            "proxy" : {
                "/mock" : {
                    "target" : "http://heymock.uneedcode.com", // 目标接口域名
					"changeOrigin" : true, // 是否跨域
                    "pathRewrite" : {
                        "^/mock" : "/mock"
                    }
                }
            },
            "https" : false
        },
        "title" : "H5"
    }

修改完manifest.json后,一定要重启项目,不然还是没有效果的。

可以成功请求啦。

------------------------------------------------over。

对了,但还有个小问题。

 我在请求头上面添加提示的信息,”Access-Control-Allow-Origin“:"*",貌似没有任何效果。

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

派大星_study

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值