日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問(wèn) 生活随笔!

生活随笔

當(dāng)前位置: 首頁(yè) > 运维知识 > windows >内容正文

windows

助力项目快捷实现国际化,造个多语言轮子

發(fā)布時(shí)間:2024/1/5 windows 39 coder
生活随笔 收集整理的這篇文章主要介紹了 助力项目快捷实现国际化,造个多语言轮子 小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

前段時(shí)間跟同事吹水聊天時(shí),吐槽一個(gè)話題,就是公司項(xiàng)目都需要做多語(yǔ)言,前端后端都需要做。

而且是需要支持8國(guó)語(yǔ)言翻譯,每次弄起來(lái)都特麻煩,每加一個(gè)Key就需要去翻譯其他7個(gè)語(yǔ)言出來(lái)添加,每新增一個(gè)項(xiàng)目就需要弄一遍多語(yǔ)言資源,重復(fù)且枯燥費(fèi)時(shí)的體力活。

項(xiàng)目想法

本項(xiàng)目主打一個(gè)一處配置多語(yǔ)言,多處使用的想法。助力項(xiàng)目方便快捷實(shí)現(xiàn)國(guó)際化(多語(yǔ)言)。
主要解決的問(wèn)題:

  • 自動(dòng)翻譯多語(yǔ)言資源。
  • 通用資源無(wú)需重復(fù)添加(關(guān)聯(lián)項(xiàng)目即可)
  • 新增地區(qū)時(shí)自動(dòng)同步且翻譯已存在的資源。
  • 友好的界面配置。
  • 修改資源時(shí)可實(shí)時(shí)同步到資源客戶端(使用SignalR接入)
  • 多語(yǔ)言資源批量打包導(dǎo)出。

目前主要功能如下(目前還只是雛形,不算完善):

  • 可配關(guān)聯(lián)項(xiàng)目,主項(xiàng)目關(guān)聯(lián)其他項(xiàng)目即可獲取其他項(xiàng)目的多語(yǔ)言資源,相同Key則優(yōu)先取主項(xiàng)目中的資源(即覆蓋)

  • 批量導(dǎo)入已存在項(xiàng)目多語(yǔ)言資源(目前只支持JSON格式)

  • 多語(yǔ)言配置導(dǎo)出(目前支持json,toml,messages.properties, xml格式)

  • 可配置自動(dòng)翻譯其他語(yǔ)言的資源(目前接入百度翻譯和有道翻譯API,冷門(mén)地區(qū)語(yǔ)言翻譯暫不支持,翻譯不準(zhǔn)確時(shí)可手動(dòng)修改)

  • API/SignalR接入

  • 界面管理

  • .NET SDK 接入 (其他語(yǔ)言待開(kāi)發(fā))

測(cè)試環(huán)境歡迎體驗(yàn)并給點(diǎn)意見(jiàn)或提提ISSUE,當(dāng)然歡迎PR一起完善項(xiàng)目。

http://47.119.20.111/Projects

http://47.119.20.111/swagger/index.html

項(xiàng)目地址:
https://github.com/fanslead/LinguaNex

應(yīng)用場(chǎng)景

通過(guò)API/SDK拉取多語(yǔ)言資源加載,可選WebSocket對(duì)接實(shí)現(xiàn)即時(shí)更新多語(yǔ)言資源。

  • API后端項(xiàng)目響應(yīng)內(nèi)容,如錯(cuò)誤碼對(duì)應(yīng)的Message國(guó)際化多語(yǔ)言處理。
  • Web項(xiàng)目國(guó)際化多語(yǔ)言集成,可導(dǎo)出多語(yǔ)言文件編譯,或?qū)覣PI/SDK即時(shí)獲取加載數(shù)據(jù)。
  • APP項(xiàng)目與Web基本一致。
  • 騷操作:實(shí)現(xiàn)一個(gè)短Key完成長(zhǎng)文章多語(yǔ)言顯示。

效果圖


運(yùn)行環(huán)境

  • .NET 8
  • Redis
  • RabbitMQ(可選)
  • EF Core SQLLite(可自行替換數(shù)據(jù)庫(kù))

OpenApi接入

請(qǐng)求地址:/api/OpenApi/Resources/{ProjectId}?cultureName=&all=

  • ProjectId表示項(xiàng)目ID
  • cultureName 可選參數(shù),不傳則默認(rèn)當(dāng)前請(qǐng)求環(huán)境語(yǔ)言資源。
  • all 可選參數(shù),默認(rèn)false,cultureName為空時(shí),true則返回所有語(yǔ)言資源

響應(yīng)結(jié)構(gòu)如下:

[
  {
    "cultureName": "zh-Hans",
    "resources": {
      "Hello": "你好"
    }
  },
  {
    "cultureName": "en",
    "resources": {
      "Hello": "Hello"
    }
  }
]

SignalR接入(c#例子)

var connection = new HubConnectionBuilder()
    .WithUrl($"{linguaNexApiUrl}/hubs/LinguaNex?project={project}", Microsoft.AspNetCore.Http.Connections.HttpTransportType.WebSockets)
    .AddJsonProtocol()
    .WithAutomaticReconnect()
    .Build();

connection.On<LinguaNexResources>("CreateOrUpdateResource", obj => 
{
    if (_resourcesCache.TryGetValue(obj.CultureName, out var value))
    {
        foreach (var resource in obj.Resources)
        {
            value[resource.Key] = resource.Value;
        }
        _resourcesCache[obj.CultureName] = value;
    }else
    {
        _resourcesCache[obj.CultureName] = new ConcurrentDictionary<string, string>(obj.Resources);
    }
});

connection.StartAsync();

//拉取資源 參數(shù)跟OpenApi接口一致
connection.InvokeAsync<List<LinguaNexResources>>("GetResources", projectId, cultureName,all);

.NET SDK接入

需要引用LinguaNex.Localization.Net包。
在依賴注入中添加如下代碼即可:

builder.Services.AddLinguaNexLocalization(options =>
{
    options.LinguaNexApiUrl = builder.Configuration["LinguaNex:ApiUrl"];
    options.Project = builder.Configuration["LinguaNex:Project"];
    options.UseWebSocket = true;
});

.NET SDK是通過(guò)實(shí)現(xiàn)IStringLocalizer接口對(duì)接的。所以可以無(wú)縫銜接已有多語(yǔ)言的項(xiàng)目切換。
本項(xiàng)目自身已使用SDK對(duì)接自己。
測(cè)試效果

antd design pro使用API接入

由于目前還沒(méi)時(shí)間完事前端界面的多語(yǔ)言配置。但是之前試過(guò)使用antd design pro接入過(guò)ABP的后端多語(yǔ)言的配置。
接入流程是一致的。這里提供下參考代碼:

import { addLocale, getLocale } from 'umi';
import { Locale } from 'antd/es/locale';

let locale = getLocale() as string;

let antdLocale = {} as Locale

const applicationLocalization = await getApplicationLocalization(); // 這里可以實(shí)現(xiàn)接入后端API獲取資源
const resources = applicationLocalization.resources
const allText = {}

for(let key in resources) {
  if(resources[key]){
    Object.assign(allText, resources[key].texts)
  }
}
locale = getLocale() as string;
addLocale(
  locale,
  allText,
  {
    momentLocale: antdLocale.locale,
    antd: antdLocale,
  }

RoadMap

總結(jié)

以上是生活随笔為你收集整理的助力项目快捷实现国际化,造个多语言轮子的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。