{
// ------------------------------------------
// Create the "server-side" request handler.
// It consumes standard Request instances and produce Responses.
const httpHandler = async (request) => {
const { method, url, headers } = request;
const headersMap = {};
for (const [key, value] of headers) {
headersMap[key] = value;
// console.log(key, value);
}
// console.log("*", method, url, headers);
return new Response(
JSON.stringify({
method,
url,
headers: headersMap,
message: "Hello World!"
}),
{
headers: {
"Content-Type": "application/json"
}
}
);
};
// ------------------------------------------
// Creates requests
function newRequest() {
return new Request("http://foo.bar.baz/?toto=Tata", {
headers: {
foo: "bar"
}
});
}
// ------------------------------------------
// Low-level plumbering.
// ------------------------------------------
// Communication channel.
// Port1: used as a transport by the server
// Port2: used by the client to send serialized requests and recieve binary responses
const channel = new MessageChannel();
channel.port1.start();
channel.port2.start();
// ------------------------------------------
// Create a "server" function.
// This function is an AsyncGenerator consuming binary blocks with the request
// from the given iterator and producing binary blocks from the response.
const server = WebRunHttp.newHttpServer(httpHandler);
// We plug the server method to the MessagePort.
const close = WebRunPorts.listenBidi(channel.port1, server);
invalidation.then(close);
// ------------------------------------------
// The client-side initialization:
const client = WebRunHttp.newHttpClient((input) =>
WebRunPorts.callBidi(channel.port2, input, {})
);
// ------------------------------------------
// Now we can call our client.
const request = newRequest();
const response = await client(request);
const json = await response.json();
return json;
}
example2Response = {
const channel = new MessageChannel();
channel.port1.start();
channel.port2.start();
// ------------------------------------------
// Create a "server" function.
// (The formHandler cell is implemented below)
const server = WebRunHttp.newHttpServer(formHandler);
const close = WebRunPorts.listenBidi(channel.port1, server);
invalidation.then(close);
// ------------------------------------------
// The client-side initialization:
const client = WebRunHttp.newHttpClient((input) =>
WebRunPorts.callBidi(channel.port2, input, {})
);
// ------------------------------------------
// Now we can call our client.
const response = await client(example2Request);
const json = await response.json();
return json;
}
WebRunHttp = import("https://unpkg.com/@statewalker/webrun-http@0.1")
WebRunPorts = import("https://unpkg.com/@statewalker/webrun-ports@0.4")
// import { Scrubber } from "@mbostock/scrubber"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
