在线录屏工具

屏幕录制工具直接用浏览器自带的屏幕共享功能录下你的屏幕、某个窗口或某个浏览器标签页,录完生成一个 .webm 视频文件供预览和下载。适合录一段操作演示、复现一个问题,或者边操作边讲解。它是一个很基础的录制器:没有暂停键,没有倒计时,不能设置分辨率、帧率或码率,不能剪辑,输出格式默认为 WebM(浏览器不支持时改用其支持的格式),不会转换格式。

操作步骤

1. 如果想同时录下自己的讲解,先勾选「同时录制麦克风声音(适合需要一边录屏一边讲解的场景)」。录制开始后这个选项会变灰,不能再更改。
2. 点击「开始录屏」。浏览器会弹出自己的分享选择框,在里面选择要共享整个屏幕、某个窗口还是某个浏览器标签页。如果勾选了麦克风,还会先后请求麦克风权限。
3. 开始后页面显示红色的「正在录制中…」提示。此时你可以切换到要录制的窗口去操作。
4. 录完后回到本页点击「停止录制」,或者直接点浏览器提供的「停止共享」按钮,两种方式都会结束录制。
5. 页面出现视频播放器,可以先回放,确认后点击「下载录制结果(.webm)」,文件名为 screen-recording.webm(浏览器改用其他格式时扩展名随之变化)。

一个使用场景

假设你要给同事演示一个后台系统的操作步骤:勾选麦克风选项,点击「开始录屏」,在分享框里选择要演示的那个浏览器标签页,一边操作一边口头解释,完成后点击停止,回放检查一遍再下载发给同事。由于录制的清晰度、帧率、文件大小都由浏览器自动决定,代码里没有可调选项,我们没有给出具体的文件大小或帧率数字。选择「某个标签页」而不是整个屏幕,可以避免把其他窗口里的私人信息录进去。

支持范围与已知限制

• 需要浏览器支持屏幕共享接口。不支持时页面会显示整块提示:「你当前使用的浏览器不支持录屏功能,建议换用最新版本的 Chrome、Edge 或者 Firefox 浏览器重试。」手机浏览器通常不支持。
• 代码优先以 WebM 格式录制;如果浏览器不支持 WebM(例如 Safari),会改用浏览器支持的格式(如 MP4),下载文件的扩展名和按钮上的格式会随之变化。如果开始录制仍然失败,会显示「无法开始录屏,可能是取消了屏幕分享授权,或者浏览器不支持这个功能。」,这条提示不区分取消授权和其他原因。
• 能不能录到电脑或标签页的声音,取决于浏览器、操作系统和你在分享框里的选择;不勾选对应选项时,录出来可能没有声音。
• 勾选麦克风且共享了电脑声音时,代码会把两路声音混合成一条音轨再录制;如果浏览器无法混音,则退回为两条独立音轨,此时有些浏览器可能只保留其中一条。重要的录制请先短录一段回放检查有没有你的声音。
• 没有暂停、恢复功能,也没有录制时长上限提示。录制过程中数据暂存在内存里,录得很长会占用大量内存。
• 生成的 WebM 文件通常没有完整的时长信息,部分播放器里拖动进度条可能不顺畅。想要通用格式,可以再用其他工具转换。
• 如果在授权麦克风这一步被拒绝或失败,代码会自动停止已经开始的屏幕共享并显示错误提示。
• 录制的是你选中的画面,页面不会模糊或遮挡其中的隐私内容,请在开始前关掉不想被录到的通知和窗口。

常见问题:为什么不能自动录整个屏幕,每次都要选?

这是浏览器强制的隐私保护:网页必须让你每次手动选择共享什么内容,不能绕过。页面本身也做不到静默录屏。

常见问题:录出来没有声音怎么办?

先确认勾选了麦克风选项并允许了权限;想录电脑发出的声音,需要在分享选择框里勾选共享声音(部分浏览器只在共享标签页时支持)。开始前先录几秒钟回放测试,是最保险的做法。

常见问题:能录成 MP4 吗?

这个工具通常输出 WebM(不支持 WebM 的浏览器会输出其支持的格式),不做格式转换。需要 MP4 的话,可以使用站内的视频相关工具或其他软件把 WebM 转成 MP4。

常见问题:录制内容会上传到服务器吗?

不会。代码里没有任何上传逻辑,录制数据只存在你浏览器的内存里,下面有详细说明。

隐私与处理方式

录制全部在你的浏览器中完成:代码使用浏览器的屏幕共享和 MediaRecorder 接口,把数据块暂存在内存中,停止后合成一个视频,通过本地生成的临时链接预览和下载。没有任何把画面或声音发往服务器的网络请求。刷新或关闭页面后录制内容就会消失,所以录完请及时下载。离开页面时,代码会尝试停止仍在进行的录制并关闭屏幕和麦克风的数据流。