Skip to content

DailyLearningJS/Juejin-Plugin

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

掘金插件 - 拓展web端展示功能


插件一:增加 个人主页 - 赞文章功能 | 文章分类功能(完成度55% 基本能使用)

1.使用

// 需要环境:Node.js

git clone https://github.com/zhukunpenglinyutong/Juejin-Plugin.git

npm i

node ./proxyServe/index.js // 启动代理(pm2启动也赞同)

打开 谷歌浏览器 扩展程序

开启开发者模式

点击 加载已解压的扩展程序

选择本仓库src文件夹

刷新页面 (在个人页面刷新才行)

使用演示(视频)


2.实现分析(写代码前先分析整个过程,再动手写)

视图展示形式

代码实现分析

  • 数据请求:通过接口拿到数据(如果需要多个请求的话,进行一定的异步等待处理)(Node层已经解决跨域问题✅)
  • 数据处理:将数据处理成我们想要的格式 ✅
  • 视图实现:通过数据 ---> 进行添加DOM方式 ✅

3.遇到的问题


1️⃣ 数据请求部分遇到跨域问题,无法进行数据请求

暂时想到的解决方案:采用Node层代理,并返回我想要的格式,这样处理数据的部分就可以放到 后端进行 ✅


2️⃣ 点击第一次分类查看的时候,弹不出来

  • 思考:原因可能是掘金几个文件拿不到,阻塞了
  • 再次点击就会出来

3️⃣ 切换普通路由 无法监听到,也就无法增加DOM节点

  • 一种方法是做一个 简易的路由,监听路由变换,但是 这种需要和 onhashchange 事件配合,也就是需要 监听hash变化
  • 掘金网址变换不是没有 #,所以能通过 定时器轮询的方式监听,但是这种我是不卡,但是感觉并不好,还不如等大佬指点下呢

4️⃣ 分类菜单部分点击一下图层就会消失(虽然事件触发了,数据更新了,但是这种效果不好)


5️⃣ 遇到1k点赞的内容,需要加载25s左右,遇到更高的加载速度更慢,此处可以进行优化,优化不了的,提示不建议使用此插件


4.近期规划(2019.7.29 - 2019.8.4)

1️⃣ 将谷歌插件的形式转为 油猴形式

2️⃣ 修复样式展示问题,并增加优化体验

  • 🔧修复 非刷新情况下 插件操作DOM加载不出来的问题(主要原因是触发函数监听的是 window.onload )
  • 🔧修复 点击分类查看 出现黑色遮罩层,但是不显示内容的问题(现在是还需要再点一下赞的那个下拉才正常)
  • 🔧修复 点击切换类型的时候 弹出层消失的这一体验不好的问题
  • 🔥增加搜索功能(除了选择一个标签之外,还支持模糊化查询的功能,查询的是全部内容的文章标题名)
  • 🔥优化 分类标签滚动效果,现在是需要手动的进行拖拽滚动,马上会实现 鼠标滚轮滚动的功能,优化使用体验
  • 🔥增加多选标签功能(有些文章由多个标签组成,此功能可以筛选出符合多选标签规则的内容)(再考虑)
  • ......

5.其他说明

About

掘金web端插件

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • JavaScript 99.8%
  • Other 0.2%