Free API Key - Referer needed?

[Bschitter]

Hi

First I just wanted to say that your project looks awesome!

I'm exploring and testing ALTCHA in my Angular application. I have successfully created a free API key and integrated the widget and the script to my app.

When I click the checkbox of the widget however, it says Verification failed. Try again later and the browser console shows a 403 error:

{"error":"Invalid API key.","statusCode":403}

Do I need to add the DNS record in order for my free API key to work? And how would that work from localhost? The documentation is not that clear to me. It states that Domain name verification only applies to Free API Keys. and also While optional, domain verification is strongly recommended..

And this part of the documentation states that a 403 error might come from a missing Referer Header. How would I send the Referer header from the widget?

So I'm not sure why it wont work.

Thanks

[ovx]

Hi and thank you. The error "Invalid API key." is probably, because you're using a non-standard port such as localhost:3000 but you registered the key with only localhost. Try to generate a new key and include the port number.

The error from the API will be improved to include more information about what's wrong.

The DNS verification isn't needed, but recommended for production use to prevent somebody else to register a new key for your domain names.

[Bschitter]

Hi

Thanks! That was indeed the issue.

But I have one more problem. I'm getting the following error when clicking the checkbox (16x same error on different blobs) and it keeps spinning:

6a446dc3-385c-47ca-b49d-47fb3d806f16:1 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'digest')
    at p (6a446dc3-385c-47ca-b49d-47fb3d806f16:1:194)
    at 6a446dc3-385c-47ca-b49d-47fb3d806f16:1:402
    at g (6a446dc3-385c-47ca-b49d-47fb3d806f16:1:463)
    at onmessage (6a446dc3-385c-47ca-b49d-47fb3d806f16:1:654)

BTW, I'm using https://github.com/altcha-org/altcha/blob/main/dist/altcha.umd.cjs since the normal or minified version show an error in console:

Uncaught SyntaxError: Unexpected token 'export' (at scripts.js:1369:1)

Does Angular need to use the universal module definition?

[ovx]

The first issue with digest seems like you're not running in the secure context required for crypto. Without TLS (https), only localhost and *.localhost domain names are allowed; you can also use a TLS server with self-signed certificates for other domain names.

I don't have much experience with Angular, cannot really answer the seconds question. The widget includes ES and UMD builds, which should be detected automatically depending on the build environment.

[Bschitter]

Thanks, that was the problem. Now it is working.

I'm using a custom local domain like local.example.com. When I started the app with HTTPS everything worked.