您好,登錄后才能下訂單哦!
什么是代理跨域
瀏覽器之間有同源策略,出于安全考慮不同域之間不允許獲取數據,除了幾個特殊的例子
<img>、<script>、<audio>等標簽可以進行跨域但是通常都是以get的形式,如果用js的axios去遠程獲取的話進會觸發同源政策,除非你服務端的代碼設置了header同意讓你訪問,明顯這很不合理呀!。現在不是都流行前后端的分離嗎,后端代碼跑掉了只剩下前端了,兩個次元的代碼我前端該怎么獲取啊,感覺使用跨域好麻煩好難搞啊還不一定搞得到,這個時候就可以用到代理跨域了
代理跨域原理
所謂代理就是代替前端而是用后端發出http請求,就如vue的腳手架中,要運行項目你要輸入npm run dev或npm run start吧,這個命令其實打開它已經配置好的node服務器,vue腳手架的代理就是通過node來代替前臺發起http請求,既然不是瀏覽器發起的請求那不是就很容易啦?
vue腳手架如何代理跨域,找到在config文件夾下的index.js文件,文件中有個dev,在里面找到proxyTable{},對它進行修改
proxyTable: { '/api': { target: 'https://www.xxx.com/',//你要跨的域 changeOrigin: true, pathRewrite: { '^/api': '/api', }, headers:{ //這邊可以堆headers進行設置 } }, },
其中target是你要跨域的地址,/api是你所跨的域下的下一級路徑,像上面這樣就是獲取https://www.xxx.com/api下的東西,然后我們引入一個ajax的包axios并進行ajax
import axios from 'axios' axios.get('/getMessage').then(()=>{})
上面的代碼執行后,會自動幫你跨域獲取到https://www.xxx.com/api/getMessage的數據
總結
以上所述是小編給大家介紹的vue 設置proxyTable參數進行代理跨域,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。