Skip to content

Instantly share code, notes, and snippets.

@daliborgogic
Last active August 22, 2022 19:45
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save daliborgogic/f9ac51d50392d9e9c2ccaff24fb9f44a to your computer and use it in GitHub Desktop.
Save daliborgogic/f9ac51d50392d9e9c2ccaff24fb9f44a to your computer and use it in GitHub Desktop.
Prepend/appen to stream
import { createApp } from './dist/app.mjs'
import { pipeToWebWritable } from 'vue/server-renderer'
const prepend = String.raw`<!doctype html>
<html lang="en">
<title>Title</title>
<div id="app">`
const append = String.raw`</div>
<script type="importmap">
{
"imports": {
"vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js"
}
}
</script>
<script type="module" src="/client.js"></script>`
async function handleRequest(request) {
const app = createApp()
const encoder = new TextEncoder()
const { readable, writable } = new TransformStream({
flush(controller) {
controller.enqueue(encoder.encode(append))
}
})
const writer = writable.getWriter()
writer.write(encoder.encode(prepend))
writer.releaseLock()
pipeToWebWritable(app, {}, writable)
return new Response(readable, {
status: 200,
'content-type': 'text/html;charset=UTF-8'
})
}
export default {
async fetch(request) {
try {
return handleRequest(request)
} catch (err) {
return new Response(err.message)
}
}
}
@daliborgogic
Copy link
Author

daliborgogic commented Aug 19, 2022

Solution

// worker.mjs
...
const encoder = new TextEncoder()
const { readable, writable } = new TransformStream({
  start(controller) {
    controller.enqueue(encoder.encode(prepend))
  },
  flush(controller) {
    controller.enqueue(encoder.encode(append))
  }
})

pipeToWebWritable(app, {}, writable)
...
# wrangler.toml
name = "stream"
compatibility_date = "2022-08-19"
main = "worker.mjs"
compatibility_flags = [ "streams_enable_constructors", "transformstream_enable_standard_constructor" ]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment