uni-app 本地訪問接口跨域

uni-app在本地訪問接口跨域，可進行如下配置：

需要在manifest.json的源碼中找到h5,添加以下代碼：

 

"devServer" : {
            "proxy" : {
                "/dpc" : {
                    "target" : "****", //域名
                    "changeOrigin" : true,
                    "secure" : false,
                    "pathRewrite" : {
                        "^/dpc" : ""
                    }
                }
            },
            "https" : true
        },

 

其中

target接口訪問的域名

pathRewrite為接口重定向

https  是否是https的

然后在請求接口的時候需要將/dcp/,重定向的路徑加到訪問接口的域名中；

如下https.js：

const baseUrl = 'https://***';  //接口請求域名
const httpRequest = (opts, data) => {
    var httpDefaultOpts = {
        url: "/dpc/"+opts.url, //本地訪問時開啟
        // url: baseUrl+opts.url, //線上環境中開啟
        data: data,
        beforeSend :function(xmlHttp){
            xmlHttp.setRequestHeader("If-Modified-Since","0"); 
            xmlHttp.setRequestHeader("Cache-Control","no-cache");
        },
        method: opts.method,
        header: opts.method == 'GET' ? {
        'X-Requested-With': 'XMLHttpRequest',
        "Accept": "application/json",
        "Content-Type": "application/json; charset=UTF-8"
    } : {
       'content-type': 'application/x-www-form-urlencoded'
    },
        dataType: 'json',
    }
    var promise = new Promise(function(resolve, reject) {
        uni.request(httpDefaultOpts).then(
            (res) => {
                resolve(res[1])
            }
        ).catch(
            (response) => {
                reject(response)
            }
        )
    })
    return promise
};
export default {
    baseUrl,
    httpRequest,
}

在本地瀏覽器中，接口地址為   url: "/dpc/"+opts.url,

在線上訪問時，需要將接口地址切換回來  url: baseUrl+opts.url,

https.js在main.js中全局配置后就可以在整個項目中使用；

如下圖，訪問出的接口地址是

請求地址會變成   https://localhost:8080/dpc/*****

而請求的狀態是成功；

至此成功解決uni-app本地接口訪問跨域的問題；

啦

啦啦

啦啦啦

啦啦啦啦啦

 

 

有問題可以留言