i18n-jsautotranslate 1.0.0 → 2.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.js +3042 -596
- package/package.json +2 -2
- package/readme.md +116 -298
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "i18n-jsautotranslate",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.6.0",
|
|
4
4
|
"description": "两行js实现html全自动翻译。无需改动页面、无语言配置文件、无API Key、对SEO友好！",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -13,4 +13,4 @@
|
|
|
13
13
|
],
|
|
14
14
|
"author": "管雷鸣",
|
|
15
15
|
"license": "ISC"
|
|
16
|
-
}
|
|
16
|
+
}
|
package/readme.md
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
|
|
2
1
|
<h1 align="center">
|
|
3
2
|
translate.js
|
|
4
3
|
</h1>
|
|
@@ -7,11 +6,18 @@
|
|
|
7
6
|
无需改动页面、无语言配置文件、无API Key、对SEO友好！
|
|
8
7
|
</h4>
|
|
9
8
|
<h4 align="center">
|
|
10
|
-
|
|
9
|
+
简体中文 |
|
|
10
|
+
<a href="http://translate.zvo.cn/41162.html?language=chinese_traditional">繁體中文</a> |
|
|
11
|
+
<a href="http://translate.zvo.cn/41162.html?language=english">English</a> |
|
|
12
|
+
<a href="http://translate.zvo.cn/41162.html?language=japanese">しろうと</a> |
|
|
13
|
+
<a href="http://translate.zvo.cn/41162.html?language=russian">Русский язык</a> |
|
|
14
|
+
<a href="http://translate.zvo.cn/41162.html?language=german">deutsch</a> |
|
|
15
|
+
<a href="http://translate.zvo.cn/41162.html?language=french">Français</a>
|
|
11
16
|
</h4>
|
|
12
17
|
|
|
13
18
|
|
|
14
|
-
|
|
19
|
+
|
|
20
|
+
# 特性说明
|
|
15
21
|
* **使用极其简单。** 无需任何前期准备，直接加入几行代码即可拥有多种语言全自动切换能力。
|
|
16
22
|
* **不增加工作量。** 无需另行改造页面本身，也没有各种语言都要单独配置的语言文件，更不需要你对页面本身要显示的文字区域进行代码调用，我认为那样对技术人员实在是太不友好了。而且它也不需要你到某某网站申请什么key，它本身就是开放的，拿来即用。
|
|
17
23
|
* **极其灵活扩展。** 您可指定它只翻译某些指定区域、切换语言时显示下拉框还是通过摆放多个切换语言按钮进行、可指定某些特定的元素不进行翻译忽略……
|
|
@@ -26,7 +32,8 @@
|
|
|
26
32
|
http://res.zvo.cn/translate/demo.html
|
|
27
33
|
|
|
28
34
|
|
|
29
|
-
#
|
|
35
|
+
# 测试效果
|
|
36
|
+
先拿别人的网站动手试试效果
|
|
30
37
|
|
|
31
38
|
|
|
32
39
|
1. 随便打开一个网页
|
|
@@ -42,226 +49,38 @@ http://res.zvo.cn/translate/demo.html
|
|
|
42
49
|
````
|
|
43
50
|
<script src="https://res.zvo.cn/translate/translate.js"></script>
|
|
44
51
|
<script>
|
|
45
|
-
translate.setUseVersion2(); //设置使用v2.x 版本
|
|
46
52
|
translate.language.setLocal('chinese_simplified'); //设置本地语种（当前网页的语种）。如果不设置，默认自动识别当前网页显示文字的语种。 可填写如 'english'、'chinese_simplified' 等，具体参见文档下方关于此的说明。
|
|
47
53
|
translate.execute();//进行翻译
|
|
48
54
|
</script>
|
|
49
55
|
````
|
|
50
56
|
|
|
51
|
-
#
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
.
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
这就是控制切换语言的 ``<select>`` 标签
|
|
79
|
-
|
|
80
|
-
### 设定是否自动出现 select 切换语言
|
|
81
|
-
|
|
82
|
-
````
|
|
83
|
-
/*
|
|
84
|
-
* 是否显示 select选择语言的选择框，true显示； false不显示。默认为true
|
|
85
|
-
* 注意,这行要放到 translate.execute(); 上面
|
|
86
|
-
*/
|
|
87
|
-
translate.selectLanguageTag.show = false;
|
|
88
|
-
translate.execute();
|
|
89
|
-
````
|
|
90
|
-
|
|
91
|
-
使用场景是，如果使用了:
|
|
92
|
-
|
|
93
|
-
````
|
|
94
|
-
<a href="javascript:translate.changeLanguage('en');">切换为英语</a>
|
|
95
|
-
````
|
|
96
|
-
|
|
97
|
-
这种切换方式，那么 select下拉选择的就用不到了，就可以用此方式来不显示。
|
|
98
|
-
当然你也可以使用css的方式来控制其不显示。比如：
|
|
99
|
-
|
|
100
|
-
````
|
|
101
|
-
<style>
|
|
102
|
-
#translate{
|
|
103
|
-
display:none;
|
|
104
|
-
}
|
|
105
|
-
</style>
|
|
106
|
-
````
|
|
107
|
-
|
|
108
|
-
### 自定义出现的 select 切换语言所支持的语种
|
|
109
|
-
|
|
110
|
-
````
|
|
111
|
-
translate.selectLanguageTag.languages = 'english,chinese_simplified,korean'; //每个语种之间用英文,分割。比如这里设置的是支持英语、简体中文、韩语 的切换。根据后端翻译服务不同，支持的语言也不同。具体支持哪些，可通过 http://api.translate.zvo.cn/doc/language.json.html 获取 （如果您私有部署的，将请求域名换为您自己私有部署的域名）
|
|
112
|
-
````
|
|
113
|
-
每个语种之间用英文,分割。比如这里设置的是支持英语、简体中文、韩语 的切换。根据后端翻译服务不同，支持的语言也不同。
|
|
114
|
-
具体支持哪些，可通过 http://api.translate.zvo.cn/doc/language.json.html 获取 （如果您私有部署的，将请求域名换为您自己私有部署的域名）
|
|
115
|
-
**注意，这行要放到 translate.execute(); 上面**
|
|
116
|
-
|
|
117
|
-
### 翻译时忽略指定的tag标签
|
|
118
|
-
|
|
119
|
-
````
|
|
120
|
-
translate.ignore.tag.push('span'); //翻译时追加上自己想忽略不进行翻译的tag标签，凡是在这里面的，都不进行翻译。
|
|
121
|
-
````
|
|
122
|
-
翻译时追加上自己想忽略不进行翻译的tag标签，凡是在这里面的，都不进行翻译。
|
|
123
|
-
如果你想查看当前忽略哪些tag标签，可直接执行 ```` console.log(translate.ignore.tag); ```` 进行查看
|
|
124
|
-
**注意，这行要放到 translate.execute(); 上面**
|
|
125
|
-
|
|
126
|
-
### 翻译时忽略指定的class值
|
|
127
|
-
|
|
128
|
-
````
|
|
129
|
-
translate.ignore.class.push('test'); //翻译时追加上自己想忽略不进行翻译的class name的值，凡是在这里面的，都不进行翻译。
|
|
130
|
-
````
|
|
131
|
-
翻译时追加上自己想忽略不进行翻译的class标签，凡是在这里面的，都不进行翻译。
|
|
132
|
-
如果你想查看当前忽略哪些class，可直接执行 ```` console.log(translate.ignore.class); ```` 进行查看
|
|
133
|
-
**注意，这行要放到 translate.execute(); 上面**
|
|
134
|
-
|
|
135
|
-
### 翻译时忽略指定的id值
|
|
136
|
-
|
|
137
|
-
````
|
|
138
|
-
translate.ignore.id.push('test'); //翻译时追加上自己想忽略不进行翻译的id的值，凡是在这里面的，都不进行翻译。
|
|
139
|
-
````
|
|
140
|
-
翻译时追加上自己想忽略不进行翻译的id的值，凡是在这里面的，都不进行翻译。
|
|
141
|
-
如果你想查看当前忽略哪些id，可直接执行 ```` console.log(translate.ignore.id); ```` 进行查看
|
|
142
|
-
**注意，这行要放到 translate.execute(); 上面**
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
### 翻译指定的区域
|
|
146
|
-
|
|
147
|
-
````
|
|
148
|
-
var documents = [];
|
|
149
|
-
documents.push(document.getElementById('test1'));
|
|
150
|
-
documents.push(document.getElementById('test2'));
|
|
151
|
-
documents.push(document.getElementById('test3'));
|
|
152
|
-
translate.setDocuments(documents); //指定要翻译的元素的集合,可传入一个或多个元素。如果不设置，默认翻译整个网页
|
|
153
|
-
````
|
|
154
|
-
|
|
155
|
-
可使用 translate.setDocuments(...) 指定要翻译的元素的集合,可传入一个或多个元素。如果不设置此，默认翻译整个网页。
|
|
156
|
-
**注意，这行要放到 translate.execute(); 上面**
|
|
157
|
-
|
|
158
|
-
### js主动切换语言
|
|
159
|
-
比如点击某个链接显示英文界面
|
|
160
|
-
|
|
161
|
-
````
|
|
162
|
-
<a href="javascript:translate.changeLanguage('english');" class="ignore">切换为英语</a>
|
|
163
|
-
````
|
|
164
|
-
|
|
165
|
-
只需传入翻译的目标语言，即可快速切换到指定语种。具体有哪些语言，可查阅： [http://api.translate.zvo.cn/doc/language.json.html](http://api.translate.zvo.cn/doc/language.json.html)
|
|
166
|
-
其中 ````class="ignore"```` 加了这个class，代表这个a标签将不会被翻译
|
|
167
|
-
|
|
168
|
-
### 自动根据用户所在的国家切换其语种
|
|
169
|
-
|
|
170
|
-
用户第一次打开网页时，自动判断当前用户所在国家使用的是哪种语言，来自动进行切换为用户所在国家的语种。
|
|
171
|
-
如果用户手动切换了别的语种，再使用时，那就优先以用户所选择的为主，这个就不管用了。
|
|
172
|
-
|
|
173
|
-
````
|
|
174
|
-
translate.setAutoDiscriminateLocalLanguage(); //设置用户第一次用时，自动识别其所在国家的语种进行切换
|
|
175
|
-
````
|
|
176
|
-
|
|
177
|
-
### 设置本地语种（当前网页的语种）
|
|
178
|
-
|
|
179
|
-
````
|
|
180
|
-
translate.language.setLocal('chinese_simplified'); //设置本地语种（当前网页的语种）。如果不设置，默认就是 chinese_simplified 简体中文
|
|
181
|
-
````
|
|
182
|
-
当前支持的本地语种有：
|
|
183
|
-
* **chinese_simplified** 简体中文
|
|
184
|
-
* **chinese_traditional** 繁体中文
|
|
185
|
-
* **english** 英语
|
|
186
|
-
如果不设置，默认会自动识别当前网页的文本，取当前网页文本中，出现频率最高的语种为默认语种。
|
|
187
|
-
这个会在出现 select 选择语言时，默认选中的语种。
|
|
188
|
-
|
|
189
|
-
**注意，这行要放到 translate.execute(); 上面**
|
|
190
|
-
|
|
191
|
-
### 对页面动态渲染的文本进行自动翻译
|
|
192
|
-
|
|
193
|
-
正常情况下，极大可能会有这种需求：
|
|
194
|
-
1. 页面中需要通过ajax请求后端服务器获取数据，然后再将数据渲染展示出来。
|
|
195
|
-
2. 页面中的弹出提示 （就比如 [msg.js](https://gitee.com/mail_osc/msg) 的 ````msg.info('你好');```` ） 这个提示是js加载出来的，提示文字也需要一并进行翻译的情况
|
|
196
|
-
您可加入下面一行代码，来实现以上需求。
|
|
197
|
-
|
|
198
|
-
````
|
|
199
|
-
translate.listener.start(); //开启html页面变化的监控，对变化部分会进行自动翻译。注意，这里变化区域，是指使用 translate.setDocuments(...) 设置的区域。如果未设置，那么为监控整个网页的变化
|
|
200
|
-
````
|
|
201
|
-
建议放在 translate.execute() 这行之前。
|
|
202
|
-
##### 注意事项
|
|
203
|
-
如果你手动设置了 ````translate.setDocuments(...)```` ，那么监听的就不是整个页面了，而是单纯只监听 ````setDocuments(...)```` 所设置的区域的改动。
|
|
204
|
-
|
|
205
|
-
### 私有化部署翻译服务接口
|
|
206
|
-
在某些政府机关及大集团内部项目中，对数据隐私及安全保密有强要求场景、以及您对自有客户希望提供高可靠翻译服务场景时，您可将翻译服务接口进行私有化部署，不走我们公开开放的翻译接口，以做到安全保密及后端服务全部自行掌控。
|
|
207
|
-
实际部署方式，可参考：[https://github.com/xnx3/translate_service](https://github.com/xnx3/translate_service)
|
|
208
|
-
部署好后，在 ````translate.execute();```` 之前，加入一行代码，如下所示：
|
|
209
|
-
|
|
210
|
-
````
|
|
211
|
-
translate.request.api.host='http://121.121.121.121/'; //将这里面的ip地址换成你服务器的ip，注意开头，及结尾还有个 / 别拉下
|
|
212
|
-
translate.execute();
|
|
213
|
-
````
|
|
214
|
-
|
|
215
|
-
如此，翻译请求接口就会走您自己服务器了。
|
|
216
|
-
|
|
217
|
-
### 翻译完后自动执行
|
|
218
|
-
当翻译完成后会自动触发执行某个方法，以便您来做自定义扩展。比如 [layui的翻译组件](https://gitee.com/mail_osc/translate_layui) 便是使用了此能力在翻译完成后重新绘制 select 选中项。
|
|
219
|
-
|
|
220
|
-
````
|
|
221
|
-
translate.listener.renderTaskFinish = function(task){
|
|
222
|
-
console.log('执行完一次');
|
|
223
|
-
}
|
|
224
|
-
````
|
|
225
|
-
|
|
226
|
-
进行翻译时每当执行完一次渲染任务（翻译）时会触发此。注意页面一次翻译会触发多个渲染任务。普通情况下，一次页面的翻译可能会触发两三次渲染任务。（因为一个网页上可能有多种语言，每种语言都是一次翻译任务。）
|
|
227
|
-
另外如果页面中有ajax交互方面的信息时，每次ajax信息刷新后，也会进行翻译，也是一次翻译任务。
|
|
228
|
-
当然，这里的翻译任务是确实有进行了翻译的前提下，执行完才会触发此。
|
|
229
|
-
|
|
230
|
-
### 自定义翻译术语
|
|
231
|
-
如果你感觉某些翻译不准确，可进行针对性的定义某些词的翻译结果，进行自定义术语库。使用的方法为：
|
|
232
|
-
|
|
233
|
-
````
|
|
234
|
-
translate.nomenclature.append(from, to, properties);
|
|
235
|
-
````
|
|
236
|
-
传入参数解释：
|
|
237
|
-
* **from** 要转换的语种，传入如 chinese_simplified
|
|
238
|
-
* **to** 翻译至的目标语种，传入如 english
|
|
239
|
-
* **properties** 配置表，格式便是properties的格式，每行一个规则，每个前后用等号分割，等号前是要翻译的词或句子，等号后是自定义的翻译结果。传入如:
|
|
240
|
-
|
|
241
|
-
````
|
|
242
|
-
你好=Hello
|
|
243
|
-
世界=ShiJie
|
|
244
|
-
````
|
|
245
|
-
|
|
246
|
-
比如，要自定义 “网市场云建站系统” 、 “国际化” 这两个词有简体中文翻译为英文的结果，可以这么写：
|
|
247
|
-
|
|
248
|
-
````
|
|
249
|
-
translate.nomenclature.append('chinese_simplified','english',`
|
|
250
|
-
网市场云建站系统=wangmarket CMS
|
|
251
|
-
国际化=GuoJiHua
|
|
252
|
-
`);
|
|
253
|
-
````
|
|
254
|
-
|
|
255
|
-
这个自定义术语库的可以单独用一个js文件来定义，如此定义一次，在类似的项目中有使用，可直接将之前定义的js术语库文件复制来引入即可方便使用。
|
|
256
|
-
当前正在优化中，如果原语种是中文、韩文还可以，像是英语结果会不准，如果您项目中用到了，发现异常时，可联系我，免费帮您调试好的同时还能完善本项目。
|
|
257
|
-
**注意，这行要放到 translate.execute(); 上面**
|
|
258
|
-
|
|
259
|
-
##### 示例
|
|
260
|
-
这里给出一个示例用于参考，链接地址： [https://res.zvo.cn/translate/doc/demo_nomenclature.html](https://res.zvo.cn/translate/doc/demo_nomenclature.html)
|
|
261
|
-
您可打开后查看页面源代码，即可看到它是如何设置的。
|
|
262
|
-
|
|
263
|
-
# 实际使用场景示例
|
|
264
|
-
### 普通网站中点击某个语言进行切换
|
|
57
|
+
# 详细使用
|
|
58
|
+
* [设置默认翻译为的语种](http://translate.zvo.cn/41556.html)
|
|
59
|
+
* [自定义翻译术语](http://translate.zvo.cn/41555.html)
|
|
60
|
+
* [翻译完后自动执行](http://translate.zvo.cn/41554.html)
|
|
61
|
+
* [指定翻译服务接口](http://translate.zvo.cn/41553.html)
|
|
62
|
+
* [监控页面动态渲染的文本进行自动翻译](http://translate.zvo.cn/41552.html)
|
|
63
|
+
* [设置本地语种（当前网页的语种）](http://translate.zvo.cn/41551.html)
|
|
64
|
+
* [自动根据用户所在的国家切换其语种](http://translate.zvo.cn/41550.html)
|
|
65
|
+
* [主动进行语言切换](http://translate.zvo.cn/41549.html)
|
|
66
|
+
* [只翻译指定的元素](http://translate.zvo.cn/41548.html)
|
|
67
|
+
* [翻译时忽略指定的id](http://translate.zvo.cn/41547.html)
|
|
68
|
+
* [翻译时忽略指定的class属性](http://translate.zvo.cn/41546.html)
|
|
69
|
+
* [翻译时忽略指定的tag标签](http://translate.zvo.cn/41545.html)
|
|
70
|
+
* [对网页中图片进行翻译](http://translate.zvo.cn/41538.html)
|
|
71
|
+
* [设定切换语言所支持的语种](http://translate.zvo.cn/41544.html)
|
|
72
|
+
* [设定是否自动出现 select 切换语言](http://translate.zvo.cn/41543.html)
|
|
73
|
+
* [CSS美化切换语言按钮](http://translate.zvo.cn/41542.html)
|
|
74
|
+
* [指定切换语言选择框在代码中的位置](http://translate.zvo.cn/41541.html)
|
|
75
|
+
* [对网页中图片进行翻译](http://translate.zvo.cn/41538.html)
|
|
76
|
+
* [鼠标划词翻译](http://translate.zvo.cn/41557.html)
|
|
77
|
+
* [获取当前显示的是什么语种](http://translate.zvo.cn/41761.html)
|
|
78
|
+
* [根据URL传参控制以何种语种显示](http://translate.zvo.cn/41929.html)
|
|
79
|
+
* [离线翻译及自动生成配置](http://translate.zvo.cn/41936.html)
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
# 使用示例
|
|
83
|
+
**普通网站中点击某个语言进行切换**
|
|
265
84
|
如下图所示，网站中的某个位置要有几种语言切换
|
|
266
85
|
|
|
267
86
|
直接在其html代码末尾的位置加入以下代码：
|
|
@@ -277,98 +96,99 @@ translate.nomenclature.append('chinese_simplified','english',`
|
|
|
277
96
|
<!-- 引入多语言切换的js -->
|
|
278
97
|
<script src="https://res.zvo.cn/translate/translate.js"></script>
|
|
279
98
|
<script>
|
|
280
|
-
translate.setUseVersion2(); //设置使用v2.x 版本
|
|
281
99
|
translate.selectLanguageTag.show = false; //不出现的select的选择语言
|
|
282
100
|
translate.execute();
|
|
283
101
|
</script>
|
|
284
102
|
````
|
|
285
103
|
|
|
286
|
-
#
|
|
287
|
-
|
|
288
|
-
|
|
104
|
+
# 谁在使用
|
|
105
|
+
截止 2023.7 月份时，本项目的后端免费翻译服务的请求量就已经达到了 1.5亿次/月 的规模，并且还在非常快速的持续增大，包括一些城投集团像是长沙城投、以及一些政府单位像是环境保障局、企业国际化经营服务平台、海外矿业产业联合、国际潮青联谊年会、人力资源和社会保障局、政务服务网、海外的一些平台如futrom智能住宅、bitheime全球区块链等等都在广泛使用。
|
|
106
|
+
这里给出两个使用比较好的网站作为实际示例参考：
|
|
107
|
+
* [**RICE中国大米展**](https://www.cnrice.com.cn)
|
|
108
|
+
* [**北京长城航空集团红十字会**](https://hh.changhang.org.cn)
|
|
109
|
+
* [**第十一届国际潮青联谊年会组委会**](https://ityc.org.cn)
|
|
289
110
|
|
|
290
|
-
|
|
291
|
-
/*
|
|
292
|
-
是否包含日语，返回true:包含
|
|
293
|
-
参与完善者：陈某人 https://www.chenmouren.com/xxxxx.html
|
|
294
|
-
*/
|
|
295
|
-
japanese:function(str){
|
|
296
|
-
if(/.*[\u0800-\u4e00]+.*$/.test(str)){
|
|
297
|
-
return true
|
|
298
|
-
} else {
|
|
299
|
-
return false;
|
|
300
|
-
}
|
|
301
|
-
},
|
|
111
|
+
另外，很多开源框架及产品也都已将此翻译能力接入了自身系统，赋予自身系统多语言切换能力。比如 [Discuz](https://addon.dismall.com/plugins/domi_translate.html)、[wangmarket CMS](http://www.wang.market/37234.html)、[Layui](https://gitee.com/mail_osc/translate_layui)、[易优CMS](https://www.eyoucms.com/mall/plus/29751.html)、[迅睿CMS](https://www.xunruicms.com/shop/1285.html) 、[Pear Admin](https://gitee.com/pear-admin/Pear-Admin-Layui/tree/i18n/)、[WoShop](https://www.wo-shop.net/cbec/)……
|
|
302
112
|
|
|
303
|
-
|
|
113
|
+
# 哪些能力
|
|
114
|
+
#### 能力一：前端翻译
|
|
115
|
+
加入一个js文件及两行js代码，即可让你现有页面具有几百种语种切换能力。零门槛！详细参见 [translate.js](http://translate.zvo.cn/41162.html)
|
|
116
|
+
#### 能力二：翻译html的能力
|
|
117
|
+
传入html源码，指定要范围为什么语种，能将翻译之后的html源码返回。详细参见 [translate.api](http://translate.zvo.cn/41165.html)
|
|
118
|
+
#### 能力三：整站翻译及独立绑定域名
|
|
119
|
+
将您现有的网站，翻译成全新的小语种网站，可以绑定域名并支持搜索引擎收录和排名。基于现有网站，无需改动源站，翻译全站网页，绑定独立域名，保证搜索收录。
|
|
120
|
+
翻译是基于您现有的网站内容，不需要重新建设多语种网站，只需要解析域名到您私有部署的服务器，就可以完成全站翻译。
|
|
121
|
+
详细参见 [TCDN](http://translate.zvo.cn/41159.html)
|
|
304
122
|
|
|
305
|
-
# 版本
|
|
306
|
-
注意，v1.x 跟 v2.x 使用上略有差别，可使用 ````console.log(translate.version);```` 查看当前使用的版本。
|
|
307
|
-
另外 v1.x 版本的相关说明参见： [使用说明](v1.md) | [在线demo](https://res.zvo.cn/translate/demo_v1.html)
|
|
308
123
|
|
|
309
|
-
|
|
310
|
-
|
|
124
|
+
# 开源仓库目录结构
|
|
125
|
+
* **deploy** - 部署相关，比如shell文件、sql数据库文件等
|
|
126
|
+
* **doc** - 一些文档相关
|
|
127
|
+
* **translate.admin** - [TCDN的管理后台,PC端的WEB管理后台，可以通过此添加翻译的源站、绑定别的域名及设置域名所展现的语言、针对翻译的过程中支持使用JavaScript脚本自定义调优，比如设置哪些不被翻译、设置一些自定义术语库等。并且提供了CDN的基本能力，比如根据URL清除缓存、根据域名清除缓存等。](http://translate.zvo.cn/41163.html)
|
|
128
|
+
* **translate.api** - [翻译开放接口，他不同于 translate service 的点在于 translate service 开放的是文本翻译接口，而 translate api 开放的是html翻译接口，你传入一个网页的url，它返回的是这个网页被翻译之后源码（此特性非常适合对不同语言上SEO优化）](http://translate.zvo.cn/41165.html)
|
|
129
|
+
* **translate.core** - [TCDN的公共模块,无具体功能]
|
|
130
|
+
* **translate.js** - [提供了针对html的分析及翻译能力。在现有的html页面中引入一个js可以快速实现当前页面语种切换的能力。且适配面非常广泛！只要是html的，它都能适配（包含VUE、uniapp等），在很多情况下，它是单独进行使用的，在你的老网站中加入几行js代码即可植入，使其快速具备语种切换能力。](http://translate.zvo.cn/41162.html)
|
|
131
|
+
* **translate.service** - [翻译服务，它对接了 小牛翻译、google翻译、华为云翻译 等翻译服务，如果需要别的翻译服务或者局域网无网环境下部署，也可以快速对接自有翻译接口。它的作用是开放文本翻译接口，将 translate.js中 需要翻译的文本传入，然后将翻译之后的文本输出。提供批量翻译能力（一个翻译请求可以包含数千段需要翻译的文本）。
|
|
132
|
+
并且它开放翻译接口，不止适用于 translate.js，你可以用在任何需要对接翻译接口的地方进行使用。其开放接口，说明参见：http://api.translate.zvo.cn/doc/translate.json.html](http://translate.zvo.cn/41164.html)
|
|
133
|
+
* **translate.user** - [TCDN 对用户开放访问的，当在 translate admin 中添加源站，并绑定域名指向某个语种后，用户访问这个域名时，便会访问进此，有此进行网页翻译的调度、缓存的处理等。当用户第一次访问某个页面时，缓存中没有，会通过 translate api 从源站获取网页源码，然后进行翻译，将翻译之后的html源码在此进行缓存，然后返回给用户浏览器进行显示。 当有用户在此访问这个页面时，便会直接从缓存中取。](http://translate.zvo.cn/41166.html)
|
|
311
134
|
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
1. 可自定义忽略的Tag标签，进行翻译时会忽略之
|
|
315
|
-
2. 可自定义忽略的class，进行翻译时会忽略之
|
|
316
|
-
3. 默认内置 class="ignore" 为忽略的class，可在某个标签上增加此属性，即可使其跳过不进行翻译。
|
|
317
|
-
4. 增加缓存机制，翻译一次后会将结果进行缓存，翻译过后，再查看，会达到秒翻译的结果，极大提高体验度。
|
|
318
|
-
5. 增加局部翻译的能力，可支持自定义翻译的区域。
|
|
319
|
-
6. 优化 input 输入框的 placeholder 的内容不翻译的问题
|
|
320
|
-
7. 优化本地使用（file协议）时无法测试的问题。现在本地也能正常使用及测试了。
|
|
321
|
-
8. 修复翻译时会莫名其妙多了无数层font标签的问题
|
|
322
|
-
9. 修复翻译时，像是中文翻译为韩语，鼠标多经过几次会将其翻译的韩语重复翻译导致翻译结果不准确的问题。
|
|
323
|
-
10. 开放翻译云服务平台接口 http://api.translate.zvo.cn/doc/index.html
|
|
135
|
+
其中每一个都是可以作为一个单独的项目进行使用，比如 translate.service 便可以作为文本翻译接口进行使用、translate.api 可以作为html文件翻译接口使用、translate.js 可以作为网页端直接嵌入几行js代码就能快速翻译来使用。
|
|
136
|
+
另外像是如果你网站已经配置好，不需要在使用 translate.admin 管理后台，你可以将此停掉，从而降低服务器资源的占用。
|
|
324
137
|
|
|
325
|
-
### v2.1
|
|
326
|
-
1. 本地语种时默认赋予使用v2版本翻译
|
|
327
|
-
1. 增加 ````translate.language.connector()```` 对句子的连接符单独进行适配
|
|
328
|
-
1. 增加如果是被 ````<!-- -->```` 注释的区域，不进行翻译
|
|
329
|
-
1. 增加英文 README 文档
|
|
330
|
-
1. 增加对图片alt、meta关键词及描述的翻译
|
|
331
|
-
1. 优化判断本地语种跟要翻译的目标语种是否一样，如果是一样，那就不需要进行任何翻译
|
|
332
|
-
1. 增加 ````translate.listener.start()```` 可对当前页面变化的区域进行自动翻译，比如ajax加载数据后进行渲染
|
|
333
|
-
1. ````translate.execute(...)```` 增加可传入翻译区域，传入的区域只是单纯做一次性翻译，不会影响 ````setDocuments(...)```` 的值
|
|
334
|
-
1. 加入任务队列机制，彻底解决翻译时非常小概率有文字遗漏不翻译的问题。
|
|
335
|
-
1. 增加 ````translate.setAutoDiscriminateLocalLanguage();```` 用户第一次用时，可自动识别其所在国家的语种进行切换
|
|
336
138
|
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
2.
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
9. 增加 translate.language.getLocal() 用户获取当前网页的语种（如果未设置，自动根据网页当前显示的文字进行识别语种）
|
|
346
|
-
10. 增加 translate.selectLanguageTag.selectOnChange 用于提供重写select onchange 事件，以便更好扩展
|
|
347
|
-
11. 优化中英文混合时翻译的一些意外问题
|
|
348
|
-
12. 优化meta - keywords 替换的问题
|
|
349
|
-
13. 优化转英文时如果英文有'，比如 let's 这种的情况
|
|
350
|
-
14. 优化 ignore 对忽略class name有多情况下的判断
|
|
351
|
-
15. 开放后端翻译服务接口文档，以便更好自有扩展及使用
|
|
352
|
-
16. 修复tag有时失效的问题，比如监听状态下局部翻译情况
|
|
139
|
+
# 项目由来
|
|
140
|
+
2021年，translate 翻译服务项目创建，最初为简化Google网页翻译JS进行了封装，可以更简单进行使用，但是因为扩展极其有限，文档也没那么好，于是开始了重构。
|
|
141
|
+
2022年初，完全脱离Google网页翻译JS，从底层判断开始进行了全部重构，推出 2.0 版本，在加载js的资源大小上降低了95%，更快加载，同时内置了多层缓存、多种自定义方式等能力，使用更加灵活、翻译速度更加高效，极大提高了用户使用体验。
|
|
142
|
+
同年，后端翻译服务也完全开源，支持在1核1G服务器进行私有部署，翻译服务内置对接Google翻译服务、华为云机器翻译服务，如果需要别的翻译服务或者局域网无网环境下部署，也可以快速对接自有翻译接口。
|
|
143
|
+
同年年底，我们翻译服务的cdn源 translate.js 的月请求次数超过了一千万次。
|
|
144
|
+
2023年，翻译服务再次迎来大的变化，不仅仅只是对网页使用js来进行翻译，它还增加了翻译内容分发的能力，我们暂且简单将其称之为TCDN，它具备了CDN内容分发的一些能力，比如可以通过后台添加一个源站，然后绑定不同的域名，可以设置每个域名对应着源站的哪种语言，这样访问时打开的就直接是翻译后的网页，如果查看网页源代码，会发现html源码本身就是已经被翻译过的，不在局限于js端进行翻译，而是通过服务端主动进行翻译，并进行缓存，用户访问请求时，直接将翻译结果输出给用户展示，极大提高了用户使用体验、每种语种也都可以在相应国家搜索引擎收录、并且系统因具备CDN的基本能力，如果网站有更新，还可以通过后台快速更新源站或者访问目标站点、或者指定访问url的网页翻译缓存。
|
|
145
|
+
同样的能力，我们发现友商收费标注是一个站点20种翻译语种的情况是一万二每年，而我们这个支持七八十种语种（取决于 translaet.service 后端对接的翻译服务支持的语种数量），一台服务器可承载数千个源站提供服务！
|
|
146
|
+
至2023年中旬，我们公开的翻译服务 translate.service 月请求量已达到1.5亿次！并再以非常恐怖的速度在增长。
|
|
353
147
|
|
|
354
|
-
# 这些开源项目正在使用
|
|
355
|
-
如下开源项目中已置入自动化翻译的能力：
|
|
356
|
-
[kefu.js](https://gitee.com/mail_osc/kefu.js) H5在线客服，引入一行js代码拿来即用！支持手机、电脑、APP、小程序。可一键部署自己私有SAAS云客服平台
|
|
357
|
-
[Pear Admin Layui](https://gitee.com/pear-admin/Pear-Admin-Layui) Pear Admin 是一款开箱即用的前端开发模板，扩展Layui原生UI样式，整合第三方开源组件，提供便捷快速的开发方式，延续LayuiAdmin
|
|
358
|
-
[Layui](https://gitee.com/mail_osc/translate_layui) 翻译组件
|
|
359
|
-
...
|
|
360
148
|
|
|
361
149
|
# 优秀开源项目及社区推荐
|
|
362
|
-
[Featbit](https://github.com/featbit/featbit) 一个100%开源的 Feature flags / Feature Management 平台工具
|
|
363
|
-
[LinkWeChat](https://gitee.com/LinkWeChat/link-wechat) LinkWeChat 是基于企业微信的开源 SCRM 系统，是企业私域流量管理与营销的综合解决方案。
|
|
364
|
-
[IoTSharp](https://gitee.com/IoTSharp) IoTSharp 是一个 基于.Net Core 开源的物联网基础平台， 支持 HTTP、MQTT 、CoAp 协议
|
|
365
|
-
[流之云](https://gitee.com/ntdgg) 信息化、数字化服务提供商
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
#
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
150
|
+
[Featbit](https://github.com/featbit/featbit) 一个100%开源的 Feature flags / Feature Management 平台工具
|
|
151
|
+
[LinkWeChat](https://gitee.com/LinkWeChat/link-wechat) LinkWeChat 是基于企业微信的开源 SCRM 系统，是企业私域流量管理与营销的综合解决方案。
|
|
152
|
+
[IoTSharp](https://gitee.com/IoTSharp) IoTSharp 是一个 基于.Net Core 开源的物联网基础平台， 支持 HTTP、MQTT 、CoAp 协议
|
|
153
|
+
[流之云](https://gitee.com/ntdgg) 信息化、数字化服务提供商
|
|
154
|
+
|
|
155
|
+
|
|
156
|
+
# 我的其他开源项目
|
|
157
|
+
|
|
158
|
+
这里列出了我部分开源项目：
|
|
159
|
+
|
|
160
|
+
| 开源项目 | star数量 | 仓库 |
|
|
161
|
+
| --- | --- | --- |
|
|
162
|
+
| 可私有部署 SAAS 建站系统 |  | https://gitee.com/mail_osc/wangmarket |
|
|
163
|
+
| Datax 的 华为云OBS 插件 |  | https://gitee.com/HuaweiCloudDeveloper/obs-datax-plugins |
|
|
164
|
+
| 扒网站工具 |  | https://gitee.com/mail_osc/templatespider |
|
|
165
|
+
| 文件上传工具类，OBS存储 |  | https://gitee.com/mail_osc/FileUpload |
|
|
166
|
+
| 智能客服机器人 |  | https://gitee.com/leimingyun/chatbot |
|
|
167
|
+
| 结合云存储做网站无需服务器 |  | [huaweicloud-obs-website-wangmarket-cms](https://gitee.com/HuaweiCloudDeveloper/huaweicloud-obs-website-wangmarket-cms) |
|
|
168
|
+
| kefu.js 在线聊天的前端 |  | https://gitee.com/mail_osc/kefu.js |
|
|
169
|
+
| 轻量级js消息提醒组件 |  | https://gitee.com/mail_osc/msg |
|
|
170
|
+
| js 实现 html 全自动翻译 |  | https://gitee.com/mail_osc/translate |
|
|
171
|
+
| 代码生成器，自动写代码 |  | https://gitee.com/mail_osc/writecode |
|
|
172
|
+
| Java日志存储及读取 |  | https://gitee.com/mail_osc/log |
|
|
173
|
+
| Layui的国际化支持组件 |  | https://gitee.com/mail_osc/translate_layui |
|
|
174
|
+
| Java8轻量级http请求类 |  | https://gitee.com/mail_osc/http.java |
|
|
175
|
+
| Java版按键精灵，游戏辅助开发 |  | https://gitee.com/mail_osc/xnx3 |
|
|
176
|
+
| js的WebSocket框架封装 |  | https://gitee.com/mail_osc/websocket.js |
|
|
177
|
+
| js邮件发送模块 |  | https://gitee.com/mail_osc/email.java |
|
|
178
|
+
| WEB 端浏览器通知提醒工具类 |  | https://gitee.com/mail_osc/notification.js |
|
|
179
|
+
| JS中文转拼音工具类 |  | https://gitee.com/mail_osc/pinyin.js |
|
|
180
|
+
| Java-微信常用工具类 |  | https://gitee.com/mail_osc/xnx3_weixin |
|
|
181
|
+
| QQ寻仙的游戏辅助软件 |  | https://gitee.com/mail_osc/xunxian |
|
|
182
|
+
| 私有化部署 SAAS商城 |  | https://gitee.com/leimingyun/wangmarket_shop |
|
|
183
|
+
| Java开发框架及规章约束 |  | https://gitee.com/leimingyun/wm |
|
|
184
|
+
| SAAS客服系统 |  | https://gitee.com/leimingyun/yunkefu |
|
|
185
|
+
| 根据标准的 JavaDoc 生成接口文档 |  | https://gitee.com/leimingyun/javadoc |
|
|
186
|
+
| 用sql方式使用Elasticsearch |  | https://gitee.com/leimingyun/elasticsearch |
|
|
187
|
+
| Java应用全自动部署及更新 |  | https://gitee.com/leimingyun/sftp-ssh-autopublish |
|
|
188
|
+
| 智能聊天机器人 |  | https://gitee.com/leimingyun/aichat |
|
|
189
|
+
| 自动备份文件到华为云 OBS |  | https://gitee.com/leimingyun/yunbackups |
|
|
190
|
+
| Java打印及预览的工具类 |  | https://gitee.com/leimingyun/printJframe |
|
|
191
|
+
…………
|
|
372
192
|
|
|
373
193
|
# 交流
|
|
374
194
|
如果您在使用过程中遇到任何异常情况，请详细说一下您遇到的问题。如果可以，请写下您的网站，以便我们可以更全面地测试，以便快速找到问题所在
|
|
@@ -377,5 +197,3 @@ japanese:function(str){
|
|
|
377
197
|
github: [https://github.com/xnx3/translate](https://github.com/xnx3/translate)
|
|
378
198
|
gitee: [https://gitee.com/mail_osc/translate](https://gitee.com/mail_osc/translate)
|
|
379
199
|
|
|
380
|
-
# 高级服务
|
|
381
|
-
[当前translate.js是基于js来对当前html进行翻译，绝大多数场景足够使用。但如果你查看页面源代码，会发现源代码并不会变，处于未翻译状态。如果你想针对页面源代码本身直接进行翻译，可以点此查阅我们这个扩展版本](README_SERVICE.md)
|