文化とURLルーティング
多言語ポータルでは、アクティブな言語がURL内に存在し、言語切り替えの挙動も単一のオプションで設定可能です。 UrlCultureStrategy。サーバーのリクエストルーティング、Blazorドキュメントの基本hrefやSEOタグ、BlazorとReactの各 <LanguageDropdown /> が言語の位置を一致させ、スタック全体を一貫して管理しています。単一言語ポータルは影響を受けず、交渉するものがないため、すべての戦略が同じように振る舞います。
URLにおける言語の表示方法
3つの戦略が用意されています。デフォルトはオプションが存在する前に出荷された動作を保持するため、既存のポータルに変更は不要です。
PathPrefix(デフォルト)
デフォルト言語は、裸のURLおよび他のすべての言語で /{culture} パスプレフィックスで提供されます:
/contacts— 接頭辞なしのデフォルト言語です。/fr/contacts— 文化接頭辞の下にある任意の非デフォルト言語。- 接頭辞付きデフォルト言語のURL(
/en/contacts)はベアフォームに永久リダイレクトされ、初めて訪問者のブラウザAccept-Languageが対応しない非デフォルト言語に一致すると、その言語の接頭辞URLにリダイレクトされます。つまり、各ページは言語ごとに1つの標準的でクロール可能なアドレスを持ちます。
パスプレフィックスオール
すべての言語は接頭辞が付けられており、単一の対称的なURL形状のデフォルトである /en/contacts、 /fr/contacts も含まれます。単純なページURLは解決された言語のプレフィックス(カルチャークッキーや Accept-Languageから取得し、デフォルト言語にフォールバック)にリダイレクトされます。
クッキーオンリー
その言語はURLには一切表示されません。 .AspNetCore.Culture クッキーから解決され( Accept-Languageにフォールバック) その場で適用されます — リダイレクトもパスの書き換えもありません。ナビゲーションせずに言語を切り替えるSPAスタイルのポータルに最適です。
戦略の選択
ホストでローカライゼーションを設定する戦略を LocalizationOptions 設定しましょう。デフォルトは PathPrefixで、これはオプトインです:
builder.Services
.Configure<LocalizationOptions>(options =>
{
// デフォルトはPathPrefixです。PathPrefixAllはすべての言語に接頭辞を付けますが、CookieOnlyはURLから除外します
options.UrlCultureStrategy = UrlCultureStrategy.PathPrefixAll;
});
それだけが必要な配線です。同じオプションがBlazorとReactホストを駆動し(どちらも同じ設定 LocalizationOptions )、以下のすべてがそこから導かれます。
ベースhref、カノニカル&hreflang — あなたのために対応します
どの戦略を選んでも、フレームワークは各ページのURL識別マークアップを同期させているため、検索エンジンとBlazor回路は常に言語の所在地に合意します。
- ベースhref — ドキュメントの
<base href>はリクエストのパスベースを追跡するため、プリレンダリングされたページとBlazor Server回路は、どのプレフィックスでも同じアプリケーションのルートを解決します。 - 標準的なURL — 各ページは戦略に従い、アクティブ言語で標準アドレスをプレフィックスまたはベアで広告します。
- hreflang 代替 — 対応言語ごとに1つの代替リンクと
x-defaultつがあり、それぞれが現在のページのその言語のURLを指しています。
このマークアップは2つのフレームワークコンポーネントから出されます。基本のhrefに対する <CultureBaseHref /> と、標準タグ、hreflangタグ、オープングラフのローカレタグに対する <CultureAlternateLinks /> です。どちらも PowerPortalsPro.Web.Blazor.Components に住み、箱から出して戦略に敏感です。デモではそれらを App.razor とSEOヘッドのコンポーネントに結びつけています:
@using PowerPortalsPro.Web.Blazor.Components
<head>
<CultureBaseHref />
...
</head>
<CultureAlternateLinks />
言語の切り替え
両方のスタックの <LanguageDropdown /> はポータルの設定言語を一覧にし、ユーザーが選択したときにアクティブな言語を切り替えます。設定された戦略に自動的に従います:
// 同じコンポーネント、同じ動作、Reactスタック上で
import { LanguageDropdown } from '@powerportalspro/react-fluent';
<LanguageDropdown /><LanguageDropdown />プレフィックス戦略では、スイッチは選択した言語のURLに移動し、ページは正統で正しく接頭辞のアドレスで再読み込みされます。 CookieOnly ではカルチャークッキーを介して切り替えられ、ナビゲーションはありません。いずれにせよクッキーは設定されているので、同じ出所の他のサーフェスは同期したままです。
カスタムUIで戦略を読む
自分でスイッチャーや言語認識リンクを作る?アクティブ戦略を直接読んでください。Blazorのサーバーサイド LocalizationOptions か、Reactのローカライゼーションマニフェストから、 buildLocalePath() が現在のページの言語URLに変換する形で。
// Reactクライアントはローカリゼーションマニフェストから戦略を読み込みます。
// buildLocalePath()は、そのURLを特定の言語のターゲットURLに変換します。
import { useUrlCultureStrategy, useDefaultLocale, buildLocalePath } from '@powerportalspro/react';
const strategy = useUrlCultureStrategy();
const defaultLocale = useDefaultLocale();@inject IOptions<LocalizationOptions> Options
@code {
// オプションを注入できる場所で設定された戦略
private UrlCultureStrategy Strategy => Options.Value.UrlCultureStrategy;
}注記
上記のことは、ポータルが複数のUI文化をサポートしている場合にのみ効果を発揮します。単一文化サイトは戦略に関わらず、すべてのページをその純URLでサービスしているため、配信しない言語に対してリダイレクトやプレフィックスの負担がかかりません。
