使用md5在vue中的axios請求時(shí)加密API問題
md5在vue中的axios請求時(shí)加密API
1.安裝axios
npm install axios
2.安裝MD5
npm install js-md5
3.在vue項(xiàng)目中得main.js中全局引入
import axios from 'axios'; import md5 from 'js-md5';
4.在main.js中加入以下代碼
const http = axios.create({ // 創(chuàng)建一個(gè)擁有通用配置的axios實(shí)例
timeout: 1000 * 30, // 請求超時(shí)時(shí)間(毫秒)
withCredentials: true, // 是否攜帶cookie信息
headers: { // 頭部信息
'Content-Type': 'application/json; charset=utf-8'
}
})
http.interceptors.request.use(config => { //添加一個(gè)請求攔截器
// 請求頭帶上token 在發(fā)送請求之前做某事
let time = new Date().getTime();
config.params['time'] = time;
config.headers['sign'] = md5('與后臺對應(yīng)的字符串'+time);
return config
}, error => {
return Promise.reject(error)
})
Vue.prototype.$axios= http;
5.在組件中運(yùn)用axios即可
this.$axios({
method: 'POST',
url:'項(xiàng)目的請求地址',
params: params
}).then((res)=>{
//成功的回調(diào)
console.log(res);
},function(error){
//失敗的回調(diào)
console.log(error);
})
接口安全要求
- 防偽裝攻擊(案例:在公共網(wǎng)絡(luò)環(huán)境中,第三方 有意或惡意 的調(diào)用我們的接口)
- 防篡改攻擊(案例:在公共網(wǎng)絡(luò)環(huán)境中,請求頭/查詢字符串/內(nèi)容 在傳輸過程被修改)
- 防重放攻擊(案例:在公共網(wǎng)絡(luò)環(huán)境中,請求被截獲,稍后被重放或多次重放)
- 防數(shù)據(jù)信息泄漏(案例:截獲用戶登錄請求,截獲到賬號、密碼等)
接口參數(shù)簽名 實(shí)現(xiàn)思路參考
必要的輸入?yún)?shù):
簽名算法過程:
1. 對除簽名外的所有請求參數(shù)按key做的升序排列,value無需編碼。(假設(shè)當(dāng)前時(shí)間的時(shí)間戳是12345678)
例如:有c=3,b=2,a=1 三個(gè)參,另加上時(shí)間戳后, 按key排序后為:a=1,b=2,c=3,_timestamp=12345678。
2. 把參數(shù)名和參數(shù)值連接成字符串,得到拼裝字符:a1b2c3_timestamp12345678
3. 用申請到的appkey 連接到接拼裝字符串頭部和尾部,然后進(jìn)行32位MD5加密,最后將到得MD5加密摘要轉(zhuǎn)化成大寫。
示例:假設(shè)appkey=test,md5(testa1b2c3_timestamp12345678test),取得MD5摘要值 C5F3EB5D7DC2748AED89E90AF00081E6 。
MD5加密算法:MD5為計(jì)算機(jī)安全領(lǐng)域廣泛使用的一種散列函數(shù),用以提供消息的完整性保護(hù)。對MD5加密算法簡要的敘述可以為:MD5以512位分組來處理輸入的信息,且每一分組又被劃分為16個(gè)32位子分組,經(jīng)過了一系列的處理后,算法的輸出由四個(gè)32位分組組成,將這四個(gè)32位分組級聯(lián)后將生成—個(gè)128位散列值。
MD5被廣泛用于各種軟件的密碼認(rèn)證和鑰匙識別上。MD5用的是哈希函數(shù),它的典型應(yīng)用是對一段信息產(chǎn)生信息摘要,以防止被篡改。MD5的典型應(yīng)用是對一段Message產(chǎn)生fingerprin指紋,以防止被“篡改”。如果再有—個(gè)第三方的認(rèn)證機(jī)構(gòu),用MD5還可以防止文件作者的“抵賴”,這就是所謂的數(shù)字簽名應(yīng)用。MD5還廣泛用于操作系統(tǒng)的登陸認(rèn)證上,如UNIX、各類BSD系統(tǒng)登錄密碼、數(shù)字簽名等諸多方
總結(jié)
1、接口調(diào)用方和接口提供方約定好統(tǒng)一的參數(shù)加密算法
2、接口調(diào)用方在調(diào)用時(shí)把加密后的_sign放在參數(shù)中去請求接口
3、接口提供方接到響應(yīng)后,判斷時(shí)間戳是不是在有效時(shí)間內(nèi)(這個(gè)時(shí)間間隔根據(jù)你的安全范圍可以是10分鐘,5分鐘,20秒等,過期失效,前提是需要保證接口提供方和調(diào)用方的服務(wù)器時(shí)間為準(zhǔn)確的網(wǎng)絡(luò)同步時(shí)間)
4、把參數(shù)中除了_sign以外的參數(shù)進(jìn)行加密,然后把加密結(jié)果和傳過來的_sign比較,相同則執(zhí)行調(diào)用請求。
5、如果服務(wù)器和客戶端的時(shí)間沒有同步,可以返回錯(cuò)誤的同時(shí)候在返回一個(gè)服務(wù)器的當(dāng)前時(shí)間,客戶端接收到該錯(cuò)誤后再請求上一個(gè)接口,時(shí)間則傳服務(wù)器剛剛返回的時(shí)間
6、如果用戶還沒有登錄時(shí),還沒有token之類的唯一標(biāo)識時(shí),可以和服務(wù)端定義一個(gè)固定的標(biāo)識來使用就行。
7、涉及到比較重要的信息,可以用AES對value進(jìn)行加密,防止抓包拉取到上傳的數(shù)據(jù)。
8、追求安全可以考慮https的雙向驗(yàn)證模式 + 參數(shù)的sign簽名的規(guī)則雙重驗(yàn)證達(dá)到安全的請求后臺。
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
詳解如何搭建mpvue框架搭配vant組件庫的小程序項(xiàng)目
這篇文章主要介紹了詳解如何搭建mpvue框架搭配vant組件庫的小程序項(xiàng)目,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-05-05
VUE+elementui面包屑實(shí)現(xiàn)動態(tài)路由詳解
今天小編就為大家分享一篇VUE+elementui面包屑實(shí)現(xiàn)動態(tài)路由詳解,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11
Vue + Elementui實(shí)現(xiàn)多標(biāo)簽頁共存的方法
這篇文章主要介紹了Vue + Elementui實(shí)現(xiàn)多標(biāo)簽頁共存的方法,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-06-06
Vue2中Element?DatePicker組件設(shè)置默認(rèn)日期及控制日期范圍
后臺項(xiàng)目想使用時(shí)間選擇器選擇一段時(shí)間進(jìn)行數(shù)據(jù)篩選,所以下面這篇文章主要給大家介紹了關(guān)于Vue2中Element?DatePicker組件設(shè)置默認(rèn)日期及控制日期范圍的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-11-11
解決vue.js提交數(shù)組時(shí)出現(xiàn)數(shù)組下標(biāo)的問題
今天小編就為大家分享一篇解決vue.js提交數(shù)組時(shí)出現(xiàn)數(shù)組下標(biāo)的問題,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11
如何使用HBuilderX把vue項(xiàng)目打包成apk
這篇文章主要介紹了如何使用HBuilderX把vue項(xiàng)目打包成apk,具有很好的參考價(jià)值,希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-07-07
Vue中動態(tài)Class實(shí)戰(zhàn)示例
這篇文章主要為大家介紹了Vue中動態(tài)Class的實(shí)戰(zhàn)示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11
Vue唯一可以更改vuex實(shí)例中state數(shù)據(jù)狀態(tài)的屬性對象Mutation的講解
今天小編就為大家分享一篇關(guān)于Vue唯一可以更改vuex實(shí)例中state數(shù)據(jù)狀態(tài)的屬性對象,小編覺得內(nèi)容挺不錯(cuò)的,現(xiàn)在分享給大家,具有很好的參考價(jià)值,需要的朋友一起跟隨小編來看看吧2019-01-01

