跨域是什么
簡單的講就是你在一個地方使用另一個地方的資源,被瀏覽器給擋下來了,不讓不用!當然,它擋下來是有自己理由的:為了安全(╬▔皿▔)╯,
解決跨域
我是用vue開發的,就vue代理模式解決跨域說明一下,
1、在vue.config.js中這樣寫:
let devProxy = {
//獲取ip資訊
'/getIpMsg': {
target: "https://whois.pconline.com.cn/ipJson.jsp",//真實地址
ws: true,
changeOrigin: true,
pathRewrite: {
'/getIpMsg': ''
},
},
};
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
publicPath: process.env.NODE_ENV === "production" ? "./" : "/",
devServer: {
port: 8080,//埠
open: false,//專案啟動后是否在瀏覽器自動打開
proxy: devProxy//代理服務器
},
})
target就是自己需要代理的真實地址getIpMsg你是可以自定義的,
2、創建一個http.ts(我是ts的,你也可以js):
import axios from "axios";
//創建請求
function createServe(config: any) {
let serve = axios.create({
timeout: 5000 //超時
});
//請求攔截器
serve.interceptors.request.use(
config => {
return config;
},
error => {
return Promise.reject(error)
}
)
//回應攔截器
serve.interceptors.response.use(
response => {
return response;
},
error => {
return Promise.reject(error)
}
)
return serve(config);
}
export default createServe;
3、創建一個request.ts:
import createServe from "./http"
//獲取ip資訊
export function getIpMsg(params = {}) {
return createServe({
method: "GET",
url: '/getIpMsg',
params
})
}
4、這樣使用:
import { getIpMsg } from "@/api/request";
function test(){
getIpMsg()
.then(res => {
console.log(res);
})
}
原創者:曦12
原文鏈接:https://www.cnblogs.com/xi12/p/16690090.html
轉載請注明原創者添加原文鏈接!
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/507235.html
標籤:其他
上一篇:jsonp跨域
