diff --git a/docs/translate.js/README.md b/docs/translate.js/README.md index f550279..ab0e5c9 100644 --- a/docs/translate.js/README.md +++ b/docs/translate.js/README.md @@ -1,30 +1,89 @@ - +

+ translate.js +

+

+ It is an AI i18n tool designed for front-end developers. With just two lines of JavaScript code, it can achieve fully automatic translation of HTML.
+ Leave it to the AI. There is no need to modify the page, no language configuration file is required, no API Key is needed, and it is SEO-friendly! +

-# [ToMemo](https://apps.apple.com/cn/app/tomemo/id1610843304) +![image](assets/demo.gif) -ToMemo is a phrasebook + clipboard history + keyboard iOS app with integrated AI macromodeling for quick output use in the keyboard. -## UI +# Usage method +### 1. Deploy the text translation API +First, deploy the text translation open interface. It supports batch translation of multiple texts at once and has a built-in multi-layer caching system, which minimizes the time-consuming process of AI translation. This enables users to achieve instant and delay-free translation when using it. -![image](assets/ui.jpg) +##### 1.1 Server specifications +It can run perfectly with the following server configuration: 1 core, 1GB of memory, a 20GB system disk, a bandwidth of 1MB, and the operating system being CentOS 7.4 (any version from 7.0 to 7.9 is acceptable). -![image](assets/ui-keyboard.jpg) +##### 1.2 Install +```` +wget https://gitee.com/mail_osc/translate/raw/master/deploy/install_translate.service.sh -O install.sh && chmod -R 777 install.sh && sh ./install.sh +```` -## Integrate with Deepseek API +##### 1.3 Configure DeepSeek parameters -- Go to "Settings-Extensions-AI Services-AI Providers", click "Add" in the top right corner, and select "DeepSeek" in the **Provider** field. -- Enter your API Key in the **API Key** field. -- Click the "Test" button to verify if the input is valid. -- Click "Load Models" to select the model you want to use -- Turn on "Enable" and click "Save" +Edit application.properties ,Edit command: +```` +vi /mnt/tomcat8/webapps/ROOT/WEB-INF/classes/application.properties +```` +Then append a few lines of configuration at the very end: +```` +# The request URL of the large model interface. For example, the following is the request URL of Huawei DeepSeek. Additionally, the request URL of GiteeAI is https://ai.gitee.com/v1/chat/completions , You can obtain and fill in the information for other platforms by yourself. +translate.service.deepSeek.url=https://infer-modelarts-cn-southwest-2.modelarts-infer.com/v1/infers/fd53915b-8935-48fe-be70-449d76c0fc87/v1/chat/completions +# Access token +translate.service.deepSeek.key=QM8jrVl98lTluLhzCaO4i9PFv-caRk6U7kDL-H6CIyApytMG69jO33aasO1GnduQak8fGI7dtpmbsM98Qh3ywA +# Which model to use? Here, it is advisable to use DeepSeek-V3 by default, and there is no need to make any changes. +translate.service.deepSeek.model=DeepSeek-V3 +# The maximum number of tokens for a single AI operation. If not set, the default value is 3000. You can just use this default value here. +translate.service.deepSeek.max_tokens=3000 +```` +The final effect is shown in the following figure: +![image](assets/application_properties_demo.png) -![image](assets/app-provider.png) +##### 1.4 Restart the service +```` +pkill java +sudo /mnt/tomcat8/bin/startup.sh +```` -## Use +##### 1.5 Test the text translation API. +![image](assets/texts_translate_api_demo.png) +The "from" passed in here represents the language before translation. If you know what language it is, fill it in. If you don't know and it's difficult to judge, just fill it in as shown in the picture above. DeepSeek will automatically recognize and perform the translation. +For detailed instructions on this translation API interface, please refer to: [http://api.zvo.cn/translate/service/20230807/translate.json.html](http://api.zvo.cn/translate/service/20230807/translate.json.html) -- Go to "Settings-Extensions-AI Services" -- Click "AI Assistant" to enter the AI Assistant page -- Add an AI Assistant in the top right corner, you can select "Deepseek" in the models -- Start chatting with Deepseek -![image](assets/use-deepseek.png) + +### 2. Use translate.js in HTML. + +**Click on a certain language in an ordinary website to switch. ** + +As shown in the following figure, there should be an option to switch among several languages at a certain position on the website. +![](assets/site_demo.png) +Directly add the following code at the end of its HTML code: + +```` + + + + + + +```` + +This is just the use in the most common scenario. In addition, for various frameworks such as VUE, React, and so on, as well as all kinds of management backends, as long as JavaScript can be run, it can be used! + +# Open-source repository +https://github.com/xnx3/translate + diff --git a/docs/translate.js/README_cn.md b/docs/translate.js/README_cn.md index b9ff5db..f56f3be 100644 --- a/docs/translate.js/README_cn.md +++ b/docs/translate.js/README_cn.md @@ -6,11 +6,7 @@ 交给AI,无需改动页面、无语言配置文件、无API Key、对SEO友好! -
- -
+![image](assets/demo.gif) # 使用方式 diff --git a/docs/translate.js/README_ja.md b/docs/translate.js/README_ja.md new file mode 100644 index 0000000..74a9b59 --- /dev/null +++ b/docs/translate.js/README_ja.md @@ -0,0 +1,86 @@ +

+ translate.js +

+

+ それはフロントエンド開発者向けのAI i18nで、2行のJSでHTMLの全自動翻訳を実現します。
+ AIに任せて、ページの変更なし、言語設定ファイルなし、APIキーなし、SEOに優しい! +

+ +![image](assets/demo.gif) + +# 使用方法 +### 1. テキスト翻訳APIの展開 +まず、テキスト翻訳のオープンインターフェースを展開し、一度に複数のテキストをバッチ翻訳することをサポートし、同時に多層キャッシュシステムを内蔵して、AI翻訳の時間を最大限に短縮します。これにより、ユーザーが使用時に瞬時に遅延なく翻訳できる能力を実現します。 + +##### 1.1 サーバー仕様 +1コア1GB、20GBのシステムディスク、1MBの帯域幅で、オペレーティングシステムはCentOS 7.4(7.0〜7.9でも可)で完璧に動作します。 + +##### 1.2 インストール +```` +wget https://gitee.com/mail_osc/translate/raw/master/deploy/install_translate.service.sh -O install.sh && chmod -R 777 install.sh && sh ./install.sh +```` + +##### 1.3 DeepSeek パラメータの設定 + +編集 application.properties : +```` +vi /mnt/tomcat8/webapps/ROOT/WEB-INF/classes/application.properties +```` +その後、最後にいくつかの設定を追加します: +```` +# 大規模モデルインターフェースリクエストURL、例えば以下のものはHuawei DeepSeekのリクエストURLです。また、GiteeAIのリクエストURLは https://ai.gitee.com/v1/chat/completions 他のプラットフォームからは自分で取得して入力できます +translate.service.deepSeek.url=https://infer-modelarts-cn-southwest-2.modelarts-infer.com/v1/infers/fd53915b-8935-48fe-be70-449d76c0fc87/v1/chat/completions +# アクセストークン +translate.service.deepSeek.key=QM8jrVl98lTluLhzCaO4i9PFv-caRk6U7kDL-H6CIyApytMG69jO33aasO1GnduQak8fGI7dtpmbsM98Qh3ywA +# どのモデルを使用するか、ここではデフォルトで DeepSeek-V3 を使用すればよく、変更する必要はありません。 +translate.service.deepSeek.model=DeepSeek-V3 +# AIの単回の最大トークン数、設定しない場合デフォルトは3000で、ここではデフォルトでこれを使用すれば良いです。 +translate.service.deepSeek.max_tokens=3000 +```` +最終の効果は以下の図のとおりです: +![image](assets/application_properties_demo.png) + +##### 1.4 サービスを再起動する +```` +pkill java +sudo /mnt/tomcat8/bin/startup.sh +```` + +##### 1.5 テキスト翻訳APIをテストする +![image](assets/texts_translate_api_demo.png) +ここで渡される「from」は、翻訳前の言語を表します。もしその言語がわかればそれを記入し、わからない場合や判断が難しい場合は、上記のように固定して記入してください。DeepSeekが自動的に認識し、翻訳を行います。 +この翻訳APIインターフェースの詳細な説明については、以下を参照してください: [http://api.zvo.cn/translate/service/20230807/translate.json.html](http://api.zvo.cn/translate/service/20230807/translate.json.html) + + + +### 2. htmlでtranslate.jsを使用する + +**通常のウェブサイトで、ある言語をクリックして切り替える** +以下の図に示すように、ウェブサイトの特定の場所でいくつかの言語を切り替える必要があります。 +![](assets/site_demo.png) +そのHTMLコードの末尾に以下のコードを直接追加します: + +```` + + + + + + +```` + +これは最も一般的なシーンでの使用例です。また、VUEやReactなどの各フレームワークや、さまざまな管理画面など、JSが実行できる環境であればどこでも使用できます! + +# オープンソースリポジトリ +https://github.com/xnx3/translate diff --git a/docs/translate.js/assets/demo.gif b/docs/translate.js/assets/demo.gif new file mode 100644 index 0000000..d204416 Binary files /dev/null and b/docs/translate.js/assets/demo.gif differ diff --git a/docs/translate.js/assets/demo.mp4 b/docs/translate.js/assets/demo.mp4 deleted file mode 100644 index 92fef04..0000000 Binary files a/docs/translate.js/assets/demo.mp4 and /dev/null differ