Idea: Allow access to location hash params #key=value

It would be really cool if we could load notebooks with hash params #key=value&secret=123 and have them loaded into the notebook in some way. This would allow doing things like passing in access_tokens for apis without compromising the sharability of the notebook (and in fact improving it).

2 Likes

You already can do something like that

Take a look at this notebook

You can already store secrets in Observable that only you can access:

It’s not exactly the same. The key difference is that a hash won’t get send to the server and can thus not be logged server-side. Obtaining the hash is currently not possible:

1 Like

Yes, I was referring to query string option (though I did not remember, that hash option was not working )

Access to hash params would also allow for much longer parameters to be passed to a notebook. I’ve been messing around with a code editor in an Observable notebook and it would be nice to be able to share permalinks to code examples using hash params. Query strings have a max length which is inconvenient for this use case.

Yeah its great that you can use query strings (I though that was restricted too actually), but hash params would open up some new possibilities for the reasons mentioned (they don’t get sent automatically by the browser and increased size limits).

Where/when did you encounter this limit? Afaik it should be high enough that you’ll rarely hit it.

For massive amounts of data there’s also the option to gzip the data and encode it with a base higher than 64. Perhaps there’s also a way to get deflate to output a limited character range, but I haven’t found anything conclusive yet.

You’re probably right; with some more testing, the limit for observablehq.com seems to be ~5k characters and passing around URLs of that length is problematic no matter how the data is encoded. Here’s something close to what I’ve been working with:

I think I was remembering what happened with some other server which had a much lower limit. Nonetheless, I support the request for access to hash params.

I have a UrlParam class in one of my notebooks that encodes and decodes arbitrary data:

The notebook also contains a more complex example of retrieving and applying data for multiple cells. Applying URL data happens in the second cell (which has no output unless there’s data).

Applied to your notebook it would work like this (note that you don’t need to share the UrlParam instance, you can create as many as you like whenever you like):
https://observablehq.com/compare/84d33e17af6d5036@57...646ddd087841b1f3@78

1 Like

Btw, I found that Observable’s server stops responding to URLs somewhere between 7000 and 8000 characters.

1 Like

Wow thanks, this is really great! I’ve merged your suggestion.

1 Like

Great discussion as always, folks.

We’ve just pushed a change that copies querystrings and hash parameters down from the notebook’s parent frame to the worker, so you can now use location.search (for querystrings) and location.hash (for client-side hash parts) much more naturally.

Here’s a little demo:

6 Likes

Woo you guys are awesome!!

@jflatow If you click the :ballot_box_with_check: button under Jeremy’s answer, it’ll mark this topic as resolved and make it so that future visitors will see the solution right away.