-
2019-06-30 16:12:25
一个超级棒的 Chrome 翻译插件一个超级棒的 Chrome 翻译插件
最近非常的忙,也很累,通过最近的分享大家也看出来了,没有太多的长文,但是其实篇篇都是短小精悍的总结。有时候,价值不在于文章的长短,而在于内容的实用和精辟。
今天一样,上午很忙,我们公司实用的腾讯云对象存储服务挂了,原因竟然是腾讯云官方的域名 SSL 证书到期,竟然不知道。可害苦了我。当然,这也给我一个教训,那就是使用对象存储的时候,域名换成自己的,官方的不一定靠谱。
最近很忙,很累,所以,下午我就整整睡了一下午,一直睡到了天黑。压力山大,也再次说明了一个道理,没事千万别创业。
好了,不吐槽了,进入今天的主题。今天给大家分享一个我一直以来使用的非常方便的一款翻译插件。关注我时间长的读者应该都知道,我这个人是一个 Chrome 浏览器的爱好者,特别喜欢使用各种插件,因为插件实在太方便了,能够提高我们的工作,学习的效率。我之前,也分享过很多 Chrome 浏览器上的插件。
今天给大家推荐的这款插件是:ImTranslator,它到底有多好用呢?可能个人习惯的问题,有道词典,以及有道的插件我总是用不习惯,不是特别喜欢。但是这个插件我用的非常的顺手和舒服。
这个插件支持 90 多种语言互译,译文不仅可以嵌入在原网页中,还可以悬浮弹出在新窗口中,方便编辑,调整,还支持语音。不仅如此,它支持多种服务翻译提供商的翻译,来自于 Google 翻译,Microsoft 翻译,还有 Yandex 翻译。你感觉谷歌翻译的不准,你可以便捷的切换到微软翻译,看看它翻译和谷歌翻译的有什么区别,可以有效解决,一种翻译让你看不懂的问题。这个插件还有保存你的翻译历史记录的功能。
一个超级棒的 Chrome 翻译插件一个超级棒的 Chrome 翻译插件
在浏览器中使用,真的不是一般的方便。强烈推荐给我们程序员使用。尤其是英文差的程序员,想提升自己能力,想看国外开发文档,想看国外技术文章的。
对于程序员来讲,想接触到第一手的开发资料,想第一时间在 GitHub 上和 StackOverflow 上看懂别人的提问和解决办法,这个插件,真的你值得拥有。
这可是我珍藏多年的,感觉用的非常顺手,非常实用的插件。不知道关注我的读者,有没有也在用的呢?没有的,建议安装一个试试,对于我们程序员经常看英文技术文档的,真的很有用。更多相关内容 -
chrome一键翻译插件
2018-05-02 08:58:46chrome一键翻译插件chrome一键翻译插件chrome一键翻译插件chrome一键翻译插件 -
自定义一个Chrome翻译插件
2020-06-30 17:21:02网上的翻译插件有很多,但是这里是自己来定制一款属于自己的chrome翻译插件。 1.了解chrome插件开发 不了解的同学可以先看看下面的资料 Chrome插件官方文档主页 【干货】Chrome插件(扩展)开发全攻略 2.插件的结构 当...做为一名程序员,难免要和各种英文文档打交道。然而大部分程序员的英文水平,只能用一个字来形容,那就是烂。我深知自己英语水平低下,需要一款翻译插件来治疗一下。网上的翻译插件有很多,但是这里是自己来定制一款属于自己的chrome翻译插件。
1.了解chrome插件开发
不了解的同学可以先看看下面的资料
2.插件的结构
当你了解了chrome基本开发了,下面就这就直接撸代码了。插件的目录结构
2.1 manifest.json
这是一个Chrome插件最重要也是必不可少的文件,用来配置所有和插件相关的配置,必须放在根目录。其中,
manifest_version
、name
、version
3个是必不可少的,description
和icons
是推荐的。{ "name": "自定义翻译插件", "version": "1.0", "description": "百度翻译插件简化版", //图标信息 "icons": { "16": "imgs/icon16.png", "32": "imgs/icon32.png", "48": "imgs/icon48.png", "128": "imgs/icon128.png" }, "manifest_version": 2, //拥有的权限 "permissions": [ "*://*/*", "activeTab", "tabs", "contextMenus", "webRequest", "webRequestBlocking", "storage" ], //浏览器右上角插件设置,browser_action、page_action、app必须三选一 "browser_action": { "default_icon": "imgs/icon32.png", "default_popup": "popup.html" }, //会一直常驻的后台JS或后台页面 "background": { "page": "background.html" }, // 需要注入到目标页面的JS "content_scripts": [ { "js": [ "js/lib/jquery-1.11.3.min.js",//context.js需要用到jq所以这里也把jq注入到目标页面中 "js/context.js" ], //注入的页面 "matches": [ "https://*/*", "http://*/*" ], "run_at": "document_end" } ], //普通页面能够直接访问的插件资源列表,如果不设置是无法直接访问的 "web_accessible_resources": [ "imgs/*.png", "imgs/*.gif" ] }
2.2 background.html
对应manifest.json background配置,是一个常驻的页面,它的生命周期是插件中所有类型页面中最长的,它随着浏览器的打开而打开,随着浏览器的关闭而关闭,所以通常把需要一直运行的、启动就运行的、全局的代码放在background里面。
<html><head></head><body> <script src="js/lib/jquery-1.11.3.min.js"></script> <script src="js/lib/md5.js"></script> <script src="js/background.js"></script> </body></html>
有于background.js需要用到jquery和md5所以把它们引入进来。background.js 代码如下
这个代码就是注册了一个chrome插件的一个onRequest监听器,当插件的background监听到请求时就会调用下面的代码,这里会发起一个ajax请求(请求的是百度翻译的api,可以去百度的翻译插件中找到_),获取到返回数据后,将data数据回调出去
chrome.extension.onRequest.addListener(function (request, sender, sendResponse) { console.log('request', request); console.log('sender', sender); if (request.action == 'trans') { //请求的action为trans时 .... $.ajax({ url: 'http://api.fanyi.baidu.com/api/trans/vip/translate', method: 'GET', data: { ... }, asyne: true }).done(function (data) { //调用请求着的回调方法,将数据返回回去 sendResponse({ data: data }); }); }else { //todo } });
2.3 popup.html
这页面就是我们在manifest.json配置的browser_action页面,点击
browser_action
或者page_action
图标时打开的一个小窗口网页,焦点离开网页就立即关闭,一般用来做一些临时性的交互。这个插件的这个页面很简单,一个按钮,点击后翻译。
<!DOCTYPE html> ... <body style="width: 400px;"> <h4>输入需要翻译的</h4> <table> <tr style="width: 300px;"> <td> <textarea rows="7" id="query" class="form-control" placeholder="请输入需要翻译的" required></textarea></td> <td><input id="btnTrans" type="button" value="翻译" /></td> <td><td> <textarea rows="7" id="result" class="form-control" placeholder="" required></textarea></td></td> </tr> </table> <script type="text/javascript" charset="utf-8" src="./js/popup.js"></script>
对应的事件逻辑在popup.js中,主要就是如下逻辑
//1.获取btnTrans按钮 var btnBuildTest = document.getElementById("btnTrans"); //2.绑定点击事件,发送请求 btnBuildTest.onclick = function () { var word = document.getElementById("query").value if(word){ //3.先插件后台 background 发起其一个请求,background接收到请求后会返回数据 chrome.extension.sendRequest({ action: "trans", word: word }, function(f) { if(f.data&&f.data.trans_result){ //4.将翻译结果显示在result中 document.getElementById("result").value = f.data.trans_result[0].dst } }); } }
2.4 context.js
这个就是要注入到我们需要应用到页面上的js脚本,对应mainset.js 中的 content_scripts
所谓content-scripts,其实就是Chrome插件中向页面注入脚本的一种形式(虽然名为script,其实还可以包括css的),借助
content-scripts
我们可以实现通过配置的方式轻松向指定页面注入JS和CSS(如果需要动态注入,可以参考下文),最常见的比如:广告屏蔽、页面CSS定制,等等。这个脚本在我们需要注入的目标页面打开时,会自动注入
context.js 它实现了划词翻译的功能,这里我就直接把百度翻译的轮子直接拿来用了,做了一些简化,加了一个朗读的功能,方便英语学习。主要有如下功能
1.注册鼠标弹起事件,获取划词内容
2.动态创建翻译按钮,注册点击事件
3.点击发球翻译请求,动态创建翻译结果页面
具体效果如下
3.插件运行流程图
源码地址
-
camel-case-translation:一款支持驼峰命名法,下划线,中划线的chrome翻译插件
2021-03-28 09:54:49驼峰翻译 这是什么 一个基于Chrome的翻译插件 有什么功能 发布翻译 多语言支持 划词翻译 暗示 驼峰识别 下划线识别 中划线识别 -
谷歌浏览器chrome翻译插件完美解决开发者模式插件问题
2020-02-18 16:29:10Chrome浏览器之所以让很多人喜欢,是因为它安全、速度快,更重的是它拥有丰富的扩展程序。让普通的浏览器也变得更友好方便。 完美解决谷歌浏览器开发者模式插件弹窗问题 当你在使用一些非谷歌商店认证过的...Chrome浏览器之所以让很多人喜欢,是因为它安全、速度快,更重的是它拥有丰富的扩展程序。让普通的浏览器也变得更友好方便。
完美解决谷歌浏览器开发者模式插件弹窗问题
当你在使用一些非谷歌商店认证过的插件、破解过的插件,或者直接使用开发者模式加载的扩展程序。往往会出现上面的问题,一打开浏览器就弹出"停用以开发者模式运行的扩展程序"。很让人烦恼~
在谷歌浏览器V.75版本之前网上有很多的方法都可以解决这个问题,但是在75版本之后网上的方法几乎全部失效了。但今天小帮就给大家分享两种可以完美解决谷歌浏览器开发者模式警告弹窗问题。
完美解决谷歌浏览器开发者模式插件弹窗问题
方法一:火绒拦截法
如果你在使用火绒安全,那么你可以直接使用火绒安全自带的窗口拦截功能,将浏览器弹窗进行拦截关闭。
完美解决谷歌浏览器开发者模式插件弹窗问题
当谷歌浏览器出现插件弹窗时,我们打开火绒安全的弹窗拦截-添加拦截-截图拦截-选择插件弹窗-拦截方式选择"关闭窗口"。
完美解决谷歌浏览器开发者模式插件弹窗问题
如果你的电脑中没有火绒安全这个工具,请使用这个方法,这个方法也更加完美。你只需要在谷歌Chrome浏览器的安装根目录添加一个DLL文件即可。
完美解决谷歌浏览器开发者模式插件弹窗问题
这个dll文件出自shuax博客作者,为了保证安全性,我在腾讯哈勃提交了文件检测。(这里提醒一下遇到未知软件大家不妨也去自己查查)
完美解决谷歌浏览器开发者模式插件弹窗问题
总结:两种方法都可以解决插件弹窗问题,火绒拦截的方法插件需要几秒的加载才可以使用,有一定的延迟。第二种方法可以完美解决此问题。两种方法均使用版本 75.0.3770.100(正式版本) 进行测试。
-
chrome Google 翻译 2.0.7 插件 .crx
2017-11-10 14:25:10浏览网页时可轻松查看翻译版本。由Google翻译小组提供。 -
(超赞的Chrome翻译插件)沙拉查词-聚合词典划词翻译
2020-02-05 19:16:17一款优秀的翻译软件/插件,能够博采众长,同时集成有道、google翻译等翻译软件,方便自己快速对比各种翻译,得到最合适的答案使用需求
日常使用Chrome浏览器的过程中,常常在有道和google翻译之间来回切换,觉得google翻译比较流畅,但是有道翻译对于一些术语的翻译又比较好……来回折腾可真是麻烦
所以一直想找一款更优秀的翻译软件/插件,能够博采众长,同时集成有道、google翻译等翻译软件,方便自己快速对比各种翻译,得到最合适的答案
最后我找到了这款神一般的Chrome浏览器插件:沙拉查词-聚合词典划词翻译 (Saladict)
为什么说Ta好用呢?看看几个使用场景就知道啦~
- 优点1
随便下载一篇PDF论文,发现!哇!居然自带PDF阅读器,而且还挺好看!(PDF.js,完美替代Chrome默认的PDF浏览页面) - 优点2
可以设置为学术模式,多个翻译
选中一段话,点击翻译:
点击单词:可以免费查超多词典~
简直了,效果超赞!还可以搭配Anki使用哦
- 优点3:众多小功能等你探索!
有时候想要把网页发给手机……这时候往往很尴尬……要先打开微信,把链接丢过去,然后在微信打开,再转发……十分不方便
沙拉查词直接集成了当前页面二维码功能,只需要点击拓展工具中的沙拉查词图标,再点击左下角,即可:
一步到位,这就很方便了啊!赶紧下载安装吧hhhh
相关链接
- 优点1
-
百度翻译chrome的插件
2015-10-20 19:43:15百度翻译chrome的插件 非常棒 提供即时免费的中、英、日、韩、法、俄、西班牙文全文翻译、网页翻译服务。是一项免费的在线翻译服务,提供高质量中文、英语、日语、韩语、西班牙语、泰语、法语、阿拉伯语、葡萄牙语、... -
ubuntu20.04中安装划词翻译_Chrome翻译插件【沙拉查词】&【彩云小译】
2020-11-11 08:27:15【沙拉查词】—— 聚合划词翻译、PDF文档划词翻译【彩云小译】主打的是网页翻译,相比其他的网页翻译插件,其优势在于,网页是同时显示英文和中文的,这样对于某些翻译不通顺的地方,也可以自己快速对照原文理解。... -
chrome谷歌浏览器翻译插件
2018-08-04 11:38:55在使用chrome阅读网页的时候,经常会遇到一些陌生的外文单词或者语句不熟悉,如果打开外部的翻译软件进行翻译就太麻烦了,今天给大家推荐一款直接在chrome中直接翻译的谷歌浏览器插件,支持划词翻译,支持多种多种... -
Chrome划词翻译插件
2018-12-18 16:34:02Chrome浏览器插件,有道词典划词翻译压缩包,可直接置入到Chrome浏览器中使用 -
Google翻译Chrome插件
2021-04-17 22:13:36Chrome插件-Google翻译Google翻译的概述google翻译插件的使用方法1.google翻译插件的下载2.google翻译插件的安装3.google翻译插件的设置方法和使用说明google翻译插件注意事项 Google翻译的概述 Google翻译是一款由... -
小球翻译插件-chrome内核浏览器自动翻译插件
2019-08-10 10:51:41这是一款基于chrome内核浏览器的翻译插件,增强功能,支持自动翻译国外网页,支持多语种自动检测并翻译,本插件在360安全浏览器和Google chrome浏览器中测试完美运行。值得一提的是,本插件源自百度翻译,稍做了修改... -
Edge Translate 侧边翻译 | 谷歌(Chrome)浏览器插件
2021-03-03 17:07:43侧边翻译是一个简单实用的翻译插件,支持Chrome浏览器、火狐浏览器、360安全浏览器等主流浏览器。我们开发它的主要目的是辅助用户阅读外文文献。为此,我们一直遵循着用户阅读体验第一的原则,并做出了大量的努力!... -
解决安装Chrome翻译插件总是报CRX_HEADER_INVALID
2019-11-13 09:27:21解决安装Chrome翻译插件总是报CRX_HEADER_INVALID 解决方案: 将下载的*.crx的后缀名修改成 *.zip 将文件解压,解压目录如下 在chrome://extensions/ 中点击加载已解压的扩展程序 找到 解压文件 的路径 ... -
chrome浏览器安装右键翻译插件
2021-07-12 10:56:23平常打开网页查看相关文章的时候,遇到一些不会的因为单词,可能第一反应是复制英文单词到百度翻译里面,下面为介绍一种直接右键选中英文单词,实现在线翻译的插件。 这边用到的是“划词翻译”插件,安装步骤如下: ... -
chrome 有道智能翻译 2.0 插件 .crx
2017-11-10 14:22:29瀑布IM 制作的有道翻译插件,不管是否是 HTTPS 页面都能快速翻译,还能划词翻译哦 ;) -
chrome插件之网页翻译插件
2019-07-02 20:17:01今天给大家推荐谷歌浏览器翻译插件。虽然百度进来很不平静,也深受广大群众吐槽,但是百度的许多应用还是很良心的。 对于程序员来说,我们会经常阅读英文网站,比如这样的,安装完插件就会出现翻译弹框。 chrome插件... -
Chrome去广告翻译插件
2018-04-24 22:57:12谷歌浏览器插件,包含有去广告和翻译2个插件.非常实用哦 -
“手把手”教你开发一个多语言翻译chrome插件
2021-05-25 06:54:08多语言互译chrome插件最近逛掘金看了下,前端必备技能项竟然有“chrome插件开发”,想想了自己的英语功力(开机自启动"有道翻译"~哈哈哈),于是,话不多说开工,整一个“翻译chrome插件”功能点: 用户可选择语言... -
Chrome 常用翻译/Github工具/提高工作、生产效率插件
2020-05-07 16:39:15翻译工具 沙拉查词 词典丰富,自定义排序。 多语种支持,触摸查词,体验感好。 英语 日语(推荐首选沪江小 D 词典,国内最好的日语词典,但不是全能) 翻译侠 截屏翻译,独树一帜。 英语(对英语支持较好,对... -
chrome浏览器无法安装crx插件的解决方法(以翻译插件为例)
2022-04-08 16:57:23目录 一、资源获取 二、具体步骤 一、资源获取 chrome翻译插件放我网盘里了。 链接:https://pan.baidu.com/s/17tc29MieYkO5QgClmWyTXAhttps://pan.baidu.com/s/17tc29MieYkO5QgClmWyTXA 提取码:wubd 二、具体步骤 ... -
Github-zh:一个将 GitHub 翻译成中文的 Chrome 插件
2021-05-31 05:02:53Github-zh 一个将 GitHub 翻译成中文的 Chrome 插件。 -
达达划词翻译 | 谷歌(Chrome)浏览器插件
2021-03-03 16:58:53热门 工具 办公效率 Chrome插件 【插件安装教程】 请下载文件后先解压,然后进入页面: chrome://extensions/ 将文件拖拽到该页面,完成安装。 具体步骤: https://t.csdnimg.cn/NxMv 【热门插件】 ·CSDN ... -
谷歌浏览器翻译插件推荐——Google Chrome 插件推荐
2019-07-02 20:23:22划词翻译”是一款 谷歌浏览器翻译插件,只要划词就能显示翻译结果,不仅简单、方便,支持多种语言的朗读,还支持多种数据源的选择,方便墙内墙外用户。 划词翻译——Google Chrome 插件推荐划词翻译——Google ... -
chrome-翻译插件
2022-03-17 10:27:59chrome-翻译插件 英语小白需借助翻译插件 语言国际化 -
Mac解决Chrome更新后翻译插件不能翻译本地文件
2021-04-20 21:04:18有几篇论文保存本地再用Chrome打开之后,发现翻译插件不能用了,故查找了一下解决办法。 解决办法: python搭建本地服务器。 打开终端,执行: cd root_path_to_paper #本地服务器根目录 touch index.html #新建... -
chrome翻译插件之谷歌翻译
2019-07-14 23:22:01谷歌的Chrome浏览器之所以让很多人喜欢,不仅仅是它的安全、速度快,更重的是它拥有丰富的扩展程序。让普通的浏览器也变得更加可玩。 完美解决谷歌浏览器开发者模式插件弹窗问题完美解决谷歌浏览器开发者模式插件... -
Chrome插件-《彩云小译》一键实现网页中英文对照的翻译工具.zip
2020-04-27 16:57:54Chrome插件-《彩云小译》一键实现网页中英文对照的翻译工具.zip,彩云小译扩展程序默认的 中英文对照 让人眼前一亮, 而且官网提供了免费的api(每月100万字)。 -
Google翻译(谷歌翻译) Chrome插件
2019-05-11 11:15:42( http://www.cnplugins.com/google/google-translate/ ) 可以直接在插件商店里下载