web 网页可以实现截图功能吗?类似 QQ 微信的截图功能

31 天前
 atfeel

类似 QQ 微信的截图功能,web 网页可以实现截图功能吗,以前好像见过,现在找不到了,是不是配合插件实现的呢,各位有什么思路吗

2378 次点击
所在节点    程序员
18 条回复
leido
31 天前
截图网页内业务可以,截图系统别想了
0o0O0o0O0o
31 天前
DOLLOR
31 天前
navigator.mediaDevices.getDisplayMedia()
不过使用条件比较严格( HTTPS ),而且一般水平的前端开发者玩不来。
mightybruce
31 天前
谷歌 chrome 自带截图
键点击页面并打开检查器。

在 Chrome 检查器的左上角,你会看到一个小手机图标。

点击那个图标,网页顶部将出现一个新的黑色工具栏。

在这个黑色工具栏中,你可以选择想要模拟的屏幕尺寸(对于桌面显示器来说,可能需要 1920x1080 )

在黑色工具栏的右上角有三个点组成的菜单,在该菜单中你可以进行全屏截图
mightybruce
31 天前
插件截图比较容易,尤其是那种懒加载,需要滚动不断下拉的页面,
我用过的一个插件叫做 awesome screenshot 截图录屏
Daitabashi
31 天前
@leido 在线笔试时好像能共享整个桌面, 应该是有接口的吧, 一个对话框就共享了
yukino
31 天前
你是否再找 Firefox
kingofzihua
31 天前
kk2syc
31 天前
@Daitabashi 不安装扩展或者插件不可能的吧,纯 web 在浏览器内的怎么溢出到系统层?
xiangyuecn
31 天前
@DOLLOR #3 浏览器兼容性太差才是主要的,代码不复杂

直接手撸 getDisplayMedia 截屏:
```
navigator.mediaDevices.getDisplayMedia().then((stream)=>{
var canvas=document.createElement("canvas");
var video=document.createElement("video");
video.srcObject=stream;
var meta=stream.getVideoTracks()[0].getCapabilities();
video.width=canvas.width=meta.width.max;
video.height=canvas.height=meta.height.max;
video.onplay=()=>{ setTimeout(()=>{
canvas.getContext("2d").drawImage(video,0,0);
var b64=canvas.toDataURL("image/png");
document.body.innerHTML='<img src="'+b64+'">'
}, 1000)};
video.play();
}).catch((e)=>{ console.error(e) })
```
Kumo31
31 天前
@kk2syc 只要浏览器提供接口,想关机都行。浏览器提供的接口远比想象的多,截屏当然有 https://developer.mozilla.org/zh-CN/docs/Web/API/Screen_Capture_API
musi
31 天前
@kk2syc #9 浏览器就不能提供 API ?现在 web 都可以直接用蓝牙/usb 串口了
licoycn
31 天前
可以,甚至网页录屏都可以,比如: https://utils.fun/screen-record ,不过网页截屏只可以对当前页面,具体还需要你自行尝试
nekomiya
31 天前
kk2syc
31 天前
@Kumo31 @musi 你们说的对,是我 IE6 了
subframe75361
31 天前
Edge Ctrl + Shift + S
janus77
31 天前
firefox edge 都自带,国产各大浏览器更是不用说了
xiandao7997
30 天前
很早以前 webqq 时代我记得是能截的

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1065874

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX