C#•15mo ago

❔ Can I serve a static file using a wildcard route?

What I want to do is map a URL to a static file. I have a character.html file that has the JS to fetch the character info from the DB but I want to have the user navigate to /character/{character_id} but still server the static file. Can I do that somehow with app.UseFileServer() or do I need to have a lone route that returns an HTML file? If so, what does that look like?

19 Replies

Angius•15mo ago

The route is dynamic, though? What good would getting character_id do if you just serve a static file?

13eckOP•15mo ago

The route is dynamic only insofar that there's an Id on the end. The character sheet is the same regardless of what character it is, just the details are different. So I want to use one file as the template for the character sheet and then use JS to fetch the character's info from the database and update the page with the appropriate data. It's like if I did https://example.com/character?id=38 but with https://example.com/character/38 instead.

Angius•15mo ago

Ah, so you're trying to reinvent your own version of server-side rendering

13eckOP•15mo ago

No, b/c it's client-side 😉 I don't feel like SSR is needed for something as light-weight as "character name, list character skills, etc"

Angius•15mo ago

But... you want to serve the static file filled with data from the database? Or do you want to sere a HTML file with placeholders, serve JSON with data separately, and use Javascript to take that template and fill it with data?

13eckOP•15mo ago

No, I want to serve the static file. Then when the client downloads the file they also download the JS files that do the database querying to populate the info client-side Yeah, this My thought process was the user would go to https://example.com/character/38, it'd give 'em the character.html page with just the static content, use JS fetch() to hit the DB endpoints to get JSON data, then use that data to populate the HTML page with the actual info

Angius•15mo ago

I mean, sure, but the server doesn't need to know 38, since it will always return the same exact static file And JS would get data from a different endpoint

13eckOP•15mo ago

The client needs to know, so JS can fetch character with id 38

Angius•15mo ago

Right, so it's supposed to be there just so you can parse the URL with JS and get the data, and the backend can just ignore it Gotcha

13eckOP•15mo ago

Exactly, yes

Angius•15mo ago

Assuming Minimal APIs, I'd probably just return the file myself, instead of relying on the static files middleware:

app.MapGet(
    "/character/{id}", 
    () => Results.File("template.html", contentType: "text/html");
);

app.MapGet(
    "/character/{id}", 
    () => Results.File("template.html", contentType: "text/html");
);

Something like this

13eckOP•15mo ago

I thought that Results.File() was for downloading, didn't think to try it to render a file >_<

Angius•15mo ago

There's nothing specific that makes the browser download a file The browser just treats different MIME types differently "ah, text/html, I can display it"

13eckOP•15mo ago

Awesome, you've been a big help. Thank you so much!

Angius•15mo ago

"oh no, what is that, application/zip? Dunno what to do with it, let's download it and let the user handle it" Etc

13eckOP•15mo ago

Just for completeness sake, what would a controller-based code snippet look like? If it's not too much trouble

Angius•15mo ago

Probably something like

[HttpGet("stuff/{id}")]
public async Task<ActionResult> Get()
{
    var filedata = await ReadAllBytesAsync("template.html");
    var contentType = MimeMapping.GetMimeMapping("template.html");

   var cd = new ContentDisposition
    {
        FileName = filename,
        Inline = true,
    };

    Response.AppendHeader("Content-Disposition", cd.ToString());

    return File(filedata, contentType);
}

[HttpGet("stuff/{id}")]
public async Task<ActionResult> Get()
{
    var filedata = await ReadAllBytesAsync("template.html");
    var contentType = MimeMapping.GetMimeMapping("template.html");

   var cd = new ContentDisposition
    {
        FileName = filename,
        Inline = true,
    };

    Response.AppendHeader("Content-Disposition", cd.ToString());

    return File(filedata, contentType);
}

Slightly modified code from here: https://stackoverflow.com/a/58188829/6042255

13eckOP•15mo ago

Much appreciated!

Accord•15mo ago

Was this issue resolved? If so, run /close - otherwise I will mark this as stale and this post will be archived until there is new activity.

Gaming

Programming

❔ Can I serve a static file using a wildcard route?