Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Example of overriding Secret with custom implementation #17

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

tophtucker
Copy link
Contributor

Responding to this forum question. It's a little delicate because we gotta be careful not to encourage anyone to use a Map of hardcoded Secrets client-side — but using Secrets with the Runtime API does seem like an important scenario that merits an example.

I thought about making the example call an API with a token, but don't wanna actually call anything and don't want them to see a broken request. And then I thought about using the Secret to decode a message with a Vigenère cipher, simple enough that decryption could be one cell, but figured that was overthinking it and all people need to see is the value!

Copy link
Member

@mbostock mbostock left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I worry that this is a fairly significant footgun for folks that don’t understand the implications of hard-coding a secret into their code. Like, is that what we want to recommend? Or should we instead recommend… I dunno, pulling a secret out of localStorage? Or passing the secret as a query parameter? I would like to understand the use case here before we formalize a recommendation.

@@ -12,6 +12,7 @@ This repository contains examples of [embedding Observable notebooks](https://ob
| [**custom-fluid-width**](https://github.com/observablehq/examples/tree/main/custom-fluid-width/) | Resize a chart when the window is resized |
| [**custom-fluid-width-and-height**](https://github.com/observablehq/examples/tree/main/custom-fluid-width-and-height/) | Resize a chart when its container is resized |
| [**custom-library**](https://github.com/observablehq/examples/tree/main/custom-library/) | Override the Observable Standard Library |
| [**secret**](https://github.com/observablehq/examples/tree/main/secret) | Override the implementation of Secrets |
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
| [**secret**](https://github.com/observablehq/examples/tree/main/secret) | Override the implementation of Secrets |
| [**secret**](https://github.com/observablehq/examples/tree/main/secret) | Override the implementation of secrets |

It’s good to capitalize the Secret function, but I’d prefer to keep the term “secrets” lowercase.


See it live: https://observablehq.github.io/examples/secret

Observable lets you configure [Secrets](https://observablehq.com/@observablehq/secrets). Sensitive variables can be stored outside your code and returned by calling `Secret("MY_SECRET_KEY")`, which might return a password like `"$w0rdf1sh"`. If you publish the notebook, the Secret will throw an error instead of returning a value, so that the Secret is not publicly exposed.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Observable lets you configure [Secrets](https://observablehq.com/@observablehq/secrets). Sensitive variables can be stored outside your code and returned by calling `Secret("MY_SECRET_KEY")`, which might return a password like `"$w0rdf1sh"`. If you publish the notebook, the Secret will throw an error instead of returning a value, so that the Secret is not publicly exposed.
Observable lets you configure [secrets](https://observablehq.com/@observablehq/secrets). Sensitive variables can be stored outside your code and returned by calling `Secret("MY_SECRET_KEY")`, which might return a password like `"$w0rdf1sh"`. If you publish the notebook, calling `Secret` will throw an error instead of returning a value so that the secret is not publicly exposed.


Observable lets you configure [Secrets](https://observablehq.com/@observablehq/secrets). Sensitive variables can be stored outside your code and returned by calling `Secret("MY_SECRET_KEY")`, which might return a password like `"$w0rdf1sh"`. If you publish the notebook, the Secret will throw an error instead of returning a value, so that the Secret is not publicly exposed.

Calling `Secret` will also throw an error if you download the notebook — but sometimes, you might be downloading it to run in your own secure setting where you’d like to set the Secret a different way. This example shows how to use your own implementation of the Secret function to provide things like environment variables or API keys without rewriting your code.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Calling `Secret` will also throw an error if you download the notebook — but sometimes, you might be downloading it to run in your own secure setting where you’d like to set the Secret a different way. This example shows how to use your own implementation of the Secret function to provide things like environment variables or API keys without rewriting your code.
Calling `Secret` will also throw an error if you download the notebook — but sometimes, you might be downloading it to run in your own secure setting where you’d like to set the secret a different way. This example shows how to use your own implementation of `Secret` to provide things like environment variables or API keys without rewriting your code.


Calling `Secret` will also throw an error if you download the notebook — but sometimes, you might be downloading it to run in your own secure setting where you’d like to set the Secret a different way. This example shows how to use your own implementation of the Secret function to provide things like environment variables or API keys without rewriting your code.

In this _insecure_ example, index.html gets Secret values from a hardcoded Map. This should never be used in code that would be seen openly on the client side; if you published this index.html publicly on the Web, anyone could read your hardcoded Secrets.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
In this _insecure_ example, index.html gets Secret values from a hardcoded Map. This should never be used in code that would be seen openly on the client side; if you published this index.html publicly on the Web, anyone could read your hardcoded Secrets.
In this _insecure_ example, index.html gets secret values from a hardcoded Map. This should never be used in code that would be seen openly on the client side; if you published this index.html publicly on the Web, anyone could read your hardcoded secrets.

Comment on lines +7 to +8
"name": "tophtest",
"url": "https://observablehq.com/@tophtest"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we put this under @observablehq?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants