P5.js-web-editor: Privacy and exposed API keys

[jeremydouglass]

Nature of issue?

• New feature request

New feature details:

Currently, people who create sketches on the web editor using API keys are automatically exposing those keys to the world, and may not be aware they are doing so.

Right now searching the web editor for "apiKey" or similar strings
https://www.google.com/search?q="apiKey"+site%3Aeditor.p5js.org

...turns up a couple hundred examples from firebase, google maps, the new york times, giphy, mlab.com, pixabay, uifaces.co, wordnik, openweathermap.org, etc. Most of these are low security, but some are not.

Other than a robust private sketch feature, here are some ways of approaching this problem with features:

1. post a warning for the author if the editor recognizes an api string and api key. The author can ignore the warning or not.
2. advise the user to use save their sketch with the key variables empty / included.
3. advise the user to save their sketch with loading the key from localstorage. This is the workaround that codepen suggests: https://blog.codepen.io/2017/08/10/window-prompt-localstorage-api-keys/
4. offer an option for users to create private strings, AKA secrets. This is what glitch.com implements -- for example https://glitch.com/edit/#!/processing-js?path=.env:1:0

[catarak]

thanks for reporting! given that all apps on the web editor are front end only, this is tricky to solve, and also means that (4) isn't really an option. i like (3) as a solution, but the drawback is that sketches wouldn't be able to be run by users that don't own the sketch. i'm not sure how the editor would implement (1) or (2)—it seems like there could be a lot of edge cases, but maybe that's okay.

i also agree this is another reason to add the ability to make sketches private!

[ashu8912]

For Now We can add the feature of making sketch private.@catarak i can work on this one