Angular 8 无法使用 webcryptoAPI 导入 RSA 密钥

Question

我在Angular 8 客户端和Python Flask 服务器中实现Digital Signature 概念。我使用pycryptodome 从flask 为客户端和服务器创建了RSA-2048 密钥。我在Angular 中使用webcrypto API。我想导入客户的密钥来签名和验证。但是我无法导入密钥。

在 Flask 中生成 RSA 密钥：

import os
import sys
from Crypto.PublicKey import RSA
from Crypto.Util import asn1
from base64 import b64decode

arg = sys.argv[1]    //arg can be 'server' or 'client'
key_path = os.path.join('keysTemp')

#generate private key
key = RSA.generate(2048)
private_key = key.export_key()
file_out = open(os.path.join(key_path, arg + ".private.pem"), "wb")
file_out.write(private_key)

#generate public key
public_key = key.publickey().export_key()
file_out = open(os.path.join(key_path, arg + ".public.pem"), "wb")
file_out.write(public_key)

Angular 代码 sn-p (component.ts)

export class AppComponent {
    constructor(private http: HttpClient) { }

    str2ab(str) {
        const buf = new ArrayBuffer(str.length);
        const bufView = new Uint8Array(buf);
        for (let i = 0, strLen = str.length; i < strLen; i++) {
            bufView[i] = str.charCodeAt(i);
        }
        return buf;
    }
    async importKeys(code: string){
        try {
            let data = await this.http.get('assets/keys/client.private.pem', {responseType: 'text'}).toPromise();
            // fetch the part of the PEM string between header and footer
            const pemHeader = "-----BEGIN RSA PRIVATE KEY-----";
            const pemFooter = "-----END RSA PRIVATE KEY-----";
            const pemContents = data.substring(pemHeader.length, data.length - pemFooter.length);
            console.log('pemContents: ', pemContents);
            // base64 decode the string to get the binary data
            const binaryDerString = atob(pemContents);
            console.log('binaryDerString: ', binaryDerString);
            // convert from a binary string to an ArrayBuffer
            const binaryDer = this.str2ab(binaryDerString);
            console.log('client private key: ', binaryDer);
            return binaryDer;
        }catch (error) {
          console.error('error ', error);
        }
    }

    async digitalSignature(data){
        let messageDigest = (CryptoJS.MD5(data)).toString();
        console.log('messageDigest: ', messageDigest);

        let clientPrivateKey = await this.importKeys();
        console.log('clientPrivateKey: ', clientPrivateKey);

        try {
            let result = await window.crypto.subtle.importKey('pkcs8', clientPrivateKey, {
                name: "RSA-OAEP",
                hash: {
                    name: "SHA-256"
                }
            }, false, ["decrypt", "sign"]);
            console.log('import result: ', result);
        } catch (error) {
            console.error('error in import: ', error);
        }
    }
}

现在，当我运行应用程序时，客户端会生成数组缓冲区，但它会将 DOMexception 作为错误。无法将 .pem 文件转换为 CryptoKey 对象。请为此提供解决方案。谢谢。

Answer 1

好的，经过大量互联网搜索，我找到了这个库：node-forge for angular。它具有广泛的加密算法。对于flask，我使用了pycryptodome。 查看node-forge的详细信息