我做了一个Chrome文本框即时翻译插件

公众号「古时的风筝」,专注于后端技术,尤其是 Java 及周边生态。

个人博客:www.moonkite.cn

大家好,我是风筝

我的第一个发布到Google Chrome 应用商店的插件终于审核通过了,功能比较简单,主要是为了学习一下从插件开发到应用商店发布的整个过程。

这个插件的主要功能就是针对文本框的翻译,所以我直给了它一个名字叫做「文本框翻译插件」。

欢迎试用啊,有问题可以直接微信和我联系。

使用场景

不知道你有没有碰到过这样的场景,有些国外网站只支持英文检索的,比如我常常用来找免费题图、免费icon的网站。

还有 Google 出的 Chat AI 「Google Bard」支持很多种语言,但是不支持中文,所以在使用的时候,还要现将中文翻译为英文,然后再提问。

还有使用 Stable Diffison 或者 Midjourney 画图,输入提示词的时候,如果你输入中文 prompt,那出来的结果大概率会惨不忍睹,所以也需要将输入转换为英文。

还有,现在出了很多AI相关的产品,但这些产品在前期的时候都有候补名单(Waitlist),需要你自己申请,申请的时候还要填写申请理由之类的,英语不好的情况下,只能先把中文翻译成英语,然后再粘贴过来。

除此之外,还**可以在Google、Google Bard、Twitter、微博、百度、ChatGPT等所有输入框中使用。****

基于以上种种的场景,开发了这个 Chrome 插件,安装好之后,不管你在什么网站,只要页面上有输入框,你都可以直接输入中文,然后直接在原地将中文翻译为你想要的目标语言,比如英文、俄语等。

插件安装

应用商店安装

插件已经上线到 Chrome 应用商店,

chrome.google.com/webstore/de...

离线版本:

百度网盘:pan.baidu.com/s/1Ob0-mWga...

提取码: n89a

插件使用

视频介绍已经放到 B 站了,有想看视频的可以到过去看。

B站视频介绍:www.bilibili.com/video/BV17g...

也可以直接看我视频号里的视频介绍:

1、安装完成后,将"文本框翻译"插件钉在工具栏。

2、点击浏览器工具栏中此插件的图标,设置目标语言和触发标识。

目标语言就是想要把你在文本框中输入的内容翻译成的语言,比如英语。

自定义触发标示就是在输入的内容末尾触发翻译的表示,可以自己修改。

3、在输入内容的尾部输入触发标示后(即上述的自定义的触发标示),会自动触发翻译动作,将原本的内容替换为目标语言。

在输入框输入 「你好/lang」 ,将自动触发翻译,并将文本框的内容替换为为 "Hello"。

记得更改设置后,要刷新网页才能生效。

插件原理

插件接入了 Google 翻译和微软翻译功能,首先使用 Google 翻译,如果检测到你的网络无法连接到 Google,则使用微软翻译。所以,如果你的网络不能访问 Google,会有至少0.5秒的延时。

插件会找到目前处在激活状态下 Chrome 网页中的输入框,并实时监听,如果发现你输入了「触发翻译的标示」,比如 /lang,则自动调用翻译接口进行翻译,将翻译后的结果自动替换当前正在操作的输入框,从而完成自动翻译过程。

欢迎试用啊,有问题可以直接微信和我联系。

有想要开发方式和源码的同学可以在下方留言,多的话,我会写一篇开发、上架的教程。

相关推荐
张西餐16 分钟前
Promise的理解
前端
悟空瞎说21 分钟前
收藏即复用!50个极致实用JavaScript单行代码,前端开发效率直接拉满
javascript
天渺工作室39 分钟前
别再写改名脚本了,一个 Vite 插件搞定压缩、校验、自动哈希命名vite-plugin-pack-orchestrator
前端·vite
楼田莉子41 分钟前
CMake学习:CMake语法
c++·后端·学习·软件构建
无限进步_1 小时前
C++ 继承机制完全解析:从基础原理到菱形继承问题
java·开发语言·数据结构·c++·vscode·后端·算法
薯老板1 小时前
事件循环(Event Loop)
javascript
大龄程序员狗哥1 小时前
第30篇:使用Flask部署你的第一个AI模型——打造简易Web API(项目实战)
前端·人工智能·flask
武子康1 小时前
大数据-278 Spark MLib-GBDT梯度提升决策树详解:从原理到实战案例
大数据·后端·spark
SamDeepThinking1 小时前
适合中小型企业的出口入口网关微服务
java·后端·架构
AI砖家1 小时前
解剖 Claude Code:如何搭建一个企业级的私有化 AI 编程助手
前端·人工智能·ai编程