前端密码加密
⑴ 前端加密与后端解密
请看demo， 用前请npm install crypto-js
创建一个js文件
import CryptoJS from 'crypto-js';
const encryptByDES = (message, key)=>{
let keyHex = CryptoJS.enc.Utf8.parse(key);
let encrypted = CryptoJS.DES.encrypt(message, keyHex, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.ZeroPadding
});
return encrypted.ciphertext.toString();
}
/**
* 对userId加密
* @param {String} userId
*/
export const encryption = (userId) => {
let _userId = userId.toString() || ''
let encryptedResult = encryptByDES(_userId, '')
return encryptedResult
}
html部分
import React, {Component} from 'react';
import CryptoJS from 'crypto-js';
import logo from './logo.svg';
import './App.css';
class App extends Component {
constructor(props){
super(props)
this.state={
userId: 123,
encryptedResult: ''
}
}
_handleChange = (event) => {
this.setState(() => ({
userId: event.target.value
}))
}
des = () => {
let data = this.encryptByDES('111', '')
this.setState(() => ({
encryptedResult: data
}))
}
encryptByDES = (message, key) => {
console.log(CryptoJS.pad)
let keyHex = CryptoJS.enc.Utf8.parse(key);
let encrypted = CryptoJS.DES.encrypt(message, keyHex, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.ZeroPadding
});
return encrypted.ciphertext.toString();
}
render() {
return (
<div className="App">
<input type="text" value={this.state.userId} onChange={this._handleChange}/>
<button type="button" onClick={this.des}>加密</button><br/>
<span>结果：{this.state.encryptedResult}</span>
</div>
);
}
}
export default App;
⑵ Web前端密码加密是否有意义
密码在前端加密完全没有意义，对密码系统的安全性不会有任何提高，反而会引发不必要的麻烦。首先，做前端开发的人需要知道，前端系统的控制权是完全在用户手里的，也就是说，前端做什么事情，用户有完全的控制权。假设如同 @陈轩所说，前端做过了md5，后台就不用做了，这个做法会有什么后果？如果某一天，这个系统的数据库泄露了，黑客就直接拿到了每个用户的密码md5值，但此时，由于黑客知道密码是在前端进行哈希的，所以他不需要爆破出该md5对应的原文是什么，而是直接修改客户端向服务器发出的请求，把密码字段换成数据库中MD5就可以了，由于与数据库中记录一致，直接就会登录成功。这跟直接存储明文密码没有任何区别！！！所以不管前端是不是加密了密码，后台使用安全的哈希算法对内容再次转换是非常有必要的。（MD5可不行，要用bcrypt，我之前回答过一个类似的：随着显卡性能的高速发展，目前的快速Hash算法是否已经变得不够安全了？）这个回答还有一个人赞同，希望大家别被错误答案误导了。另外一个答案 @林鸿所说，在非安全HTTP连接上，可以防止原始密码被窃听。但问题在于由于你的登录系统接受的哈希过的密码，而不是原文，窃听者根本不需要原始密码，只要通过哈希结果就可以伪造请求登录系统。这样做只能防止被窃听到原文的密码被攻击者用在社会学攻击上，而不能改善该网站的安全性。所以不管前端是不是加密了密码，使用HTTPS安全连接进行登录都是非常有必要的。以上我说的两点，合起来看就是：不管前端是否加密了密码，都不能以此为假设，让后端设计的安全等级下降，否则就会有严重的安全问题。实际上，前端进行密码加密，可以看做帮助用户多进行了一次原文的转换，不管用了什么加密算法，算出来的结果都是密码原文，你该如何保护用户的原始密码，就该如何保护此处的加密结果，因为对你的登录系统来说，它们都是密码原文。以上这些，说明了密码加密是没有什么意义的，接下来，我要说明前端加密会带来什么问题。有些人会认为前端进行了加密，可以降低后台的安全性需求，这种错误的观念会造成系统的安全漏洞。实际上，你不能对前端做任何的假设，所有跟安全相关的技术，都必须应用在后台上。前端进行加密会造成页面需要js脚本才能运行，那么假设你的系统需要兼容不能运行js的客户端，就必须再设计一个使用原文的登录接口。由于前端是不是加密，所有安全机制都必须照常应用，所以为系统增加这样的复杂性是完全没必要的，即使传输明文密码，只要正确使用了HTTPS连接和服务器端安全的哈希算法，密码系统都可以是很安全的。
⑶ 前端js几种加密/解密方法
方法汇总：
https://www.cnblogs.com/pinkpolk/articles/13600696.html
项目中用了crypto-js DES加密解密 前端用下面方法加密 后台用java的des解密
https://blog.csdn.net/huaweichenai/article/details/103497194
crypto-js AES需要前端来处理加密解密
https://www.npmjs.com/package/crypto-js
JS 使用 SHA1 加密示例
https://blog.csdn.net/qq_40147863/article/details/88034357
⑷ 前端加密、解密数据
首先，为了更好的加密，我们不能用简单的加密，因为很有可能会被轻松破解掉，我之前实现的加密只是简单的把数据加密，在测试过程中（安全数伏性测试），通过一些技巧还是可以解密成功。
所以，对于一些重要的信息可能需要非对称加密。
所谓的非对称加密解密，在我的理解的，就是前端用一把钥匙解密/加密，而后台用另一把钥匙来做同样的操作。
也就是，薯乱携前端加密用特定的钥匙，解密的钥匙只在陪雀后端那里。这样在传输过程中就不会把钥匙丢掉。
同样，后端加密数据用一把钥匙，解密的时候，前端自己有规定的钥匙，这样数据也不会在过程中解密截取。
1、我这里是用vue
所以，第一步 npm install jsencrypt
2、安装完之后，开始定义一个专门用来加密解密的文件，我放到utils文件里面。
引入JSEncrypt
3、重点来了加密解密
首先，我这里使用公钥加密（由后台来给你公钥）
全局引用，使用
这样加密就完成了。
通常由后台加密，前端负责加密
由后台生成私钥，然后前端用来解密。
引用和加密一样
⑸ Web前端密码加密是否有意义
没有意义
密码前端的加密根本没有意义，密码系统的安全性没有提高，但会造成不必要的麻烦。
首先，前端开发人员需要知道前端系统的控制完全掌握在用户手中，也就是说前端所做的事情和用户拥有完全的控制。据称，前端做了MD5，后台不必做，这种方法会有什么后果？如果有一天，系统数据库泄露，黑客直接获得每个用户的密码的MD5值，但这一次，因为黑客知道密码的哈希的前面，所以他不需要鼓风的MD5对应什么是原创，而是直接修改发送到服务器的客户端请求的在它的数据库密码字段MD5，符合数据库中的记录，你可以直接登录。这与直接存储明文密码没有区别！！！所以不管前端密码是否加密，后台使用哈希算法的安全内容转换都是必要的。（MD5不能使用BCrypt的，我以前回答类似：用图形表现，当前快速发展的快速哈希算法已成为不安全吗？）有一个人同意这个答案，我希望你不要被错误的答案误导。对方的回答，Linh说，是为了防止原始密码被利用在一个不安全的HTTP连接。但问题是，因为你的登录系统接受密码代替原来的，窃听者根本不需要原始密码，只要哈希结果可以伪造请求登录系统。这样做只会防止攻击者在社交攻击时使用原始密码，而不会提高网站的安全性。所以不管前面密码是不是加密的，使用HTTPS安全连接登录都是很有必要的。
