Recommended practice to store apikey in javascript application like Angular

Technical Support Apryse SDK
1

Product: Apryse webview
Product Version: latest

Hello everybody!

What is the best and recommended practice to store apikey in javascript application like Angular?

Thanks

2

Thank you for posting your question to our forum. We will provide you with an update as soon as possible.

3

Hello rick.ssantanna,

Unfortunately, we are not aware of any truly reliable way to hide a license key string used by a JavaScript framework. Since it’s possible to inspect JavaScript, a determined malicious user would always be able to recover the key. Even if the key were downloaded at runtime in encrypted form, then decrypted on-the-fly, and passed into our library, that would still be discoverable by a malicious user. As a result, we don’t require any further protection of the key other than passing it into the WebViewer constructor.

There are some ways to make it harder to find such as using window.btoa to encode the license key and using window.atob to decode it before passing it into the WebViewer constructor. Then uglify and minify the output script so it is harder to read.

// some other js file
window.zfeg48 = ‘bGljZW5zZSBrZXk=’; // randomly named global variable = btoa(‘license key’)

// main.js
WebViewer({
l: atob(window.zfeg48),
…
}, viewerElement);

You could make the process as difficult and convoluted as possible to deter prying eyes (ex. multiple minified files; each putting together a part of options object before passing into WebViewer). However, it will be accessible during the exchange.

This is all we require as a deterrent. Let us know if you have any other questions about this.