Search code examples
javascriptweb-audio-apijavascript-securitysecure-context

How to locally test javascript that contains classes that require secure context


EDIT: It looks like I was making a false assumption that the reason why my code was not working (I was getting AudioWorkletProcessor is undefined) was because the context was insecure... but I will leave this question up since the general question and answer is still useful).

On Mac, I am trying to test some website javascript that involves AudioWorkletProcessor.

Apparently this class is "only available in a secure context."

I'm assuming this means that the browser running the javascript that contains it must believe it is secure (https) with a valid certificate.

I am testing using firebase serve which makes the site available at localhost:5000 but it doesn't use or offer https.

As far as I understand my options are:

  1. Use ngrok to create an https tunnel to localhost:5000
    Cannot, because it is a paid feature and I don't want to get into that.

  2. Use http-server like this:
    openssl req -nodes -new -x509 -keyout server.key -out server.cert
    http-server -S -C server.cert -K server.key -p 5000 ./public

... but this does not work because the cert is not valid, so we would need add the bad cert to my keychain which I also don't like.

Is there some other way to test javascript that uses classes that require a secure context? Maybe some kind of fake/test browser??

Thanks.


Solution

  • From https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts

    Locally-delivered resources such as those with http://127.0.0.1 URLs, http://localhost and http://*.localhost URLs (e.g. http://dev.whatever.localhost/), and file:// URLs are also considered to have been delivered securely.

    You can verify this through the window.isSecureContext property.