Laravel Inertia SSR应用的本地化路由问题

我想要实现一个看起来挺简单的效果：

• 网站支持两种语言，URL结构像 /en/blog/article1 和 /de/blog/seite1 这样
• 页面内容要能被搜索引擎抓取，满足SEO需求

本来以为没多难，结果实际做起来发现超级棘手。

遇到的问题 #

1. SSR（服务端渲染）输出的URL变成了这样：/blog 和 /blog/article1，没有语言前缀
2. React端也出现了相关问题（原描述未完整）

解决方案思路 #

作为经常处理这类问题的开发者，我来给你梳理下可行的解决步骤：

1. 先在Laravel路由层搞定语言前缀

把所有需要本地化的路由都包裹在带语言前缀的路由组里，同时限制locale只能是你支持的语言（比如en和de）：

Route::group(['prefix' => '{locale}', 'where' => ['locale' => 'en|de']], function () {
    Route::inertia('/blog', 'Blog/Index')->name('blog.index');
    Route::inertia('/blog/{article}', 'Blog/Show')->name('blog.show');
});

然后写个中间件来处理默认语言跳转和设置当前语言：

// app/Http/Middleware/SetLocale.php
public function handle(Request $request, Closure $next)
{
    // 如果传入的locale不在支持列表里，重定向到默认语言路由
    if (!in_array($request->locale, ['en', 'de'])) {
        return redirect()->route('blog.index', ['locale' => app()->getLocale()]);
    }
    // 设置应用当前语言
    app()->setLocale($request->locale);
    return $next($request);
}

别忘了把这个中间件加到app/Http/Kernel.php的web中间件组里哦。

2. 让Inertia SSR适配语言前缀

在Inertia的配置文件config/inertia.php里，要确保SSR生成URL时能带上语言参数。另外在React组件里使用route助手的时候，一定要传locale参数：

import { route } from '@inertiajs/react';

// 生成带语言前缀的正确URL
const articleUrl = route('blog.show', { locale: 'en', article: 'article1' });

3. 保障SEO友好性

• 页面头部要加上hreflang标签，告诉搜索引擎不同语言版本的对应页面：

  <link rel="alternate" hreflang="en" href="https://yourdomain.com/en/blog/article1" />
  <link rel="alternate" hreflang="de" href="https://yourdomain.com/de/blog/seite1" />
  

• 确保SSR渲染时，页面的meta信息、文案都是对应语言的，Laravel的本地化文件（resources/lang下的文件）要配置好对应语言的内容。

4. 处理React端的跳转问题

用Inertia的Link组件或者router.visit跳转时，必须带上locale参数，避免跳转到不带前缀的URL：

import { Link } from '@inertiajs/react';

<Link href={route('blog.show', { locale: app.props.locale, article: 'article1' })}>
  查看文章
</Link>

按照这些步骤来，应该就能解决你遇到的SSR URL缺失语言前缀的问题，同时满足双语言和SEO的需求啦。

内容来源于stack exchange