国密加密SM4在Angular项目中的应用

近期项目提了个需求,需要用国密加密SM4算法对系统中的敏感数据进行加密,比如用户的登录密码,首先查询资料了解一下国密加密, 然后在github中搜索相关的库,最后选择sm-crypto来实现该功能。

1.在angular项目中安装依赖包;
angular 中默认使用的是ES模块化,而不是CommonJS模块化,因此不能直接使用教程中的require语法引入库,需额外安装@types/sm-crypto依赖

npm install --save  sm-crypto 
npm install --save @types/sm-crypto 

2.查看源码;
了解sm4函数的传参和逻辑

image.png

3.在需要加密的组件中引入sm-crypto

import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { sm4 } from 'sm-crypto';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.scss']
})
export class LoginComponent implements OnInit {
  public  loginForm: FormGroup;
  // 密钥一般由后端返回
  private SM4Key = '0123456789abcdeffedcba9876543210';
  constructor(
    private fb: FormBuilder
  ) {}

  ngOnInit(): void {
    this.loginForm = this.fb.group({
      username: ['', [Validators.required]],
      password: ['', [Validators.required]],
    });
  }

  public login() {
    // 对密码进行加密,加密模式和 padding 都可以跟后端约定好
    // encrypt 函数默认的是 cbc 模式,padding 默认是 pkcs#7 
    const password = sm4.encrypt(this.loginForm.value.password, this.SM4Key);
   }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容