vue學習日記 vue跨域處理

2022-01-15 07:22:02 字數 1190 閱讀 6954

vue跨域的方法一種是直接在config資料夾下的index.js中的dev物件中配置proxytable屬性,

另一種是新建乙個proxyconfig.js檔案,然後注入index.js中,本質其實是一樣的。

只是後一種將配置單獨寫成了乙個檔案而已。這裡我選擇了第二種寫法。

首先在config資料夾下新建乙個proxyconfig.js檔案,**如下:

module.exports =

} }

}

這個就代表所有以jwt開頭的請求,將發往

如果pathrewrite那個部分不注釋掉的話,就代表所有以jwt開頭的請求,

將發往並且在請求的時候刪掉請求位址中的/jwt。

然後是index.js中的寫法:

'use strict'

//template version: 1.3.1

//see for documentation.

const path = require('path');

const proxyconfig = require("./proxyconfig");

module.exports ={

dev: {

//paths

assetssubdirectory: 'static',

assetspublicpath: '/',

proxytable: proxyconfig.proxy,

//various dev server settings

host: 'localhost', //

can be overwritten by process.env.host

port: 9090, //

can be overwritten by process.env.port, if port is in use, a free one will be determined

autoopenbrowser: false

, erroroverlay:

true

, notifyonerrors:

true

, poll:

false, //

就是很簡單的引入並配置就好了。接下來就可以測試跨域是否成功了。

vue跨域處理

本人對於vue跨域處理流程不是很清楚,特此理順一遍。1.在config中進行配置,該檔案不是都存在,需要自己建 proxytable,這個引數主要是乙個位址對映表,你可以通過設定將複雜的url簡化,face就代表了若是介面中沒有face,則需要設定baseurl module.exports 2.在...

vue 跨域 proxy跨域處理

跨域就是因為同源策略。為了安全的。這裡的配置跨域本質上就是將本地的位址轉換成伺服器需要的真正期望的位址。本地位址 http localhost 8080 api allin policy getproductinfo 伺服器 devserver 本地 http localhost 8080 alli...

Vue跨域問題處理

vue cli2 方案 config 目錄下有乙個 index.js 檔案 module.exports 攔截所有的 websocket 請求 ws vue cli3 方案 vue.config.js 這個配置檔案中來配置 let proxyobj proxyobj ws proxyobj modu...