vue axios使用crypto js對引數加密

2021-10-09 04:39:27 字數 1251 閱讀 1998

在前後端分離的專案中有的需要提高安全性,會要求對請求引數進行加密。

目前已使用的是對稱加密,非對稱加密需要網上找非對稱加密方式把對稱加密的修改應該就差不多。

實現思路:在專案中安裝引入crypto-js依賴,然後寫個加密方法,如果有區分getpost兩種請求方式那就寫兩個加密方法。最後在axios請求攔截方法中呼叫即可。

1.安裝引入crypto-js。npm install crypto-js -d

2.在專案中新建乙個加密檔案,比如:cryptofun.js

3,在檔案中引入加密外掛程式

import cryptojs from

'crypto-js'

;import md5 from

'blueimp-md5'

;import auth from

'./index'

我這邊還有多引入乙個md5加密。

4.寫加密方法並export

export

default

var srcs = cryptojs.enc.utf8.

parse

(json

.stringify

(param));

var key = cryptojs.enc.utf8.

parse

(keys)

;var datas = cryptojs.

aes.

encrypt

(srcs, key,);

return datas.

tostring()

;},cryptofunget

(param, keys));

return datas.

tostring()

;}};

5.在axios攔截方法中呼叫這加密方法即可

// 新增請求***

axios.interceptors.request.

use(

function

(config)

}else

if(config.method ==

'get'

)return config

},function

(error)

)

vue axios 封裝及使用

在vue專案中,和後台互動獲取資料這塊,我們通常使用的是axios庫,它是基於promise的http庫,可執行在瀏覽器端和node.js中。他有很多優秀的特性,例如攔截請求和響應 取消請求 轉換json 客戶端防禦xsrf等。1 首先建立 vue 專案,安裝 axiosvue create dem...

vue axios封裝以及使用

api.js裡面存放封裝的axios 如下 在vue頁面的script標籤中引入 import from ajax api tget,tpost,tformpost,tput,tdel 需要什麼方式引入什麼方式,例如 import from ajax api 可以直接這麼引入乙個 寫頁面的畫就不用寫...

關於VUE的vue axios使用

npm npm i axios s npm i vue axios s 全域性註冊 axios import vue from vue import axios from axios vue.prototype.axios axios this.axios使用 或 vue axios import ...