C
C#16mo ago
13eck

❔ 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
Angius16mo ago
The route is dynamic, though? What good would getting character_id do if you just serve a static file?
13eck
13eckOP16mo 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
Angius16mo ago
Ah, so you're trying to reinvent your own version of server-side rendering
13eck
13eckOP16mo 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
Angius16mo 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?
13eck
13eckOP16mo 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
Angius16mo 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
13eck
13eckOP16mo ago
The client needs to know, so JS can fetch character with id 38
Angius
Angius16mo 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
13eck
13eckOP16mo ago
Exactly, yes
Angius
Angius16mo 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
13eck
13eckOP16mo ago
I thought that Results.File() was for downloading, didn't think to try it to render a file >_<
Angius
Angius16mo 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"
13eck
13eckOP16mo ago
Awesome, you've been a big help. Thank you so much!
Angius
Angius16mo 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
13eck
13eckOP16mo ago
Just for completeness sake, what would a controller-based code snippet look like? If it's not too much trouble
Angius
Angius16mo 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
13eck
13eckOP16mo ago
Much appreciated!
Accord
Accord16mo 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.
Want results from more Discord servers?
Add your server