ろぼいんブログ

Astro v4.6リリース!i18n強化やCSRF保護などが追加

サムネイル

2023年4月11日に、静的サイトジェネレーターであるAstroの最新バージョンAstro 4.6がリリースされました。

このバージョンでは、国際化のための手動ルーティング戦略開発者ツールバーの移動機能CSRF保護の実験的サポートなど、多数の新機能と改善が追加されています。この記事では、Astro 4.6の主要な変更点について解説します。

広告
目次

Astro v4.6の注目機能

Astro v4.6では次の機能が新たに追加されました。

  • 手動i18nルーティング戦略
  • 開発者ツールバーの位置変更機能
  • 実験的なCSRF保護のサポート
  • Cookieの改善
  • 旧バージョンのNode.jsのサポート終了

それでは、これらの機能について一つずつ詳しく見ていきましょう。

手動i18nルーティング戦略

Astro v4.6では、国際化(i18n)のための手動ルーティング戦略が導入されました。この機能を利用することで、国際化されたAstroサイトのルーティングをより詳細に制御できるようになります。これは、デフォルトのルーティング戦略では不十分な場合に便利です。

手動ルーティングを有効にするには、astro.config.mjsi18n.routingオプションをmanualに設定します。

astro.config.mjs
import { defineConfig } from "astro/config";
export default defineConfig({
i18n: {
locales: ["en", "fr"],
defaultLocale: "fr",
routing: "manual",
}
});

次に、ルーティングを処理するためのmiddlewareをプロジェクトに追加します。

開発者ツールバーの位置変更機能

Astro v4.6では、開発者ツールバーの位置を画面の下部の異なる位置に移動させる機能が追加されました。これは、画面下部にヘッダーがある場合や、ツールバーを別の位置に移動させたい場合に役立ちます。

広告

実験的なCSRF保護のサポート

Astro v4.6では、CSRF保護に対する実験的な部分サポートが追加されました。この機能は現在実験的なフラグの下にあり、将来的に変更される可能性があります。

CSRF保護を有効にするには、astro.config.mjsexperimental.security.csrfProtectionオプションを設定します。ただし、この機能はSSRモードでのみサポートされています。

astro.config.mjs
import { defineConfig } from "astro/config";
export default defineConfig({
experimental: {
security: {
csrfProtection: {
origin: true
}
}
}
});

Cookieの改善

AstroのCookie削除用ヘルパー(Astro.cookies.delete)では、pathdomain属性だけでなく、より多くの属性を設定できるようになりました。これにより、Cookieの削除がより柔軟になり、より正確な制御が可能になります。

旧バージョンのNode.jsのサポート終了

新しいバージョンのAstroでは、Node.jsのサポートポリシーに従い、古いバージョンのNode.jsのサポートが終了しました。サポートが終了したバージョンを使用している場合でも、Astro v5がリリースされるまでは引き続き使用できますが、いくつかの機能が期待どおりに動作しない可能性があります

Astroのアップグレード方法

既存のプロジェクトをAstro v4.6にアップグレードするには、@astrojs/upgradeを使用できます。または、パッケージマネージャーのアップグレードコマンドを実行して手動でアップグレードすることもできます。

広告
Terminal window
npx @astrojs/upgrade
Terminal window
npm install astro@latest
pnpm upgrade astro --latest
yarn upgrade astro --latest

まとめ

Astro v4.6では、開発者がより細かい制御を行えるように多くの機能が追加・改善されています。とくに、国際化のための手動ルーティング戦略やCSRF保護のサポートなどの有用な機能が追加されています。

Astroの最新バージョンを使用することで、より柔軟で安全なWebサイトを構築できるようになります。Astroの公式ドキュメントを参照して、新しい機能を活用してみてください。

参考

記事をシェア

Xに共有するBlueskyに共有するMisskeyに共有するLINEに共有するThreadsに共有する

フォローして最新情報を入手

Googleの優先ソースに追加すると、このサイトの記事をGoogleで見つけやすくなります。また、ぜひXやRSSフィードもフォローしてください。

Googleの優先ソースとして追加するGoogleの優先ソースとして追加するXのロゴ
広告
著者のアイコン画像

生まれた時から、母国語よりも先にJavaScriptを使っていました。ネットの海のどこにもいなくてどこにでもいます。

Webフロントエンドプログラマーとして、TypeScriptを用いたWebアプリやブラウザー拡張機能を制作。Xのシャドウバン検知ツール「Shadowban Scanner」やリンクカード復活ツール「Restore Link Card」を公開し、国内外のメディアで紹介されました。iGEM 2023ではJapan-UnitedチームのWikiを制作してGrand Prizeの獲得に貢献。ブログではXやSNSの最新ニュース、不具合の検証と対処法、フロントエンド開発の知見を発信しています。