Special handling of static HTML of static/ directory

[dnk8n]

Use case:

I want to navigate to https://example.com/about , which is actually just an html page in the static/ directory /static/about/index.html

It would be great to be able to enable this behaviour out of the box. If someone also for some reason had the file /static/about then it could attempt to serve that instead.

Currently my workaround it to create a middleware, routes/_middleware.ts:

import { MiddlewareHandlerContext } from "$fresh/server.ts";

interface State {
  data: string;
}

export async function handler(
  req: Request,
  ctx: MiddlewareHandlerContext<State>,
) {
  const filePath = "static" + new URL(req.url).pathname + "/index.html";
  let fileSize;
  try {
    fileSize = (await Deno.stat(filePath)).size;
  } catch (e) {
    if (e instanceof Deno.errors.NotFound) {
      return await ctx.next();
    }
    return new Response(null, { status: 500 });
  }
  const body = (await Deno.open(filePath)).readable;
  const resp = new Response(body);
  resp.headers.set("content-length", fileSize.toString());
  resp.headers.set("content-type", "text/html; charset=utf-8");
  return resp;
}

[dnk8n]

I am interested to know if my workaround comes with any warnings.

E.g is it an anti pattern? Could I do the same in a much more efficient way? Is caching going to operate as intended.

[digitaldesigndj]

Yes I think this is not the pattern you want to go with. Are you using anything to generate your index.html file? Fresh expects you to write templates in JSX to leverage the power of the system.

[dnk8n]

Sorry, to clarify... I do use Fresh for all its functionalities... Except the articles of my site are pre-generared with Lume.

The code I supplied falls back on to (ctx.next()) normal Fresh functionality if no static html exists.

The order of operations I want is static > static html > dynamic html (fresh)

On Mon, 6 Feb 2023, 17:02 Taylor Young, @.***> wrote:

Yes I think this is not the pattern you want to go with. Are you using anything to generate your index.html file? Fresh expects you to write templates in JSX to leverage the power of the system.

— Reply to this email directly, view it on GitHub https://github.com/denoland/fresh/issues/1017#issuecomment-1419223607, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAZHR2PKCYMQ37UETKGC5QTWWEG7NANCNFSM6AAAAAAUSPAVQU . You are receiving this because you authored the thread.Message ID: @.***>

[dnk8n]

Maybe this diagram will explain better:

[dnk8n]

I think it would be great to allow html to be configured to be served from the static directory with prettyUrls: true, i.e instead of serving https://example.com/about/index.html as is currently supported, we could serve https://example.com/about without writing a middleware to gain this functionality.

[digitaldesigndj]

This is how I think you would want to do it in CSS: https://github.com/Hyprtxt/fresh-bootstrap5.deno.dev/blob/main/plugins/bootstrap/plugin.js

But you want to inject markup instead? I think you can build a route handler that will do your trick. Just remember to add a 404 page and try catch block.

https://github.com/Hyprtxt/fresh-blog-example/tree/main/routes https://github.com/Hyprtxt/fresh-blog-example/blob/main/routes/%5Bslug%5D.tsx

[dnk8n]

What is wrong with the middleware approach? It appears to be working correctly.

I am not asking how to solve the problem at the fresh layer, that is already solved from what I can see.

The feature request is more about whether it could be handled this way by Fresh by default. E.g if Fresh didn't automatically serve files from the static directory, we could similarly have handled it.

It is a redundant but useful feature. I am questioning whether the static directory serving feature can be improved to support pretty html URLs.

On Tue, 7 Feb 2023, 17:52 Taylor Young, @.***> wrote:

This is how I think you want to do it in CSS:

https://github.com/Hyprtxt/fresh-bootstrap5.deno.dev/blob/main/plugins/bootstrap/plugin.js

But you want to inject markup instead? I think you can build a route handler that will do your trick. Just remember to add a 404 page and try catch block.

https://github.com/Hyprtxt/fresh-blog-example/tree/main/routes

https://github.com/Hyprtxt/fresh-blog-example/blob/main/routes/%5Bslug%5D.tsx

— Reply to this email directly, view it on GitHub https://github.com/denoland/fresh/issues/1017#issuecomment-1421001619, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAZHR2NFBQAMLLBPU6ALEUTWWJVTXANCNFSM6AAAAAAUSPAVQU . You are receiving this because you authored the thread.Message ID: @.***>

[digitaldesigndj]

The wrong thing is the pretty urls right? Fresh promises Next like routing so you configure the route with the file names, you'll have to put the code into a named file to get the pretty urls to work.

./routes/special/[slug].js

The router is configured by the file name, so that's why the middleware can't quite get where you seem to want it to go. Gotta move some code into a route? Then you have context available to do the thing.

Just a suggestion 🐱

Also, ctx.returnNotFound() is the fresh way to kick out a 404, you'll want that I think?

A hybrid approach is totally a thing too?

Have a great day.

[dnk8n]

You misunderstand, I am not looking for a solution to my problem, as far as I have found, I have it working as it is. Let me finalize the implementation, and I will show it working (link to come).

Be that as it may, if it is Fresh's position that they would handle serving static files only in the way it currently is handled, then my suggestion is not accepted and this request can be closed.

Thank you for your efforts in analysing this one with me. I appreciate your work. Maybe if I find time I can submit a PR and I could think of how I could better justify its acceptance.

[digitaldesigndj]

I misunderstood, sorry about that!

On Wed, Feb 8, 2023 at 1:25 PM Dean Kayton @.***> wrote:

You misunderstand, I am not looking for a solution to my problem, as far as I have found, I have it working as it is. Let me finalize the implementation, and I will show it working (link to come).

Be that as it may, if it is Fresh's position that they would handle serving static files only in the way it currently is handled, then my suggestion is not accepted and this request can be closed.

Thank you for your efforts in analysing this one with me. I appreciate your work. Maybe if I find time I can submit a PR and I could think of how I could better justify its acceptance.

— Reply to this email directly, view it on GitHub https://github.com/denoland/fresh/issues/1017#issuecomment-1423194733, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAEDVOFQNNJW57H7UP52EYDWWP6LFANCNFSM6AAAAAAUSPAVQU . You are receiving this because you commented.Message ID: @.***>

[git001]

There is a staticDir in the https://fresh.deno.dev/docs/concepts/server-configuration and this document https://fresh.deno.dev/docs/concepts/static-files maybe it solves your issue.