Astro 4.6 发布,支持手动设置国际化路由策略

经过发行周的短暂休息,Astro 4.6 现已推出,我们又回到了正常的时间表!此版本包括一个新的手动路由策略用于国际化,对 CSRF 保护进行了实验性支持,开发工具栏新增功能等。

完整的发布亮点包括:

  • 手动 i18n 路由策略
  • 移动开发工具栏
  • 实验性:支持 CSRF 保护
  • Cookie 改进
  • 不再支持旧版本 Node.js

要升级现有项目,请使用自动化 @astrojs/upgrade CLI 工具。或者通过运行包管理器的升级命令来手动升级:

shell 复制代码
# 推荐
npx @astrojs/upgrade

# 手动
npm install astro@latest
pnpm upgrade astro --latest
yarn upgrade astro --latest

手动 i18n 路由策略

Astro 4.6 引入了国际化的手动路由策略。在默认路由策略不能完全满足你的需求的情况下,这个新策略允许你完全控制国际化 Astro 网站的路由。

要启用手动路由,请将 astro.config.mjs 中的 i18n.routing 选项设置为 manual

js 复制代码
// astro.config.mjs
import { defineConfig } from "astro/config";

export default defineConfig({
  i18n: {
    locales: ["en", "fr"],
    defaultLocale: "fr",
    routing: "manual",
  },
});

然后向你的项目添加一个中间件来处理路由:

js 复制代码
// src/middleware.ts
import { defineMiddleware } from "astro:middleware";
import { redirectToDefaultLocale } from "astro:i18n";

// 示例中间件,将所有请求重定向到默认语言环境,除了 /about 页面。
export const onRequest = defineMiddleware(async (context, next) => {
  if (context.url.startsWith("/about")) {
    return next();
  } else {
    return redirectToDefaultLocale(context, 302);
  }
});

或者,你可以使用 astro:i18n 中的新 middleware 函数导入 Astro 自己的中间件逻辑,以构建默认路由策略:

js 复制代码
import { defineMiddleware, sequence } from "astro:middleware";
import { middleware } from "astro:i18n"; // Astro 自己的 i18n 路由中间件

export const userMiddleware = defineMiddleware(() => {
  // 在这里写入您的自定义中间件逻辑
});

export const onRequest = sequence(
  userMiddleware,
  middleware({
    redirectToDefaultLocale: false,
    prefixDefaultLocale: true
  })
)

查看国际化文档,了解有关如何使用手动路由进行国际化的更多信息。

移动开发工具栏

Astro 4.6 引入了将开发工具栏移动到屏幕底部不同位置的功能。如果你有一个覆盖屏幕底部的粘性标题,或者你只是希望工具栏位于其他位置,这可能会很有用。开发工具栏可以帮助你,而不是妨碍你!

实验性:支持 CSRF 保护

Astro 4.6 添加了对 CSRF 保护的实验性部分支持。此功能目前处于实验阶段,可能会在未来的版本中发生变化。

要启用它,请在 astro.config.mjs 中设置 experimental.security.csrfProtection 选项:

js 复制代码
// astro.config.mjs
import { defineConfig } from "astro/config";

export default defineConfig({
  experimental: {
    security: {
      csrfProtection: {
        origin: true,
      },
    },
  },
});

启用此设置会使 Astro 执行检查,确保所有现代浏览器自动传递的「origin」标头与每个 Request 发送的 URL 相匹配。如果没有,Astro 将使用 403 Forbidden 状态代码进行响应。

请注意,此功能仅适用于按需呈现的页面(也称为服务器端呈现)。

Astro 删除 cookie 的助手 Astro.cookies.delete 现在允许设置更多 cookie 属性,而不仅仅是 pathdomain 属性。也许这只是一点点的进步,但绝对是一个你值得体验的改变。

不再支持旧版本 Node.js

根据我们的 Node.js 支持和升级政策,此版本的 Astro 不再支持:

  • Node.js 18 版本低于 18.17.1
  • Node.js 19(奇数版本)
  • Node.js 20 版本低于 20.3.0

正如我们的支持政策中所述,这一决定是在仔细考虑了几个因素后做出的。我们相信这一变化将为所有用户带来更稳定、更安全的 Astro 体验。

你可以继续使用已弃用的 Node.js 版本,直到 Astro 的下一个主要版本 (v5)。但是,安装 Astro 时你可能会看到警告,并且某些功能可能无法按预期工作。

Bug 修复

Astro 4.6 包括更多错误修复和较小的改进,这些改进无法包含在本发布帖子中,查看完整的发行说明以了解更多信息。

相关推荐
该用户已不存在3 分钟前
macOS是开发的终极进化版吗?
前端·后端
小豆包api19 分钟前
小豆包AI API × Nano Banana:3D手办 + AI视频生成,「动起来」的神级玩法!
前端·api
陈陈爱java36 分钟前
Spring八股文
开发语言·javascript·数据库
布列瑟农的星空42 分钟前
大话设计模式——观察者模式和发布/订阅模式的区别
前端·后端·架构
龙在天44 分钟前
Vue3 实现 B站 视差 动画
前端
KenXu1 小时前
F2C Prompt to Design、AI 驱动的设计革命
前端
小鱼儿亮亮1 小时前
canvas中画线条,线条效果比预期宽1像素且模糊问题分析及解决方案
前端·react.js
@大迁世界1 小时前
用 popover=“hint“ 打造友好的 HTML 提示:一招让界面更“懂人”
开发语言·前端·javascript·css·html
伍哥的传说1 小时前
Tailwind CSS v4 终极指南:体验 Rust 驱动的闪电般性能与现代化 CSS 工作流
前端·css·rust·tailwindcss·tailwind css v4·lightning css·utility-first
小鱼儿亮亮1 小时前
使用Redux的combineReducers对数据拆分
前端·react.js