// 需要环境:Node.js
git clone https://github.com/zhukunpenglinyutong/Juejin-Plugin.git
npm i
node ./proxyServe/index.js // 启动代理(pm2启动也赞同)
打开 谷歌浏览器 扩展程序
开启开发者模式
点击 加载已解压的扩展程序
选择本仓库src文件夹
刷新页面 (在个人页面刷新才行)使用演示(视频)
视图展示形式
代码实现分析
- 数据请求:通过接口拿到数据(如果需要多个请求的话,进行一定的异步等待处理)(Node层已经解决跨域问题✅)
- 数据处理:将数据处理成我们想要的格式 ✅
- 视图实现:通过数据 ---> 进行添加DOM方式 ✅
1️⃣ 数据请求部分遇到跨域问题,无法进行数据请求
暂时想到的解决方案:采用Node层代理,并返回我想要的格式,这样处理数据的部分就可以放到 后端进行 ✅
2️⃣ 点击第一次分类查看的时候,弹不出来
- 思考:原因可能是掘金几个文件拿不到,阻塞了
- 再次点击就会出来
3️⃣ 切换普通路由 无法监听到,也就无法增加DOM节点
- 一种方法是做一个 简易的路由,监听路由变换,但是 这种需要和 onhashchange 事件配合,也就是需要 监听hash变化
- 掘金网址变换不是没有 #,所以能通过 定时器轮询的方式监听,但是这种我是不卡,但是感觉并不好,还不如等大佬指点下呢
4️⃣ 分类菜单部分点击一下图层就会消失(虽然事件触发了,数据更新了,但是这种效果不好)
5️⃣ 遇到1k点赞的内容,需要加载25s左右,遇到更高的加载速度更慢,此处可以进行优化,优化不了的,提示不建议使用此插件
1️⃣ 将谷歌插件的形式转为 油猴形式
2️⃣ 修复样式展示问题,并增加优化体验
- 🔧修复 非刷新情况下 插件操作DOM加载不出来的问题(主要原因是触发函数监听的是 window.onload )
- 🔧修复 点击分类查看 出现黑色遮罩层,但是不显示内容的问题(现在是还需要再点一下赞的那个下拉才正常)
- 🔧修复 点击切换类型的时候 弹出层消失的这一体验不好的问题
- 🔥增加搜索功能(除了选择一个标签之外,还支持模糊化查询的功能,查询的是全部内容的文章标题名)
- 🔥优化 分类标签滚动效果,现在是需要手动的进行拖拽滚动,马上会实现 鼠标滚轮滚动的功能,优化使用体验
- 🔥
增加多选标签功能(有些文章由多个标签组成,此功能可以筛选出符合多选标签规则的内容)(再考虑) - ......
