uni-app中配置devServer实现跨域访问数据

1.在devServer中:

在manifest.json->源码视图中添加

注意:以下代码可以跨域,但是请求出来的数据不是想要的,会出现请求得到的不是数据,而是得到https://api.ithome.com网址的报错网页代码

"h5": {  
        "devServer": {  
            "port": 8000,  
            "disableHostCheck": true,  
            "proxy": {  
                "/api": {  
                    "target": "https://api.ithome.com",  
                    "changeOrigin": true,  
                    "ws": true,  
                    "secure": false,
                }  
            }  
        }  
    },

用以下代码可以正确的请求到数据:

"h5": {
        "devServer": {  
            "port": 8000,  
            "disableHostCheck": true,  
            "proxy": {  
                "/api": {  
                    "target": "https://api.ithome.com",  //请求的目标域名
                    "changeOrigin": true,   
                    "secure": false,
                    "pathRewrite": {  
                        "^/api": "/"  
                    }
 
                }  
            }  
        }  
    }

2.在.vue页面中添加

                var ajaxData={
                    url: "/api"+"/api/reply",//接口地址即要跨域访问的目标地址
                    method: "get",//请求的方法
                    data:{postid:236076,replyidlessthan:3241294},//请求所带的参数,即地址中?后部分
                    dataType:'json',//数据类型
                    header:{
                      'content-type':'application/x-www-form-urlencoded'
                    },
                    success:function(res){
                            console.log(res.data)//成功后调用的函数
                        }
                  }
                  ajaxData = ajaxData;
                  uni.request(ajaxData)

完整的请求地址如下:

https://api.ithome.com/api/reply——>/api代替的https://api.ithome.com

  • 3
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值