自己动手编写一个在线保存百度谷歌搜索关键词历史记录的油猴脚本

如何通过Web技术实现我们的需求

相信大家只要会一点前端和后端基础的，一看到这个标题就有思路了，So easy!小菜一碟。下面我来说说我的实现方法和思路。

需要的技术栈

要实现这个需求，不外乎前端加后端技术，不过在这里我说一下我实现的技术栈：

1. html, css, javascript, jquery, Dom api；
2. php, thinkphp；
3. mysql；
4. JWT；
   这里说下为什么要用它，不用它后端就不会知道前端发送的数据来自哪个用户；

油猴脚本的编写

思路：用Jquery 操作dom获取搜索栏关键词，然后发送到后台，经过后台api 接口处理保存到数据库中。在右侧显示最近搜索的历史记录。数据从后台获取。
具体编码请看：油猴酷@百度,谷歌搜索记录在线保存收藏.
问题：百度比较变态，可能是百度的程序员闲得慌。弄了个不刷新页面，后台发送搜索请求。所以我写的代码只在刷新页面时可以获取关键词，另外在点击搜索按钮时也可以获取关键词。但是如果你不按回车，不点按索按钮是获取不到关键词的。这个问题在下节解决。

浏览器扩展的编写

思路：由于油猴脚本不能解决在所有情况下获取百度关键词的问题，所以必须借助于更强大的浏览器插件。这个插件一方面解决在百度后台默默发送请求的时候拦截下来，然后获取关键词并发送到我们的后台。另一方面，可以显示更多历史记录，并有收藏和删除的功能。
实现好的己经发布到chrome应用商店 ：保存百度谷歌搜索历史记录（需要翻墙）.

后台部分

后台除了提供前端（油猴脚本和浏览器扩展）的 api 外，还有一个用户注册登录页面，登录后有一个用户中心，可以生成 api token。
己经写好的网站：油猴酷.

小结

总之，整个项目历时一个月，终于上线完成了。欢迎大家体验，提出意见，所有功能均免费。如果有兴趣可以自己开发一个。觉得挺有用的。我自己一直在用，感觉还好。