Import key with crypto in middleware.ts

[Chanizo]

Summary

Hello,
I am struggling to use WebCrypto in my Nextjs middleware, to replace jsonwebtoken used in server side (not available in Edge Runtime)
I have public/private keys and I am trying to import my private key to sign data
These examples are not working in my middleware, did someone succeeded ?
https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/importKey#pkcs_8_import

I am always obtaining this error : ⨯ Error [DataError]: Invalid keyData

Just replaced str2ab function by 'new TextEncoder().encode(privateKey)' because I had a format issue using it. I tried with my key, and keys from given examples, but none is working...

Nextjs : v14 with Typescript

My code :

  const pemFooter = '-----END RSA PRIVATE KEY-----';
  const pemContents = PEM.substring(
    pemHeader.length,
    PEM.length - pemFooter.length - 1
  );
  const atobPrivateKey = atob(pemContents);
  const privateKeyAsCryptoKey = await crypto.subtle.importKey(
    'pkcs8',
    new TextEncoder().encode(atobPrivateKey),
    {
      name: 'RSA-PSS',
      hash: 'SHA-256',
    },
    true,
    ['sign']
  );```

[icyJoseph]

Honestly, I am not the biggest fan of going around installing packages, but jose has been such a solid library when it comes to doing crypto on edge environments... give it a go: https://www.npmjs.com/package/jose

[Chanizo]

Thank you for your answer @icyJoseph !
I tried jose and I have encountered same problem... but I found the the solution
In fact I was using basic ssh-keygen / openssl commands to generate a public / private key pair, but it was in format PKCS#1 by default. Jose and crypto libraries need more recent format, like PKCS#8 (private key) and SPKI (public key)

Related issue : panva/jose#345

Old commands :

openssl rsa -in my.key -pubout -outform PEM -out my.key.pub```

New commands :
```ssh-keygen -t rsa -b 4096 -m PKCS8 -f my.key -N ''
openssl pkey -in my.key -pubout -outform PEM -out my.key.pub```