/translate

Two lines of js realize automatic html translation. No need to change the page, no language configuration file, no API key, SEO friendly!

Primary LanguageJavaScriptApache License 2.0Apache-2.0

translate.js

两行js实现html全自动翻译。
无需改动页面、无语言配置文件、无API Key、对SEO友好!

特性说明

在线体验

http://res.zvo.cn/translate/demo.html

测试效果

先拿别人的网站动手试试效果 效果

  1. 随便打开一个网页
  2. 右键 - 审查元素
  3. 粘贴入以下代码:
    var head= document.getElementsByTagName('head')[0]; var script= document.createElement('script'); script.type= 'text/javascript'; script.src= 'https://res.zvo.cn/translate/inspector_v2.js'; head.appendChild(script);
  4. Enter 回车键 , 执行
  5. 在当前网页的左上角,就出现了一个大大的切换语言,切换试试看。

快速使用

在网页最末尾, </html> 之前,加入以下代码,一般在页面的最底部就出现了选择语言的 select 切换标签。 其实就这么简单:

<script src="https://cdn.staticfile.net/translate.js/3.2.1/translate.js"></script>
<script>
translate.language.setLocal('chinese_simplified'); //设置本地语种(当前网页的语种)。如果不设置,默认自动识别当前网页显示文字的语种。 可填写如 'english'、'chinese_simplified' 等,具体参见文档下方关于此的说明。
translate.service.use('client.edge'); //设置机器翻译服务通道,直接客户端本身,不依赖服务端 。相关说明参考 http://translate.zvo.cn/43086.html
translate.execute();//进行翻译 
</script>

详细使用

使用示例

普通网站中点击某个语言进行切换 如下图所示,网站中的某个位置要有几种语言切换

直接在其html代码末尾的位置加入以下代码:

<!-- 增加某种语言切换的按钮。注意 ul上加了一个 class="ignore" 代表这块代码不会被翻译到 -->
<ul class="ignore">
	<li><a href="javascript:translate.changeLanguage('english');">English</a></li>|
	<li><a href="javascript:translate.changeLanguage('chinese_simplified');">简体中文</a></li>|
	<li><a href="javascript:translate.changeLanguage('chinese_traditional');">繁體中文</a></li>
</ul>

<!-- 引入多语言切换的js -->
<script src="https://cdn.staticfile.net/translate.js/3.2.1/translate.js"></script>
<script>
	translate.selectLanguageTag.show = false; //不出现的select的选择语言
    translate.service.use('client.edge'); //设置机器翻译服务通道
	translate.execute();
</script>

谁在使用

截止 2023.7 月份时,本项目的后端免费翻译服务的请求量就已经达到了 1.5亿次/月 的规模,并且还在非常快速的持续增大,包括一些城投集团像是长沙城投、以及一些政府单位像是环境保障局、企业国际化经营服务平台、海外矿业产业联合、国际潮青联谊年会、人力资源和社会保障局、政务服务网、海外的一些平台如futrom智能住宅、bitheime全球区块链等等都在广泛使用。 这里给出两个使用比较好的网站作为实际示例参考:

另外,很多开源框架及产品也都已将此翻译能力接入了自身系统,赋予自身系统多语言切换能力。

这些开源产品已内置本多语言能力

哪些能力

能力一:前端翻译

加入一个js文件及两行js代码,即可让你现有页面具有几百种语种切换能力。零门槛!详细参见 translate.js

能力二:翻译html的能力

传入html源码,指定要范围为什么语种,能将翻译之后的html源码返回。详细参见 translate.api

能力三:整站翻译及独立绑定域名

将您现有的网站,翻译成全新的小语种网站,可以绑定域名并支持搜索引擎收录和排名。基于现有网站,无需改动源站,翻译全站网页,绑定独立域名,保证搜索收录。 翻译是基于您现有的网站内容,不需要重新建设多语种网站,只需要解析域名到您私有部署的服务器,就可以完成全站翻译。 详细参见 TCDN

开源仓库目录结构

其中每一个都是可以作为一个单独的项目进行使用,比如 translate.service 便可以作为文本翻译接口进行使用、translate.api 可以作为html文件翻译接口使用、translate.js 可以作为网页端直接嵌入几行js代码就能快速翻译来使用。 另外像是如果你网站已经配置好,不需要在使用 translate.admin 管理后台,你可以将此停掉,从而降低服务器资源的占用。

项目由来

2021年,translate 翻译服务项目创建,最初为简化Google网页翻译JS进行了封装,可以更简单进行使用,但是因为扩展极其有限,文档也没那么好,于是开始了重构。
2022年初,完全脱离Google网页翻译JS,从底层判断开始进行了全部重构,推出 2.0 版本,在加载js的资源大小上降低了95%,更快加载,同时内置了多层缓存、多种自定义方式等能力,使用更加灵活、翻译速度更加高效,极大提高了用户使用体验。
同年,后端翻译服务也完全开源,支持在1核1G服务器进行私有部署,翻译服务内置对接Google翻译服务、华为云机器翻译服务,如果需要别的翻译服务或者局域网无网环境下部署,也可以快速对接自有翻译接口。
同年年底,我们翻译服务的cdn源 translate.js 的月请求次数超过了一千万次。
2023年,翻译服务再次迎来大的变化,不仅仅只是对网页使用js来进行翻译,它还增加了翻译内容分发的能力,我们暂且简单将其称之为TCDN,它具备了CDN内容分发的一些能力,比如可以通过后台添加一个源站,然后绑定不同的域名,可以设置每个域名对应着源站的哪种语言,这样访问时打开的就直接是翻译后的网页,如果查看网页源代码,会发现html源码本身就是已经被翻译过的,不在局限于js端进行翻译,而是通过服务端主动进行翻译,并进行缓存,用户访问请求时,直接将翻译结果输出给用户展示,极大提高了用户使用体验、每种语种也都可以在相应国家搜索引擎收录、并且系统因具备CDN的基本能力,如果网站有更新,还可以通过后台快速更新源站或者访问目标站点、或者指定访问url的网页翻译缓存。
同样的能力,我们发现友商收费标注是一个站点20种翻译语种的情况是一万二每年,而我们这个支持七八十种语种(取决于 translaet.service 后端对接的翻译服务支持的语种数量),一台服务器可承载数千个源站提供服务!
至2023年中旬,我们公开的翻译服务 translate.service 月请求量已达到1.5亿次!并再以非常恐怖的速度在增长。

结构图示

优秀开源项目及社区推荐

Featbit 一个100%开源的 Feature flags / Feature Management 平台工具
LinkWeChat LinkWeChat 是基于企业微信的开源 SCRM 系统,是企业私域流量管理与营销的综合解决方案。
IoTSharp IoTSharp 是一个 基于.Net Core 开源的物联网基础平台, 支持 HTTP、MQTT 、CoAp 协议
流之云 信息化、数字化服务提供商

我的其他开源项目

开源项目 star数量 仓库
可私有部署 SAAS 建站系统 https://gitee.com/mail_osc/wangmarket
Datax 的 华为云OBS 插件 https://gitee.com/HuaweiCloudDeveloper/obs-datax-plugins
扒网站工具 https://gitee.com/mail_osc/templatespider
文件上传工具类,OBS存储 https://gitee.com/mail_osc/FileUpload
智能客服机器人 https://gitee.com/leimingyun/chatbot
结合云存储做网站无需服务器 huaweicloud-obs-website-wangmarket-cms
kefu.js 在线聊天的前端 https://gitee.com/mail_osc/kefu.js
轻量级js消息提醒组件 https://gitee.com/mail_osc/msg
js 实现 html 全自动翻译 https://gitee.com/mail_osc/translate
代码生成器,自动写代码 https://gitee.com/mail_osc/writecode
Java日志存储及读取 https://gitee.com/mail_osc/log
Layui的国际化支持组件 https://gitee.com/mail_osc/translate_layui
Java8轻量级http请求类 https://gitee.com/mail_osc/http.java
Java版按键精灵,游戏辅助开发 https://gitee.com/mail_osc/xnx3
js的WebSocket框架封装 https://gitee.com/mail_osc/websocket.js
js邮件发送模块 https://gitee.com/mail_osc/email.java
WEB 端浏览器通知提醒工具类 https://gitee.com/mail_osc/notification.js
JS中文转拼音工具类 https://gitee.com/mail_osc/pinyin.js
Java-微信常用工具类 https://gitee.com/mail_osc/xnx3_weixin
QQ寻仙的游戏辅助软件 https://gitee.com/mail_osc/xunxian
私有化部署 SAAS商城 https://gitee.com/leimingyun/wangmarket_shop
Java开发框架及规章约束 https://gitee.com/leimingyun/wm
SAAS客服系统 https://gitee.com/leimingyun/yunkefu
根据标准的 JavaDoc 生成接口文档 https://gitee.com/leimingyun/javadoc
用sql方式使用Elasticsearch https://gitee.com/leimingyun/elasticsearch
Java应用全自动部署及更新 https://gitee.com/leimingyun/sftp-ssh-autopublish
智能聊天机器人 https://gitee.com/leimingyun/aichat
自动备份文件到华为云 OBS https://gitee.com/leimingyun/yunbackups
Java打印及预览的工具类 https://gitee.com/leimingyun/printJframe
…………

交流

如果您在使用过程中遇到任何异常情况,请详细说一下您遇到的问题。如果可以,请写下您的网站,以便我们可以更全面地测试,以便快速找到问题所在
作者微信:xnx3com(使用交流可加QQ群进行,我看微信很不及时)
Telegram : untran
交流QQ群:181781514 (已满)
交流QQ群:641047127
微信公众号:wangmarket
github: https://github.com/xnx3/translate
gitee: https://gitee.com/mail_osc/translate

有偿帮助

我们位于三线城市,各方面开发成本相对较低,如果您有临时需要技术人员帮助,欢迎联系我们,也算对我们的支持,让我们能持续下去。

  • Java开发,5年以上经验,65元每小时
  • Java开发,半年经验(主要处理琐碎杂事),25元每小时
  • 前端开发,3年经验(vue、uniapp、微信小程序等都可以),50元每小时
  • Android开发,7年经验,65元每小时

另外,如果有别编程语言的需要,也可以喊我,我微信 xnx3com 价格绝对实在,诚信第一,不满意不要钱!!

感谢赞助

  • 指点云 赞助服务器,用于开放公共、免费API给大家使用。指点云服务器便宜,性能很不错。
  • AO3读者们,赞助美国服务器,部署全球网络加速节点
  • 微软 提供 client.edge 方式的翻译通道
  • 小牛翻译 赞助在线翻译接口,小牛翻译提供三百八十多种语种翻译能力,需要的语种,它基本都包含了!
  • 如果您想参与赞助,可点此查看更多,如果有没列出来的,您感觉可以对本项目有帮助的,也欢迎联系我的,感谢大家的支持