Open2023/11/18にコメント追加2

rss取ってrenderして、iphoneでもi18n対応に抗う

AWS のWhats Newをiphoneで読むと英語のを読みたいに日本語サイトに飛ばされてしまう。
一番下で言語を選べるのだが、スワイプが面倒なのでなんとかする

案１

index.tsx

import { Hono } from "hono";
import { logger } from "hono/logger";
import { secureHeaders } from "hono/secure-headers";
import { parseFeed } from "htmlparser2";

const app = new Hono();

app.use("*", logger(), secureHeaders());

interface Item {
  title: string;
  description: string;
  datetime: string;
  href: string;
}

app.get("/feed", async (c) => {
  const feedUrl = "https://aws.amazon.com/about-aws/whats-new/recent/feed/";
  const response = await fetch(feedUrl);
  if (!response.ok) {
    return new Response(JSON.stringify([]));
  }
  const htmlString = await response.text();
  const feed = parseFeed(htmlString);
  if (!feed) {
    return new Response(JSON.stringify([]));
  }
  const items = feed.items.map((data: any) => {
    return {
      title: data.title,
      description: data.content,
      datetime: data.isoDate,
      href: data.link,
    };
  });
  return c.render(
    <html>
      <head>
        <title>Feed</title>
      </head>
      <body>
        <h1>Feed</h1>
        <ul>
          {items.map((item) => (
            <>
              <small>{item.datetime}</small>
              <li key={item.href}>
                <a href={item.href}>{item.title}</a>
              </li>
              <small>{item.datetime}</small>
            </>
          ))}
        </ul>{" "}
      </body>
    </html>,
  );
});

export default app;