feat: add CORS for /api/blog controller

OliverBooth/Areas/Blog/Pages/Article.cshtml

@@ -19,7 +19,7 @@
 <nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
     <ol class="breadcrumb">
         <li class="breadcrumb-item">
-            <a asp-page="/blog/index">Blog</a>
+            <a asp-area="blog" asp-page="/index">Blog</a>
         </li>
         <li class="breadcrumb-item active" aria-current="page">@post.Title</li>
     </ol>

OliverBooth/Areas/Blog/Pages/_ViewImports.cshtml

@@ -0,0 +1,2 @@
+@namespace OliverBooth.Areas.Blog.Pages
+@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

OliverBooth/Controllers/BlogApiController.cs

@@ -1,4 +1,5 @@
 using Humanizer;
+using Microsoft.AspNetCore.Cors;
 using Microsoft.AspNetCore.Mvc;
 using OliverBooth.Data.Blog;
 using OliverBooth.Services;
@@ -11,6 +12,7 @@ namespace OliverBooth.Controllers;
 [ApiController]
 [Route("api/blog")]
 [Produces("application/json")]
+[EnableCors("BlogApi")]
 public sealed class BlogApiController : ControllerBase
 {
     private readonly BlogService _blogService;

OliverBooth/Program.cs

@@ -34,6 +34,11 @@ builder.Services.AddDbContextFactory<WebContext>();
 builder.Services.AddSingleton<BlogService>();
 builder.Services.AddRazorPages().AddRazorRuntimeCompilation();
 builder.Services.AddControllersWithViews();
+builder.Services.AddCors(options => options.AddPolicy("BlogApi", policy => (builder.Environment.IsDevelopment()
+        ? policy.AllowAnyOrigin()
+        : policy.WithOrigins("https://oliverbooth.dev"))
+    .AllowAnyMethod()
+    .AllowAnyHeader()));
 builder.Services.AddRouting(options => options.LowercaseUrls = true);
 
 builder.WebHost.UseKestrel(kestrel =>
@@ -79,6 +84,7 @@ app.UseHttpsRedirection();
 app.UseStaticFiles();
 app.UseRouting();
 app.UseAuthorization();
+app.UseCors("BlogApi");
 
 app.MapControllers();
 app.MapRazorPages();

src/ts/app.ts

@@ -1,6 +1,7 @@
 import API from "./API";
 import UI from "./UI";
 import Input from "./Input";
+import Author from "./Author";
 
 const pkg = require("../../package.json");
 
@@ -35,18 +36,24 @@ declare const Prism: any;
 
     const blogPostContainer = UI.blogPostContainer;
     if (blogPostContainer) {
+        const authors = [];
         const template = Handlebars.compile(UI.blogPostTemplate.innerHTML);
         API.getBlogPostCount().then(async (count) => {
-            for (let i = 0; i < count; i++) {
+            for (let i = 0; i < count; i += 5) {
                 const posts = await API.getBlogPosts(i, 5);
                 for (const post of posts) {
-                    const author = await API.getAuthor(post.authorId);
+                    let author: Author;
+                    if (authors[post.authorId]) {
+                        author = authors[post.authorId];
+                    } else {
+                        author = await API.getAuthor(post.authorId);
+                        authors[post.authorId] = author;
+                    }
+
                     const card = UI.createBlogPostCard(template, post, author);
                     blogPostContainer.appendChild(card);
                     UI.updateUI(card);
                 }
-
-                i += 4;
             }
 
             document.body.appendChild(UI.createDisqusCounterScript());