通知与状态消息
除了上文的交互对话框,VS Code 还提供轻量的「一闪而过」消息机制:状态栏临时消息、系统通知推送、外部链接打开。适合用于即时反馈与后台提醒。
状态栏临时消息 setStatusBarMessage
window.setStatusBarMessage 在状态栏显示一条自动消失的消息:
typescript
import * as vscode from 'vscode';
// 显示 3 秒后自动消失
const disposable = vscode.window.setStatusBarMessage(
'$(sync) 正在保存...',
3000
);
// 需要手动隐藏时保存返回的 Disposable
// disposable.dispose();| 用法 | 效果 |
|---|---|
setStatusBarMessage(text) | 永久显示(需手动清除) |
setStatusBarMessage(text, timeout) | 显示 timeout 毫秒后消失 |
| 返回值 | Disposable,可手动 dispose() |
与 createStatusBarItem 对比
| API | 特点 | 适用场景 |
|---|---|---|
setStatusBarMessage | 临时、自动消失 | 一次性操作反馈 |
createStatusBarItem | 常驻、可配置 | 持续状态展示 |
队列与叠加
连续调用多条临时消息,后一条会替换前一条。若需避免覆盖,可:
typescript
let messageDisposable: vscode.Disposable | undefined;
function showTemporary(text: string) {
messageDisposable?.dispose();
messageDisposable = vscode.window.setStatusBarMessage(text, 3000);
}通知推送 Notification API
VS Code 本身不提供独立的「推送通知 API」,但通过通知扩展点与 show*Message 组合可实现等效效果:
消息即通知
showInformationMessage 等产生的 Toast 就是系统级通知:
typescript
vscode.window.showInformationMessage('构建完成', '查看结果', '忽略');后台通知(Background Notification)
对后台任务的完成提醒,用 withProgress + ProgressLocation.Notification:
typescript
await vscode.window.withProgress(
{
location: vscode.ProgressLocation.Notification,
title: '下载依赖',
cancellable: true
},
async (progress) => {
progress.report({ message: '开始下载...' });
// 任务完成时,进度条消失并弹出消息
vscode.window.showInformationMessage('依赖下载完成');
}
);打开外部链接 openExternal
vscode.env.openExternal 在系统默认浏览器中打开链接:
typescript
import * as vscode from 'vscode';
// 打开网页
await vscode.env.openExternal(
vscode.Uri.parse('https://code.visualstudio.com/api')
);
// 打开本地文件(用默认程序)
await vscode.env.openExternal(vscode.Uri.file('C:\\readme.txt'));
// 打开邮件
await vscode.env.openExternal(
vscode.Uri.parse('mailto:support@example.com')
);使用场景
- 插件文档跳转
- 报告 Bug 链接
- 更新日志查看
- 打开外部工具
常见安全校验
typescript
function openSafe(url: string) {
const uri = vscode.Uri.parse(url);
// 仅允许 http/https
if (uri.scheme === 'http' || uri.scheme === 'https') {
vscode.env.openExternal(uri);
} else {
vscode.window.showWarningMessage('不安全的链接');
}
}Toast 通知交互
Toast 通知支持按钮交互与 await 等待:
typescript
const action = await vscode.window.showInformationMessage(
'发现新版本,是否更新?',
'立即更新',
'稍后再说'
);
if (action === '立即更新') {
await vscode.env.openExternal(
vscode.Uri.parse('https://marketplace.visualstudio.com')
);
}通知中嵌入命令
通过 command: URI 让通知跳转执行命令:
typescript
vscode.window.showInformationMessage(
'配置已更改',
{
title: '打开设置',
command: 'workbench.action.openSettings'
}
);状态消息与通知的选择
| 场景 | 推荐方案 |
|---|---|
| 瞬时操作反馈(保存中) | setStatusBarMessage |
| 常驻状态(构建状态) | createStatusBarItem |
| 重要提醒(构建失败) | showErrorMessage |
| 后台任务完成 | withProgress + 消息 |
| 需要用户抉择 | Toast + 按钮 |
| 跳转外部 | openExternal |
完整示例:检查更新通知
typescript
import * as vscode from 'vscode';
export function activate(context: vscode.ExtensionContext) {
context.subscriptions.push(
vscode.commands.registerCommand('myExt.checkUpdate', async () => {
// 状态栏提示开始
vscode.window.setStatusBarMessage('$(sync~spin) 检查更新中...', 2000);
// 模拟网络请求
const hasUpdate = await checkVersion();
if (!hasUpdate) {
vscode.window.showInformationMessage('已是最新版本');
return;
}
// Toast 通知 + 交互
const action = await vscode.window.showInformationMessage(
'发现新版本 v2.0.0',
'查看更新日志',
'前往下载'
);
if (action === '查看更新日志') {
await vscode.env.openExternal(
vscode.Uri.parse('https://example.com/changelog')
);
} else if (action === '前往下载') {
await vscode.env.openExternal(
vscode.Uri.parse('https://example.com/download')
);
}
})
);
}
async function checkVersion(): Promise<boolean> {
// 模拟延迟
await new Promise((resolve) => setTimeout(resolve, 1000));
return true;
}常见问题
| 问题 | 处理 |
|---|---|
| 消息一闪而过看不清 | 用 showInformationMessage 而非临时消息 |
| openExternal 无反应 | 确认 scheme 正确(http/https) |
| 状态栏消息被覆盖 | 统一管理 Disposable |
| 通知频繁打扰 | 控制在关键节点触发 |
通知与状态消息让插件「动静结合」:临时反馈不打断操作,重要信息通过 Toast 与按钮引导用户行动。