ChatGPT_替换_插件 - 精英日记网

所属分类：生财干货

领500g书库，关注公众号:程叫兽的宝藏 (长按可复制！)

热门下载区==>点此链接进入<<<

目录（点击切换）

扫上面二维码获取原文

开发Chrome插件的全程记录

背景

最近我了解到一个很方便的功能：在浏览器中使用VSCode打开GitHub上的项目。只需要将

URL

中的 ".com" 替换为 ".dev"，就可以实现这一功能。这对于查看代码来说真是太方便了！但是，每次手动修改URL确实有些繁琐。如果能够一键切换就好了。

于是我想到了开发一个Chrome插件来解决这个问题。然而，我对Chrome插件的开发并不熟悉。这时，我想起了万能的

ChatGPT

。正好可以借这个需求来练习一下，体验一下用ChatGPT编写程序的乐趣！

目标功能

我们的目标是开发一个域名替换工具。考虑到不仅仅是GitHub需要这种操作，还有其他一些网站，比如x度文库、b站等，也需要类似的替换功能。最终我们开发的插件如下所示：

我们的插件功能非常简单，包括以下几个方面：

用户界面

简洁明了：插件中有两个输入框（分别是域名和替换内容），以及一个替换按钮。

智能提取域名：每次打开插件时，它会自动从当前浏览器标签页的

URL

中提取域名，并将其作为域名输入框的默认值，用户也可以手动进行修改。

智能推荐替换内容：当域名值发生变化时，插件会根据域名在存储中查找对应的替换内容。如果只有一个匹配项，插件会自动将其填入替换内容输入框；如果有多个匹配项，类似于谷歌的搜索建议，会显示推荐选项供用户选择。用户可以方便地从推荐选项中选择一个值，也可以手动输入替换内容。

一键替换并跳转：当用户点击替换按钮时，插件会将域名和替换内容保存到存储中，以便下次搜索时推荐使用。保存成功后，插件会将当前浏览器标签页的

URL

中的域名部分替换为替换内容，并自动跳转到新的URL。

基于V3开发：插件的 manifest.json 文件基于 Chrome 的 V3 版本进行开发，以适应 Chrome 即将不再支持 V2 版本的要求。

清空替换历史：用户可以方便地清空特定域名对应的替换历史记录。

快速交互功能：点击 "trans" 按钮，可以快速交互域名和替换内容的值，提高用户的操作效率。

我们的插件将提供更加简单、智能和便捷的功能，为用户带来更好的使用体验。

开发全过程

我打开了一个新的对话框，并开始向他提需求。他迅速给出了相应的程序代码。