vscode摸鱼插件开发
不知道大家在写代码的时候,摸不摸鱼,是不是时不时得打开一下微博,看看今天发生了什么大事,又有谁塌房,而你没有及时赶上。
为此,我决定开发一个vscode插件,来查看微博热搜
插件名称:Fish Tools
vscode扩展可搜索安装
1、热搜
首先实现在侧边栏中展示前20个热搜,没必要太多
1、package.json 增加配置
"views": {"fish-activityBar": [{"id": "fishView","name": "fish weibo"}]},"viewsContainers": {"activitybar": [{"id": "fish-activityBar","title": "Fish Weibo","icon": "resources/dark/weibo.svg"}]},
如此,侧边栏就会展示微博按钮
按钮有了,内容可以通过树视图展示,vscode.window.createTreeView 可以创建树视图
const customView = vscode.window.createTreeView("fishView", {treeDataProvider: customTreeDataProvider,});
class CustomTreeDataProvider implements vscode.TreeDataProvider<CustomItem>
这里官方文档中有树视图的例子
热搜内容,可以在CustomTreeDataProvider类的getChildren方法中,通过调微博的接口获取
const data = await getHotSearch();
const top20Hot = (data?.data?.realtime || []).slice(0, 20);
const treeData = top10Hot.map((item: any) => {return { label: item?.note, id: item?.mid };
});
到这里,完成情况如图所示,

只有热搜当然还是不够的,因为我们想了解具体内容的时候,还是需要打开浏览器,所以这里给每条热搜增加点击功能
2、热搜内容
getTreeItem(element: CustomItem): vscode.TreeItem {const treeItem = new vscode.TreeItem(element?.label);// 配置点击行为treeItem.command = {command: "treeView.openContent",title: "Open Content",arguments: [element],};return treeItem;}
这里增加了command,需要注册该命令,并且点击之后打开一个webview,(简单版的也可以直接打开一个文档,展示内容即可)
vscode.commands.registerCommand("treeView.openContent",(treeItem: vscode.TreeItem) => {const panel = vscode.window.createWebviewPanel(webviewId,webviewTitle || "详情",vscode.ViewColumn.One,{enableScripts: true,});// webview内容const scriptPath = vscode.Uri.file(path.join(extensionPath, jsPath));const scriptUri = panel.webview.asWebviewUri(scriptPath);panel.webview.html = `<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>详情</title></head><body><div id="loading">页面初始化中...</div><div id="root"></div><script src=${scriptUri}></script></body></html>`}
)
webview内容,实现方式可以多种,这里scriptUri 直接写路径,是不生效的,详情可以看官方文档。
3、消息传递
这里实现了,热搜,点击事件以及打开了webview窗口,那么数据如何在webview传递,这里因为直接调的微博的接口,所以在webview中,是调不通的,所以调接口查数据的过程在vscode扩展这边实现
这里第一个问题是热搜的详细内容,是需要登录的,所以这里需要一个cookie,cookie的获取,也比较简单,随便找一个接口,就能查询到
第二个问题是详细内容,并不是通过调xhr接口返回的,需要自行去解析dom结构,来获取自己需要的内容。
1、消息的传递,vscode扩展传递到webview,可以通过postMessage
panel.webview.postMessage({command,text
});
2、webview中可以通过 window.addEventListener监听消息
window.addEventListener("message", (event) => {if (message.command === "getMessage") {setContent(message.text);}
}
3、webview传递到vscode中,通过postMessage方法
const vscode = acquireVsCodeApi();
vscode.postMessage({command: "pageUp",text: { page: page - 1 },
});
4、vscode中通过onDidReceiveMessage监听
panel.webview.onDidReceiveMessage((message) => {if (message.command === "pageUp") {getHotDetail();}
});
这里在给webview.html赋值之后,可以调接口拿到微博内容,通过上述方式传到webview中,webview中只需要展示即可。其他的上一页,下一页,刷新,也可以通过相同方式实现。
最后完成情况如下

4、配置
上述只简单概述插件功能,配置方面,这里增加了cookie的配置,以及热搜的刷新间隔。

后续可以考虑评论、点赞等功能实现。
相关文章:
vscode摸鱼插件开发
不知道大家在写代码的时候,摸不摸鱼,是不是时不时得打开一下微博,看看今天发生了什么大事,又有谁塌房,而你没有及时赶上。 为此,我决定开发一个vscode插件,来查看微博热搜 插件名称࿱…...
音频录制和处理软件 Audio Hijack mac中文版说明
Audio Hijack mac是一款功能强大的音频录制和处理软件,它可以帮助用户从各种来源捕获和处理音频。 首先,Audio Hijack具有灵活的音频捕获功能。它支持从多个来源录制音频,包括麦克风、应用程序、网络流媒体、硬件设备等等。你可以选择捕获整个…...
寻找二叉树一个节点的后继节点
后继节点:中序遍历的后一个节点 普通二叉树:中序遍历得到一个list,时间复杂度O(n) 本题的二叉树:有父节点的指针,后继节点与原节点的距离为1,因此可以直接通过父节点找到下一个节点 优化:节点…...
如何能够获取到本行业的能力架构图去了解自己的能力缺陷与短板,从而能清晰的去弥补差距?
如何能够获取到本行业的能力架构图去了解自己的能力缺陷与短板,从而能清晰的去弥补差距? 获取并利用能力架构图(Competency Model)来了解自己在特定行业或职位中的能力缺陷和短板,并据此弥补差距,是一个非常…...
红队打靶:Misdirection打靶思路详解(vulnhub)
目录 写在开头 第一步:主机发现与端口扫描 第二步:Web渗透(80端口,战术放弃) 第三步:Web渗透(8080端口) 第四步:sudo bash提权 第五步:/etc/passwd利…...
10.23归并排序
课上 归并排序 最大时,就是两个都是完全倒序,但注意一定有一个序列先用完,此时剩一个序列只有一个元素,不用比较,直接加入,所以就是nn-1, 最小时,是都是完全有序,且一个序列中的元…...
[C++]:2初识C++(auto) + 类和对象上:
[TOC](初识C(auto) 类和对象上) 一.初始C 1.auto关键字:(C11) 1.作为一个变量的类型给这个类型初始化,auto自动识别初始化这个变量值的类型,为auto类型的这个变量开辟一个合适的空间。 补充: 1.typeid(变量名).name—>可以打…...
大学英语试卷
大学英语试卷 If everyone learns to set forth facts and reason things out in social life, many of the contradictions are easy to ____. A. oblige B. engage C. resolve D. commitIf we let the fastest runner set the____, the others will fall behind. A. pace B.…...
SpringBoot Lombok的使用
目录 下载Lombok插件 Lombok的用法 获取日志对象 生成get,set方法 Lombok框架的实现原理 Lombok的常用注解 下载Lombok插件 要使用Lombok首先要确保idea安装了lombok插件 在项目中添加 lombok依赖 在<dependency>里右键生成点击edit starters 插件(没有就下载,可…...
后台管理系统SQL注入漏洞
对于edu来说,是新人挖洞较好的平台,本次记录一次走运的捡漏0x01 前景 在进行fofa盲打站点的时候,来到了一个后台管理处看到集市二字,应该是edu站点 确认目标身份(使用的quake进行然后去ipc备案查询) 网…...
变量常用函数
查看变量类型 type(变量名) 用来查询变量所指的对象类型 >>> a, b, c, d 20, 5.5, True, 43j >>> print(type(a), type(b), type(c), type(d)) <class int> <class float> <class bool> <class complex> 基础数据类型 # coding…...
从零学算法(LCR 157)
某店铺将用于组成套餐的商品记作字符串 goods,其中 goods[i] 表示对应商品。请返回该套餐内所含商品的 全部排列方式 。 返回结果 无顺序要求,但不能含有重复的元素。 示例 1: 输入:goods “agew” 输出:[“aegw”,“aewg”,“ag…...
mysql 优化 聚簇索引=主键索引吗
在 InnoDB 引擎中,每张表都会有一个特殊的索引“聚簇索引”,也被称之为聚集索引,它是用来存储行数据的。一般情况下,聚簇索引等同于主键索引,但这里有一个前提条件,那就是这张表需要有主键,只有…...
c# ManualResetEvent WaitHandle 实现同步
//本文演示了ManualResetEvent 类的非静态set()、Reset()、WaitOne()和 //WaitHandle类的静态方法WaitAllWaitAll() //它们用于线程间的同步控制。 //实现了如下功能:线程1(定时控制)通知线程2和线程3采集数据 //线程2和3数据采集完了&am…...
使用Packstack安装器安装一体化OpenStack云平台
【实训目的】 初步掌握OpenStack快捷安装的方法。掌握OpenStack图形界面的基本操作。 【实训准备】 (1)准备一台能够安装OpenStack的实验用计算机,建议使用VMware虚拟机。 (2)该计算机应安装CentOS 7,建…...
【Rust】4 一文讲解重点 pattern matching | trait | 生命周期 | 闭包 | 迭代器 | 智能指针 | 并发与并行
文章目录 一、pattern matching二、trait2.1 常见 trait2.1.1 Copy 和 Clone2.1.2 PartialEq 和 Eq2.1.3 PartialOrd 和 Ord2.1.4 Hash2.1.5 From, Into, TryFrom, TryInto 2.2 概念2.2.1 关联类型2.2.2 关联常量2.3.3 泛型关联类型2.3.3.1 示例: 用泛型关联类型, 创建集合工厂…...
idea Java代码格式化规范
文章目录 引入基础知识代码模板idea模板eclipse模板1.安装插件2.生成配置文件3.导入配置文件 附录一:xml配置项说明附录二:赠送 引入 最近在公司开发中,遇到了一点小问题,组内各同事的格式化规范不一致。一来导致代码样式并不统一…...
apple MFI工厂认证,干货,为防止MFI工作人员查看,已设置VIP阅读
一开始以为审核特别严格,准备了好久,经历过了之后会发现很简单,1个小时完成了所有审核事项。 好好招待审计员,比如能接送就接送,到点吃饭就尽量约时间吃饭后再审计,找个正式的会议室,该摆盘水果就摆上,让审计员感觉到公司是很重视这次的MFI审核,但是不能贿赂发红包那…...
软件企业知识库应用场景?如何搭建软件企业知识库?
想要减少人工干预、减少不必要的时间和人力成本、快速获取准确信息……这些应用场景对于我们企业来说是非常渴望在短期内实现的。 软件企业知识库 因为传统知识库仅仅是存储:知识只是“存储”,根本用不起来,缺乏有效的管理方式和储存载体&am…...
华为OD 滑动窗口最大值(100分)【java】B卷
华为OD统一考试A卷+B卷 新题库说明 你收到的链接上面会标注A卷还是B卷。目前大部分收到的都是B卷。 B卷对应20022部分考题以及新出的题目,A卷对应的是新出的题目。 我将持续更新最新题目 获取更多免费题目可前往夸克网盘下载,请点击以下链接进入: 我用夸克网盘分享了「华为O…...
终极指南:如何利用Java热更新技术实现3倍开发效率提升?
终极指南:如何利用Java热更新技术实现3倍开发效率提升? 【免费下载链接】HotswapAgent Java unlimited redefinition of classes at runtime. 项目地址: https://gitcode.com/gh_mirrors/ho/HotswapAgent 在Java开发过程中,频繁的代码…...
春联生成模型-中文-base应用案例:家庭布置、店铺营销、内容创作全搞定
春联生成模型-中文-base应用案例:家庭布置、店铺营销、内容创作全搞定 1. 春联生成模型能为你做什么? 春节贴春联是中国传统文化的重要组成部分,一副好的春联既要讲究对仗工整,又要蕴含美好寓意。但对于大多数人来说,…...
MDCSwipeToChoose快速入门:5步创建你的第一个滑动卡片应用
MDCSwipeToChoose快速入门:5步创建你的第一个滑动卡片应用 【免费下载链接】MDCSwipeToChoose Swipe to "like" or "dislike" any view, just like Tinder.app. Build a flashcard app, a photo viewer, and more, in minutes, not hours! 项…...
告别手动复制粘贴!用PowerShell脚本批量下载全球1米树冠高度数据(附完整脚本)
告别手动复制粘贴!用PowerShell脚本批量下载全球1米树冠高度数据(附完整脚本) 在生态研究和地理信息系统(GIS)工作中,处理大规模栅格数据是家常便饭。想象一下,当你需要下载数百个甚至上千个1米…...
AI编程实战:从零到一搭建全栈项目断
1. 核心概念 在 Antigravity 中,技能系统分为两层: Skills (全局库):实际的代码、脚本和指南,存储在系统级目录(如 ~/.gemini/antigravity/skills)。它们是“能力”的本体。 Workflows (项目级):…...
论文降AI工具测评:10款对比后这款低至0.12%通过率极高
2026年国内学术圈AIGC检测规则全面更新,学生和科研人员对论文降AI工具的需求持续攀升,一季度用户规模已突破2000万。但市面上各类工具的技术能力差异极大,多数还停留在同义词替换、简单调整句式的浅层改写阶段,根本无法应对知网、…...
揭秘Informer:如何通过ProbSparse注意力机制革新长序列预测
1. 长序列预测的困境与Transformer的瓶颈 想象一下你正在管理一个大型电网系统,需要预测未来30天的电力消耗。面对长达720小时的历史数据(每小时一个数据点),传统的LSTM模型在预测超过48小时后的结果就开始出现明显偏差࿰…...
从代码到公路:如何用网页设计体验一把张雪机车的速度与激情?
闲来无事,我设计与制作了一个官网。我想用网页讲一个关于速度与激情的故事。 黑色背景上橙色的光芒划破屏幕,粒子动画如火花般飞溅,3D模型随着鼠标缓缓旋转...这不是在玩游戏,这是在看一台机车。 当其他品牌还在用静态图片展示产…...
K8s RBAC实战:一个实验搞定权限控制
RBAC 详解(基于角色的访问控制) 一个实验搞定RBAC 在Kubernetes中,授权有ABAC(基于属性的访问控制)、RBAC(基于角色的访问控制)、Webhook、Node、AlwaysDeny(一直拒绝)和AlwaysAllow(…...
Altium Designer 21 保姆级教程:从PCB到Gerber文件,一次搞定所有制造输出设置
Altium Designer 21 全流程制造输出指南:从PCB设计到Gerber文件生成 在电子设计领域,将PCB设计转化为实际可生产的制造文件是一个关键但常被忽视的环节。许多新手工程师和学生往往在完成布局布线后,面对制造输出菜单中的各种选项感到无所适从…...
