使用 WebAPI 加密数据时出现 TypeError window.crypto.subtle.encrypt()

Posted

技术标签:

【中文标题】使用 WebAPI 加密数据时出现 TypeError window.crypto.subtle.encrypt()【英文标题】:TypeError when encrypting data using the WebAPI window.crypto.subtle.encrypt() 【发布时间】:2017-02-17 16:09:19 【问题描述】:

当我尝试在 Firefox 上使用 Crypto API 时遇到了问题。 (doc) 当我尝试使用此函数加密明文时出现 TypeError:

window.crypto.subtle.encrypt(algo_enc,key,padded_clear_txt);

(doc)

这就是我定义参数的方式:

算法编码:

var iv = new Int32Array(4) ;//4-32 bit integers (128 bits)    
window.crypto.getRandomValues(iv); //defining the IV
var algo_enc = "name": "AES-CBC", iv

键:

var alg_key = "name":"AES-CBC","length":128;   
var key = window.crypto.subtle.generateKey(alg_key,false,["encrypt","decrypt"]);

padded-clear-txt 是我要加密的 256 位 (2*128) 消息。

这是我执行加密功能时遇到的错误:

SubtleCrypto.encrypt 的参数 2 没有实现接口 CryptoKey。

密钥的生成很顺利,它是一个 CryptoKey 对象,但我仍然收到此错误。所以也许这是一个我应该报告的错误......

【问题讨论】:

【参考方案1】:

WebCrypto 函数返回 Promise。它们不是同步的。结果在回调中接收。看到这个full example

window.crypto.subtle.generateKey(  name: "AES-CBC", length: 128 , false,  ["encrypt", "decrypt"] )
.then(function(key)
    var iv  = window.crypto.getRandomValues(new Uint8Array(16))
    window.crypto.subtle.encrypt( name: "AES-CBC",iv: iv,, key, dataToEncrypt )
    .then(function(encrypted)
        //returns an ArrayBuffer containing the encrypted data
    ).catch(function(err)
       console.error(err);
    );     
).catch(function(err)
    console.error(err);
);

注意 webcrypto 使用 ArrayBuffer 进行输入和输出数据

【讨论】:

以上是关于使用 WebAPI 加密数据时出现 TypeError window.crypto.subtle.encrypt()的主要内容,如果未能解决你的问题,请参考以下文章

使用加密连接连接到数据源时出现 Power Query 错误

解密 C# 中使用 RSA-OAEP 在 JavaScript 中加密的数据时出现 OAEP 填充错误

使用来自 Angular JS 的 Web API 令牌身份验证时出现错误请求 (400)

两次调用 WebApi 时出现 ServerProtocolViolation 错误

从角度访问webapi时出现401未经授权的错误

使用 yarn dev 在 localhost 7777 启动 Next.js 应用程序时出现问题