应 V2EX 老哥请求做了划词右键小窗搜索 Chrome 扩展

[namesc]

昨天看到 @CivAx 的帖子“有没有什么 Chrome 插件，可以实现划词翻译类似的划词搜索？”
链接： https://www.v2ex.com/t/531800

然后我就做了一个扩展，简单来说就是当你划词选中文本时，点击右键里的扩展菜单，就会在网页内插入一个 iframe 通过百度搜索移动版搜索选中文本。（其他搜索引擎没有合适的）

窗口头部底部蓝色区域按住可以拖到到网页中的任意位置，双击可以关闭窗口，窗口头部有几个搜索引擎的链接，点击即可在新窗口打开搜索选中文本的链接。

效果如下：



已经发布到 Chrome 应用店了，链接如下：
https://chrome.google.com/webstore/detail/fgmknallmmochhfngjmmmcpobelihfhe


我写好后自己试用了下，发现实用性比我想象中的要高，如果有好的搜索引擎的话，这个扩展真是挺不错的。考虑用谷歌，但谷歌不能内嵌，暂时没有找到解决办法。

还有一个问题是比较麻烦的，有的网站限制了 iframe src 源，比如知乎，不允许 iframe 百度的网址，那这个扩展在知乎就用不了了，目前考虑是把知乎的换成知乎内部搜索。

也考虑通过云函数处理搜索结果（云函数免费额度不用白不用），通过 API 方式调用，这样就能用任何搜索引擎了，但是工作量会比较大，先用一段时间看看有没有这个必要吧。

欢迎大家试用，有建议的在 Chrome 应用店反馈或者在这里回复。如果有其他的扩展需求，也可以说下，工作量不大的我考虑做一个，过年估计有挺多时间折腾这些小玩意。

新版开发好了，回复里说的功能基本都实现了，发布到 Chrome Web Store 提示说要深入审核。

由于存在以下问题，您的扩展程序可能必须接受深入审核：

宽泛的主机权限

除了请求宽泛的主机权限或 content script 网站匹配项之外，您也可考虑指定您的扩展程序需要访问的网站，或者使用 activeTab 权限。相较于针对数量不定的网站授予完整访问权限，这两种方法不仅更安全，还可能有助于最大限度地缩减审核用时。

我想着审核应该也用不了多久吧，就点了确定发布，没想到确定之后才提示说要几个工作日，而且，就算是取消发布了也一样要等待完成才能继续发布新版本，真是醉了。

等商店版本更新大家再试用吧，没办法了。

我明天把代码发到 Github 上再来发新贴。

然后研究下怎么将各搜索引擎搜索结果处理返回。

代码上传到 Github 了，具体看帖子：

链接 → 开工大吉！全新 Chrome 划词小窗搜索扩展代码上线！

[zllmath]

赞，老哥动手能力强

[Hypn0s]

厉害了鸭，资池

[zhttty]

提个小小的建议，小窗里边文字和图片能不能等比例缩小，最好可以选择比例那种？

[CivAx]

牛逼！！！！（破音

老哥居然也是广州的

目前实现效果已经趋于我想象中的完美插件了，但是有几个得寸进尺的小建议

有没有办法实现 “点击页面空白处自动关闭窗口” 或类似的效果？这样可以省掉点×的功夫了（懒

弹出搜索框后里面的内容字体感觉有点过大了，这个能够调整吗？

小窗出现和消失的样式能否参考一下 Qikipedia 的代码，感觉有个缩放看起来会更舒服些

关于 Google 移动版的问题我的帖子里有人建议说指定 UA，这个可不可行呢？其实纯文字版的 Google 也能接受（

有空留个 Alipay，我觉得这个必须值得一杯星巴克

[duvalier]

可以可以，v 友真是动手能力极强。

[unco020511]

希望能云端处理,这样可以各种搜索切换

[IsaacYoung]

支持

[zijieq]

执行力真强

[AzadCypress]

nb，老哥执行力好强啊

[Stan30]

赞

[sundae91]

之前写过一个其他插件，想发布到 chrome 商店，不过开发者帐号一直没注册成功。。。
求问 lz 如何注册。。

[oul]

赞一个

[qooweds]

原帖楼主快来付费了
:)

[namesc]

@zhttty
@CivAx
@unco020511

用 iframe 内嵌解决不了字体大小这些内容排版问题，得有数据接口然后自己排版才可以，在云端处理搜索结果再返回就可以。

没考虑云端处理是因为扩展是公开的，万一被大量使用，那我可就是给自己写了一个扔钱扩展。由用户自愿提供服务器公共使用这个做法考虑了一下，不敢用，怕投毒。

不过我想到一个折中方案了，我先把云端处理代码写出来发布到 Github，然后在扩展留一个写服务器地址的设置，要自定义搜索的，可以自己拿代码去服务器配置好了，把服务器地址填到扩展设置里，自己用自己的。然后再看看是不是通过赞赏或者什么方式搞个公共服务器。

现在小窗不能点击网页空白处关闭，是因为我考虑小窗是常驻网页侧边栏，网页内容和小窗对比着看，而不是点了就看，看了就关，后面加个设置点击空白处关闭吧。

我最近没什么事，就这两天，我加上云端功能，更新好，再来发个帖子。

[brandon911]

🐮🍺

[namesc]

多谢各位老哥夸奖了，我就不一一回复了。欢迎提各种关于扩展的想法，我发现写 Chrome 扩展真是比写 PHP 要有意思得多。

[namesc]

@sundae91 #11 注册不难吧，就是要钱，我是几年前注册的，花了 5 刀还是多少。

[iFlicker]

呀 实用！ 赞一个👍

[keith1126]

赞一个,楼主动手能力真强

[vowers]

nb 啊 ，厉害了 这个可真的挺方便的

[AslanFong]

6666666 支持了

[wangchonglie]

@CivAx #4 点击页面空白处自动关闭窗口+1

[Yiki]

好棒啊~

[nightl2018]

🐂🍺 楼主一天肝出高达

[Stan30]

可不可以跟划词翻译一样，直接划词就出小窗，并不需要右键再选择用小窗搜索

[CivAx]

@Stan30 #25 这样可能会跟其他需要监听 “选中” 动作的插件相冲突…

不过能加个开关提供自由选择也是挺好的

[piqizhu]

感谢分享， 请问提交插件到 chrome 浏览器市场 需要给钱吗

[pwxcoo]

要开放一下源码吗，想给自己定制一个的说

[namesc]

@Stan30 #25 安排上了，加选项。

@piqizhu #27 发布插件不用钱，认证开发者账号要钱，好像是 5 刀，不太确定。

@pwxcoo #28 晚两天发下个版本就发到 Github，到时候会链接上来，欢迎贡献。不过就算不发你也能下载到的，搜 chrome extension download 下载 crx 文件然后转 zip 解压就是源代码了，任何扩展都可以下载。

[pengfei]

老哥 能不能自定义添加网址 或者直接加上 类似 http://dict.cn/ 的翻译网站

[iawes]

划词翻译较好

[iamsea]

搜索引擎支持一下 google 就更不错了

[iAndychan]

楼主的也不错，已安装。
哈哈哈😂，推荐一个 Chrome 扩展，沙拉查词，https://chrome.google.com/webstore/detail/cdonnmffkdaoajfknoeeecmchibpmkmg?hl=en

[Acoffice]

真心速度,这个必须赞

[FakeLeung]

牛逼啊！！！

[huangdayu]

牛逼，点赞。楼主用的云函数是那个平台的呢？

[huangdayu]

报错误，不允许 executescript ……

[cwcauc]

可以做成类似 Google Translate 一样，划完词会自动出来一个小的 G 图标点一下就出来搜索结果了。
这样不用再去右键里面找了，更方便使用

[namesc]

@huangdayu 哪个网站，目前就知道 Chrome Web Store 不能 executeScript，新版我准备不用 executeScript 了。

[greatghoul]

老哥动手能力真强

[namesc]

@cwcauc 这个建议不错，安排。

[KasuganoSoras]

有空我帮你造个接口吧……可以代理请求各类网站，不会被 iframe 限制
PHP 打造，写完了开源

[namesc]

@iAndychan #33 不错，这个很成熟了，我还是新手，可以作为我的参考。

[namesc]

@KasuganoSoras #42 可以，约定返回格式就好

[myjava]

https://www.chromefor.com/%E5%88%92%E8%AF%8D%E5%8F%B3%E9%94%AE%E5%B0%8F%E7%AA%97%E6%90%9C%E7%B4%A2_v1-0-3/

不错。同步国内下载节点

[huangdayu]

@huangdayu #37 https://chrome.google.com/webstore/detail/%E5%88%92%E8%AF%8D%E5%8F%B3%E9%94%AE%E5%B0%8F%E7%AA%97%E6%90%9C%E7%B4%A2/fgmknallmmochhfngjmmmcpobelihfhe/related 这个页面

[KasuganoSoras]

@namesc #44 免翻谷歌搜索： https://google404.net/

[namesc]

代码上传到 Github 了，具体看帖子：

链接 → https://www.v2ex.com/t/533710

[soooulp]

大佬救命呀，萌新弱弱问一句，
图标样式 data:....这里面怎么填，填了本地连接没效果

#hcSearcheIcons hcsearche-icon[data-seclass=weibo] { font-size: 0; background-image:url('data:D:\新建文件夹\微博\icon16.png') }

另外，设置多个图标样式是需要添加;么

[wensheng]

@soooulp #hcSearcheIcons hcsearche-icon[data-seclass=weibo] { font-size: 0; background-image:url('https://t1.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=http://weibo.com&size=128') } 用这个

[sma210]

在写文章，复制文本的时候，总会留下小尾巴：GoogleBing 百度