수색…


비고

WebCrypto API는 일반적으로 "안전한"출처에서만 사용할 수 있습니다. 즉, 문서가 HTTPS 또는 로컬 컴퓨터 (로컬 localhost , file: 또는 브라우저 확장 프로그램)를 통해로드되어 있어야합니다.

이러한 API는 W3C 웹 암호화 API 후보 권고에서 지정 합니다.

암호 학적으로 임의의 데이터

// Create an array with a fixed size and type.
var array = new Uint8Array(5);

// Generate cryptographically random values
crypto.getRandomValues(array);

// Print the array to the console
console.log(array);

crypto.getRandomValues(array) 는 다음 클래스의 인스턴스 ( 이진 데이터 에서 자세히 설명)와 함께 사용할 수 있으며 주어진 범위 (양 끝 포함)에서 값을 생성합니다.

  • Int8Array : 29 7 2 7 -1
  • Uint8Array : 0 ~ 2 8 -1
  • Int16Array : -2 15 ~ 2 15 -1
  • Uint16Array : 0 ~ 2 16 -1
  • Int32Array : -2 31 ~ 2 31 -1
  • Uint32Array : 0 ~ 2 31 -1

다이제스트 만들기 (예 : SHA-256)

// Convert string to ArrayBuffer. This step is only necessary if you wish to hash a string, not if you aready got an ArrayBuffer such as an Uint8Array.
var input = new TextEncoder('utf-8').encode('Hello world!');

// Calculate the SHA-256 digest
crypto.subtle.digest('SHA-256', input)
// Wait for completion
.then(function(digest) {
  // digest is an ArrayBuffer. There are multiple ways to proceed.

  // If you want to display the digest as a hexadecimal string, this will work:
  var view = new DataView(digest);
  var hexstr = '';
  for(var i = 0; i < view.byteLength; i++) {
    var b = view.getUint8(i);
    hexstr += '0123456789abcdef'[(b & 0xf0) >> 4];
    hexstr += '0123456789abcdef'[(b & 0x0f)];
  }
  console.log(hexstr);

  // Otherwise, you can simply create an Uint8Array from the buffer:
  var digestAsArray = new Uint8Array(digest);
  console.log(digestAsArray);
})
// Catch errors
.catch(function(err) {
  console.error(err);
});

현재의 초안은 적어도 SHA-1 , SHA-256 , SHA-384SHA-512 를 제공 할 것을 제안하고 있지만 이것은 엄격한 요구 사항이 아니며 변경 될 수 있습니다. 그러나 SHA 제품군은 모든 주요 브라우저에서 지원 될 가능성이 있기 때문에 여전히 좋은 선택으로 간주 될 수 있습니다.

RSA 키 쌍 생성 및 PEM 형식으로 변환

이 예에서는 RSA-OAEP 키 쌍을 생성하는 방법과이 키 쌍의 개인 키를 base64로 변환하여 OpenSSL과 함께 사용할 수있는 방법을 배우게됩니다.이 프로세스는 방금 가지고있는 공개 키에도 사용할 수 있습니다 아래 접두어와 접미사를 사용하려면 다음을 수행하십시오.

-----BEGIN PUBLIC KEY-----
-----END PUBLIC KEY-----

참고 :이 예제는 Chrome, Firefox, Opera, Vivaldi에서 완벽하게 테스트되었습니다.

function arrayBufferToBase64(arrayBuffer) {
    var byteArray = new Uint8Array(arrayBuffer);
    var byteString = '';
    for(var i=0; i < byteArray.byteLength; i++) {
        byteString += String.fromCharCode(byteArray[i]);
    }
    var b64 = window.btoa(byteString);

    return b64;
}

function addNewLines(str) {
    var finalString = '';
    while(str.length > 0) {
        finalString += str.substring(0, 64) + '\n';
        str = str.substring(64);
    }

    return finalString;
}

function toPem(privateKey) {
    var b64 = addNewLines(arrayBufferToBase64(privateKey));
    var pem = "-----BEGIN PRIVATE KEY-----\n" + b64 + "-----END PRIVATE KEY-----";
    
    return pem;
}

// Let's generate the key pair first
window.crypto.subtle.generateKey(
    {
        name: "RSA-OAEP",
        modulusLength: 2048, // can be 1024, 2048 or 4096
        publicExponent: new Uint8Array([0x01, 0x00, 0x01]),
        hash: {name: "SHA-256"} // or SHA-512
    },
    true,
    ["encrypt", "decrypt"]
).then(function(keyPair) {
    /* now when the key pair is generated we are going
       to export it from the keypair object in pkcs8
    */
    window.crypto.subtle.exportKey(
        "pkcs8",
        keyPair.privateKey
    ).then(function(exportedPrivateKey) {
        // converting exported private key to PEM format
        var pem = toPem(exportedPrivateKey);
        console.log(pem);
    }).catch(function(err) {
        console.log(err);
    });
});

그게 다야! 이제 원하는대로 사용할 수있는 완벽하게 작동하고 호환 가능한 RSA-OAEP 개인 키가 PEM 형식으로 제공됩니다. 즐겨!

PEM 키 쌍을 CryptoKey로 변환

그렇다면 웹 암호화 API에서 OpenSSL에 의해 생성 된 PEM RSA 키 쌍을 사용하는 방법에 대해 궁금해 한 적이 있습니까? 대답이 '예'인 경우 큰! 당신은 알아낼 것입니다.

참고 :이 프로세스는 공개 키에도 사용할 수 있습니다. 접두어와 접미사 만 변경하면됩니다.

-----BEGIN PUBLIC KEY-----
-----END PUBLIC KEY-----

이 예에서는 PEM에서 RSA 키 쌍을 생성했다고 가정합니다.

function removeLines(str) {
    return str.replace("\n", "");
}

function base64ToArrayBuffer(b64) {
    var byteString = window.atob(b64);
    var byteArray = new Uint8Array(byteString.length);
    for(var i=0; i < byteString.length; i++) {
        byteArray[i] = byteString.charCodeAt(i);
    }

    return byteArray;
}

function pemToArrayBuffer(pem) {
    var b64Lines = removeLines(pem);
    var b64Prefix = b64Lines.replace('-----BEGIN PRIVATE KEY-----', '');
    var b64Final = b64Prefix.replace('-----END PRIVATE KEY-----', '');

    return base64ToArrayBuffer(b64Final);
}

window.crypto.subtle.importKey(
    "pkcs8",
    pemToArrayBuffer(yourprivatekey),
    {
        name: "RSA-OAEP",
        hash: {name: "SHA-256"} // or SHA-512
    },
    true,
    ["decrypt"]
).then(function(importedPrivateKey) {
    console.log(importedPrivateKey);
}).catch(function(err) {
    console.log(err);
});

이제 끝났습니다! WebCrypto API에서 가져온 키를 사용할 수 있습니다.



Modified text is an extract of the original Stack Overflow Documentation
아래 라이선스 CC BY-SA 3.0
와 제휴하지 않음 Stack Overflow