mirror of
https://github.com/shishantbiswas/bknd.git
synced 2026-03-16 04:27:21 +00:00
adapter(cloudflare): add supports for the new assets feature
This commit is contained in:
@@ -11,6 +11,7 @@ export type CloudflareBkndConfig<Env = any> = FrameworkBkndConfig<Context<Env>>
|
|||||||
kv?: KVNamespace;
|
kv?: KVNamespace;
|
||||||
dobj?: DurableObjectNamespace;
|
dobj?: DurableObjectNamespace;
|
||||||
};
|
};
|
||||||
|
static?: "kv" | "assets";
|
||||||
key?: string;
|
key?: string;
|
||||||
keepAliveSeconds?: number;
|
keepAliveSeconds?: number;
|
||||||
forceHttps?: boolean;
|
forceHttps?: boolean;
|
||||||
@@ -29,18 +30,23 @@ export function serve<Env = any>(config: CloudflareBkndConfig<Env>) {
|
|||||||
return {
|
return {
|
||||||
async fetch(request: Request, env: Env, ctx: ExecutionContext) {
|
async fetch(request: Request, env: Env, ctx: ExecutionContext) {
|
||||||
const url = new URL(request.url);
|
const url = new URL(request.url);
|
||||||
const manifest = config.manifest;
|
|
||||||
|
|
||||||
if (manifest) {
|
if (config.manifest && config.static === "assets") {
|
||||||
|
console.warn("manifest is not useful with static 'assets'");
|
||||||
|
} else if (!config.manifest && config.static === "kv") {
|
||||||
|
throw new Error("manifest is required with static 'kv'");
|
||||||
|
}
|
||||||
|
|
||||||
|
if (config.manifest && config.static !== "assets") {
|
||||||
const pathname = url.pathname.slice(1);
|
const pathname = url.pathname.slice(1);
|
||||||
const assetManifest = JSON.parse(manifest);
|
const assetManifest = JSON.parse(config.manifest);
|
||||||
if (pathname && pathname in assetManifest) {
|
if (pathname && pathname in assetManifest) {
|
||||||
const hono = new Hono();
|
const hono = new Hono();
|
||||||
|
|
||||||
hono.all("*", async (c, next) => {
|
hono.all("*", async (c, next) => {
|
||||||
const res = await serveStatic({
|
const res = await serveStatic({
|
||||||
path: `./${pathname}`,
|
path: `./${pathname}`,
|
||||||
manifest
|
manifest: config.manifest!
|
||||||
})(c as any, next);
|
})(c as any, next);
|
||||||
if (res instanceof Response) {
|
if (res instanceof Response) {
|
||||||
const ttl = 60 * 60 * 24 * 365;
|
const ttl = 60 * 60 * 24 * 365;
|
||||||
|
|||||||
@@ -21,7 +21,6 @@ import {
|
|||||||
type ValueErrorIterator
|
type ValueErrorIterator
|
||||||
} from "@sinclair/typebox/errors";
|
} from "@sinclair/typebox/errors";
|
||||||
import { Check, Default, Value, type ValueError } from "@sinclair/typebox/value";
|
import { Check, Default, Value, type ValueError } from "@sinclair/typebox/value";
|
||||||
import { cloneDeep } from "lodash-es";
|
|
||||||
|
|
||||||
export type RecursivePartial<T> = {
|
export type RecursivePartial<T> = {
|
||||||
[P in keyof T]?: T[P] extends (infer U)[]
|
[P in keyof T]?: T[P] extends (infer U)[]
|
||||||
@@ -73,7 +72,7 @@ export class TypeInvalidError extends Error {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function stripMark<O = any>(obj: O) {
|
export function stripMark<O = any>(obj: O) {
|
||||||
const newObj = cloneDeep(obj);
|
const newObj = structuredClone(obj);
|
||||||
mark(newObj, false);
|
mark(newObj, false);
|
||||||
return newObj as O;
|
return newObj as O;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ and then install bknd as a dependency:
|
|||||||
If you don't choose anything specific, the following code will use the `warm` mode. See the
|
If you don't choose anything specific, the following code will use the `warm` mode. See the
|
||||||
chapter [Using a different mode](#using-a-different-mode) for available modes.
|
chapter [Using a different mode](#using-a-different-mode) for available modes.
|
||||||
|
|
||||||
```ts
|
```ts src/index.ts
|
||||||
import { serve } from "bknd/adapter/cloudflare";
|
import { serve } from "bknd/adapter/cloudflare";
|
||||||
|
|
||||||
export default serve<Env>({
|
export default serve<Env>({
|
||||||
@@ -42,32 +42,37 @@ And confirm it works by opening [http://localhost:8787](http://localhost:8787) i
|
|||||||
your browser.
|
your browser.
|
||||||
|
|
||||||
## Serve the Admin UI
|
## Serve the Admin UI
|
||||||
Now in order to also server the static admin files, you have to modify the `wrangler.toml` to
|
Now in order to also server the static admin files, you have to modify the `wrangler.toml` to include the static assets. You can do so by either serving the static using the new [Assets feature](https://developers.cloudflare.com/workers/static-assets/), or the deprecated [Workers Site](https://developers.cloudflare.com/workers/configuration/sites/configuration/).
|
||||||
include the static assets:
|
|
||||||
```toml
|
|
||||||
[site]
|
|
||||||
bucket = "node_modules/bknd/dist/static"
|
|
||||||
```
|
|
||||||
|
|
||||||
And then modify the worker entry as follows:
|
<Tabs>
|
||||||
```ts {2, 14, 15}
|
<Tab title="Assets">
|
||||||
import { serve } from "bknd/adapter/cloudflare";
|
Make sure your assets point to the static assets included in the bknd package:
|
||||||
import manifest from "__STATIC_CONTENT_MANIFEST";
|
|
||||||
|
|
||||||
export default serve<Env>({
|
```toml wrangler.toml
|
||||||
app: ({ env }) => ({
|
assets = { directory = "node_modules/bknd/dist/static" }
|
||||||
connection: {
|
```
|
||||||
type: "libsql",
|
|
||||||
config: {
|
</Tab>
|
||||||
url: env.DB_URL,
|
<Tab title="Workers Sites">
|
||||||
authToken: env.DB_TOKEN
|
Make sure your site points to the static assets included in the bknd package:
|
||||||
}
|
|
||||||
}
|
```toml wrangler.toml
|
||||||
}),
|
[site]
|
||||||
manifest,
|
bucket = "node_modules/bknd/dist/static"
|
||||||
setAdminHtml: true
|
```
|
||||||
});
|
|
||||||
```
|
And then modify the worker entry as follows:
|
||||||
|
```ts {2, 6} src/index.ts
|
||||||
|
import { serve } from "bknd/adapter/cloudflare";
|
||||||
|
import manifest from "__STATIC_CONTENT_MANIFEST";
|
||||||
|
|
||||||
|
export default serve<Env>({
|
||||||
|
app: () => ({/* ... */}),
|
||||||
|
manifest
|
||||||
|
});
|
||||||
|
```
|
||||||
|
</Tab>
|
||||||
|
</Tabs>
|
||||||
|
|
||||||
## Adding custom routes
|
## Adding custom routes
|
||||||
You can also add custom routes by defining them after the app has been built, like so:
|
You can also add custom routes by defining them after the app has been built, like so:
|
||||||
|
|||||||
@@ -1,7 +1,5 @@
|
|||||||
import { serve } from "bknd/adapter/cloudflare";
|
import { serve } from "bknd/adapter/cloudflare";
|
||||||
|
|
||||||
import manifest from "__STATIC_CONTENT_MANIFEST";
|
|
||||||
|
|
||||||
export default serve({
|
export default serve({
|
||||||
app: (args) => ({
|
app: (args) => ({
|
||||||
connection: {
|
connection: {
|
||||||
@@ -13,6 +11,5 @@ export default serve({
|
|||||||
}),
|
}),
|
||||||
onBuilt: async (app) => {
|
onBuilt: async (app) => {
|
||||||
app.modules.server.get("/custom", (c) => c.json({ hello: "world" }));
|
app.modules.server.get("/custom", (c) => c.json({ hello: "world" }));
|
||||||
},
|
}
|
||||||
manifest
|
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -5,9 +5,10 @@ compatibility_date = "2024-11-06"
|
|||||||
compatibility_flags = ["nodejs_compat"]
|
compatibility_flags = ["nodejs_compat"]
|
||||||
workers_dev = true
|
workers_dev = true
|
||||||
minify = true
|
minify = true
|
||||||
|
assets = { directory = "../../app/dist/static" }
|
||||||
|
|
||||||
[observability]
|
[observability]
|
||||||
enabled = true
|
enabled = true
|
||||||
|
|
||||||
[site]
|
#[site]
|
||||||
bucket = "../../app/dist/static"
|
#bucket = "../../app/dist/static"
|
||||||
Reference in New Issue
Block a user