VUE+.NET應用系統的國際化-整體設計思路

近期產品要支持國際化多語言，主要涉及前端界面國際化以及後端提示信息、異常信息的國際化多語言支持。

目前我們的開發技術棧：前端VUE、後端.NET。面向前端界面和後端服務，分別涉及對應的國際化多語言支持方案。

一、前端界面國際化多語言支持

前端VUE界面的源碼如下：

 上述代碼中，我們將需要多語言支持的文本，統一使用:

$t("web.layout_logoTitle")

前端對應的多語言包web對象結構如下：

上面是標準的VUE前端國際化多語言實現技術。

如果這麼做的話，需要前端開發同學把每個VUE界面都識別、翻譯形成一個多語言包JS文件，工作量巨大。

所以我們有個初步的想法，通過代碼文本識別，抽取多語言文本詞條，代碼中統一替換為詞條ID，同時按界面生成多語言JS文件。

如果能搞定的話，這將大大提升前端國際化改造的效率。

二、後端服務國際化多語言支持

後端代碼目前是這樣的：

private static void CheckMd5(string fileName, string md5Data)
{
      string md5Str = MD5Service.GetMD5(fileName);
      if (!string.Equals(md5Str, md5Data, StringComparison.OrdinalIgnoreCase))
      {
           throw new CustomException(PackageExceptionConst.FileMd5CheckFailed, "服務包文件MD5校驗失敗：" + fileName);
      }
}

代碼中需要將“服務包文件MD5校驗失敗”這個文本做多語言改造。

例如：英文

throw new CustomException(PackageExceptionConst.FileMd5CheckFailed, "Verification of service pack file MD5 failed:" + fileName);

如果支持多個語言，這個地方就不好處理了。不能為了每個語言搞一行代碼，同時也無法支持後續新增語言。

因此，計劃在後端提供一個多語言詞條服務，運行時根據用戶登錄的語言，動態獲取對應的多語言文本。

整體設計思路是這樣的：

1. 提供一個工具，識別前後端代碼中的中文，形成多語言詞條，按語言、界面、模塊統一管理多有的多語言詞條
2. 提供一個翻譯服務，批量翻譯多語言詞條
3. 提供一個詞條服務，支持後端代碼在運行時根據用戶登錄的語言，動態獲取對應的多語言文本
4. 提供前端多語言JS生成服務，按界面動態生成對應的多語言JS文件，方便前端VUE文件使用。
5. 提供代碼替換工具，將VUE前端代碼中的中文替換為$t("詞條ID")，後端代碼中的中文替換為TermService.Current.GetText("詞條ID")

接下來，將按上述5個部分，給大家的分別展開分享具體的實現。

周國慶

2023/3/5