API Request

It would be nice to have the ability to “export” and “import” the raw cells as a plain text blob.

Why? I am working on a VS Code ObservableJS extension, which is currently working well enough that going back to the WebUI to “publish” work I have done locally is now a pain point (add cell paste, add cell paste etc.).

It would be great if I could automate the “export” of an existing notebook, edit local and then re-“publish” back to ObservableHQ.

1 Like

Can you use [https://api.observablehq.com/] @user/slug [.js?v=3]?

Yes and No - that downloads the “compiled” JS, so it can be used as a “runtime” library, but I want the plain text (as the user typed it), so you can edit it in a “normal” IDE environment as a text file.

I’m not sure if any of the code still works, but it was at one point possible to use the API in an unofficial way to export the source of a notebook as a JSON file and also to create a new notebook as a JSON file. See the scripts mentioned in this forum post. You could presumably also adapt those scripts to use the API to merge a newly uploaded notebook into the old one, too.

By the way, I’m very excited to see your VS Code extension when it’s ready!

Another alternative is to try connecting to the websocket server at wss://ws.observablehq.com/document/[notebook-hash]/edit

A long time ago I played around with a notebook that sent and received messages with the websocket server here:

The websocket endpoint was locked down so the notebook no longer runs at all, but maybe some of the code will be useful to you if you decide to go this route.

1 Like

Screenshot of runtime evaluation of values (using the blue markers as placeholders for the variables):

1 Like

Screenshot of rendered page:


Beautiful! Your last screenshot — the left-hand pane is the editable source for the rendered right-hand pane?

I’ve been noodling with a similar approach for local dev, rendering to my browser. I’d love to chat about the choices for the language on the left. Markdown, w/ Observable blocks rendered in ``` code blocks?

Yes - its a slightly different concept (and slightly older) as its a pure Markdown document with embedded “observable” JS. (You can see it in a web page here: https://raw.githack.com/hpcc-systems/Visualization/master/demos/storyboard/index.html)

For the VS Code extension I am going back to a pure Observable text and am currently evaluating the runtime values in NodeJS (which isn’t IMO going to work well enough in the long run). But the syntax checking etc. is nice and its far more productive than an online UI…

You can fetch the raw contents via api.observablehq.com:

You will need a CORS proxy to access api.obserablehq.com. Luckily you can find (and fork) one here, but note that you’ll be actively circumventing a (weak) access restriction this way by providing a fake Origin header to the server.

To use the proxy just replace the API domain with the proxy domain, or see here and here for practical uses.

Edit: Replaced screenshot and updated info, see next comment.

1 Like

That looks like the same format as v1 of the API and doesn’t need a proxy? I am not sure it would be worth vesting time on an API which may go away, especially if this is not a direction that Mike and co. want to go?

1 Like

You’re absolutely right, I had a brainfart there. I’ve replaced the screenshot to show the correct request. The rest still applies as mentioned.

Fascinating, thanks for sharing that link!

For the extension, then — your ojs looks very reasonable. Are your cell boundaries just double newlines?

The cell boundaries are simply the statements - the user does not need to do anything…

@GordonSmith :+1: I’d love to take a look if you have anything in a public repo!

The Observable-MD (Markdown) demo above has a link to GitHub on it!

The VSCode Observable-MD support is currently part of: https://marketplace.visualstudio.com/items?itemName=hpcc-systems.ecl

But with the Observable-JS support I plan on giving it its own Market Place entry - especially if we get some API support to import / publish to/from ObservabelHQ. (its a weekends only thing currently).

Ah — that’s a big help, thank you!

I’d love something bidirectional, or at least more something seamless between editing in notebook and editing in local environment.

Jermey asked about an API too, but I think what I’m looking for is simply git integration. Some human-friendly document like OJS and the ability to push or sync notebooks with github or other git repo.