VueJs里利用CryptoJs實現加密及解密

shleyZ 發布于2019-08-23 17:11 / 2997人閱讀

摘要：第一步安裝安裝第二步創建在文件目錄下創建一個文件對頁面上輸入的密碼進行加密傳輸給后臺進行驗證，對返回的數據進行解密，在頁面展示引入源碼對密碼進行加密，傳輸給后臺進行驗證需要加密的密碼對密碼加密的秘鑰加密的密文加密對加密之后的密文在頁面上

第一步安裝
安裝crypto-js

第二步創建
在js文件目錄下創建一個js文件secret

/**
 * 對頁面上輸入的密碼進行加密傳輸給后臺進行驗證，對返回的數據進行解密，在頁面展示
 */
let CryptoJS = require("crypto-js"); // 引入AES源碼js
export default {
/*
* 對密碼進行加密，傳輸給后臺進行驗證
* @param  {String}     word    需要加密的密碼
* @param  {String}     keyStr    對密碼加密的秘鑰
* @return {String}     加密的密文
* */
encrypt(word, keyStr) { // 加密
    keyStr = keyStr ? keyStr : "ABGHNJHGSHUYG12";
    let key = CryptoJS.enc.Utf8.parse(keyStr);
    let srcs = CryptoJS.enc.Utf8.parse(word);
    let encrypted = CryptoJS.AES.encrypt(srcs, key, {
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
    });
    return encrypted.toString();
},
/*
* 對加密之后的密文在頁面上進行解密，以便用戶進行修改
* @param  {String}     word    需要加密的密碼
* @param  {String}     keyStr    對密碼加密的秘鑰
* @return {String}      解密的明文
* */
decrypt(word, keyStr) { // 解密
    keyStr = keyStr ? keyStr : "ABGHNJHGSHUYG12";
    let key = CryptoJS.enc.Utf8.parse(keyStr);
    let decrypt = CryptoJS.AES.decrypt(word, key, {
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
    });
    return CryptoJS.enc.Utf8.stringify(decrypt).toString();
},
};

第三步，引入
在具體的加解密模塊中引入文件

并且對需要加密的密碼使用加密函數進行加密

encrypt是加密函數
第一個參數是需要加密的明文
第二個參數是加密過程中使用的秘鑰

我是一個小小白，誰能摸黑我快點來

云服務器 GPU云服務器 php實現加密解密加密解密加密視頻解密加密和解密

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/103950.html

JavaScript基于crypto-js的加密和PHP對此加密的解密及相同加密方式

摘要：合適和夠用是最完美的追求。個人網站最近剛寫了一個手機在線播放的電影站基于的加密和對此加密的解密及相同加密方式最近使用做了一個電影電視劇在線播放的的小站，使用到的是的進行實時抓取，其中遇到了加密的問題，遂解決之，才有了這篇總結。關于作者程序開發人員，不拘泥于語言與技術，目前主要從事PHP和前端開發，使用Laravel和VueJs，App端使用Apicloud混合式開發。合適和夠用是...

xuhong 2019-06-27 16:24 評論0 收藏0
JavaScript基于crypto-js的加密和PHP對此加密的解密及相同加密方式

摘要：合適和夠用是最完美的追求。個人網站最近剛寫了一個手機在線播放的電影站基于的加密和對此加密的解密及相同加密方式最近使用做了一個電影電視劇在線播放的的小站，使用到的是的進行實時抓取，其中遇到了加密的問題，遂解決之，才有了這篇總結。關于作者程序開發人員，不拘泥于語言與技術，目前主要從事PHP和前端開發，使用Laravel和VueJs，App端使用Apicloud混合式開發。合適和夠用是...

saucxs 2019-08-22 11:03 評論0 收藏0
一套簡單的基于 RSA + AES 加密機制的前端解決方案

摘要：前言因公司現有后臺管理系統項目需對部分網絡請求接口的重要數據進行加密，整合了一套簡單的基于加密機制的前端解決方案。用戶已登錄成功，頁面刷新后將會重新生成，這時候需從中獲取并和上傳后端，后端重新綁定和。前言因公司現有后臺管理系統項目需對部分網絡請求接口的重要數據進行加密，整合了一套簡單的基于 RSA + AES 加密機制的前端解決方案。參考文獻： crypto 廖雪峰 crypt...

Travis 2019-08-23 17:58 評論0 收藏0
前端crypto-js解密報malformed utf-8 data小結

摘要：一般情況下，很少會在前端進行加解密的操作，因為沒有太大的必要性，前端的代碼是很容易看到的，即使這樣，我覺得還是有比較處理一下的，至少不讓別人一眼就看到信息我使用存儲了一些用戶的用戶名昵稱等的信息，通過進行加解密處理，這里我選用了加密算法對一般情況下，很少會在前端進行加解密的操作，因為沒有太大的必要性，前端的代碼是很容易看到的，即使這樣，我覺得還是有比較處理一下的，至少不讓別人一眼就看...

codergarden 2019-08-23 14:21 評論0 收藏0
使用crypto-js進行128位AES/ECB/PKCS7Padding加密/解密

摘要：支持多種加解密方案這里主要記錄一下使用進行位的加解密前端加密是不安全的不安全的不安全的初始化一個文件直接全部回車就行啦安裝在同級目錄下新建一個文件寫入以下內容導入包定義加解密的都放這里了加密還有啥意義設置數據塊長度生成密鑰字節數 crypto-js支持多種加/解密方案, 這里主要記錄一下使用 crypto-js 進行 AES 128位的加/解密; 前端加密是不安全的, 不安全的, 不...

jas0n 2019-08-21 16:19 評論0 收藏0