用什么样的方法防止图片被抓取？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

• 请不要在回答技术问题时复制粘贴 AI 生成的内容

这是一个创建于 2284 天前的主题，其中的信息可能已经有所发展或是发生改变。

公司接了个活，老板说能赚不少钱，对外展示高清照片，后端存储什么的都做好了，现在做到前端了

其中所有匿名用户都能够看到一部分照片，其他的需要登录才能看，但客户的要求是图片需要防止被任意抓取

有没有什么技术能实现随便被抓的，也不用完全避免被抓取，只要能相对不容易被下载就好了

第 1 条附言 · 2018-09-13 11:10:29 +08:00

感谢大家的回复，感谢已送出，就不单独回复了

现在的方案是这样的：

所有图片在服务器里面，通过加密生成字符串，同时尝试生成隐藏的水印

客户端解密后展示出来

加密和解密使用临时的 salt，

限制一下访问频率。

就先这样了，谢谢

防止

图片

照片

匿名

97 条回复 • 2018-09-13 16:57:33 +08:00

huangke

2018-09-12 12:05:38 +08:00

个人觉得这个需求没有两把刷子做不到吧？看看其他人有什么高见

Cheez

2018-09-12 12:07:37 +08:00 via Android

....还防止任意抓取，反正只要有登陆账户就能抓你的图片，你只能控制他抓取的频率，频率高就封号封 ip。图片本身就验证 http 头，就这样了。

imn1

2018-09-12 12:14:08 +08:00

介绍那个什么四姐骂客腚，或者中国什么图网给你的客户

Sor

2018-09-12 12:14:31 +08:00

好奇网站内容，防止被任意抓取是只有登录查看的图片还是包含匿名也可以看到的图片呢

xor

2018-09-12 12:16:11 +08:00 via iPhone

js 获取加密图片，解密后绘制到 canvas

opengps

2018-09-12 12:19:20 +08:00

高清图片的下载展示用积分，积分用钱买

F1024

2018-09-12 12:26:14 +08:00

漫画网站你去研究下一般都有防下载

php01

2018-09-12 12:28:06 +08:00

所见即所得，只能控制"见"，比如 VIP 会员每天可见次数限制，或购买才可见

wizardoz

2018-09-12 12:49:55 +08:00

用瓦片图显示图片

rexxtem07

2018-09-12 12:54:44 +08:00 via iPhone

FlashPlayer 解密显示？

wuhhhh

2018-09-12 13:01:59 +08:00 via iPhone

叼如 eh 也挡不住爬虫的，但是人家直接把大陆 ip 禁了

moult

2018-09-12 13:08:34 +08:00 via iPhone

不管怎么做，都防不了用户直接截图。

ericgui

2018-09-12 13:10:39 +08:00

其实这无解的，你只能先搞起来，然后看日志，人工对某些坏蛋进行截留。

说白了反爬虫，先有爬虫，再去反吧？

001enoolleh

2018-09-12 13:12:12 +08:00

加水印，超大范围的那种，

KgM4gLtF0shViDH3

2018-09-12 13:13:21 +08:00

@xor #5 那 js 怎么防止被抓到呢

zpf124

2018-09-12 13:13:39 +08:00

@xor canvas 也能右键另存为图片的吧...

我感觉可能除了被淘汰的 flash 以外，就只有裁剪成 n 块碎片，然后用 css 拼成一张图，这样视觉上是一张图，dom 结构上则是杂乱无章的。

但这只能防扒原图，包括 flash 也不能防止人家截图。

jswh

2018-09-12 13:14:29 +08:00

websocket 加密传输图片数据，接收后画到 canvas 上可能可以。性能网速啥的可能不好。

jswh

2018-09-12 13:17:17 +08:00

@zpf124 canvas 右键保存的是整个 canvas 的样子，如果要不能右键就甚至 backgrou-img 就好了

jswh

2018-09-12 13:17:32 +08:00

@jswh background-img

pinews

2018-09-12 13:23:12 +08:00

图片不要用 img 标签，全改成 background-image，应该能防一部分。
@jswh 对

nilrust

2018-09-12 13:24:25 +08:00

简单啊，

类似之前流行的 QQ 群那种付费看图，

图片用 base64 传送内容，也就没有真正意义上的图片链接地址，没付费前传模糊图片，付费后传一次清楚的图片。

stargazer242

2018-09-12 13:25:12 +08:00

全图水印

LuffyGu

2018-09-12 13:28:05 +08:00

backgroun-image 也能抓。

NicholasYX

2018-09-12 13:33:10 +08:00

加水印

MorningBOBO

2018-09-12 13:35:03 +08:00

给你的图片加水印,抓取你就是变相推广.不是美滋滋

jiafaner

2018-09-12 13:43:30 +08:00

@Sor 这块的需求还不明确，但目前来说，客户只提了强烈的需求，就是不能随便被抓走了

jiafaner

2018-09-12 13:43:55 +08:00

@NicholasYX
@MorningBOBO 加水印这个说过了，可是客户说不能全部打水印。

luoway

2018-09-12 13:47:07 +08:00

往 canvas 标签里绘制图片，图片是 base64 的更好（但性能更差）

fuermosi777

2018-09-12 13:47:52 +08:00

预览时显示一个低分辨率的缩略图，鼠标点击一个区域（比如 x=30,y=40)，后端计算位置然后加载这个区域的高清图(比如 w=100,h=100 ），用户每点击一处，显示一处的高清图。我们之前学校负责照毕业照的奸商就是这么干的（为了防止下载高清毕业照）。

jiafaner

2018-09-12 13:48:09 +08:00

@fuermosi777 太厉害了。

maxxfire

2018-09-12 13:49:18 +08:00

把图片做成视频，让它慢慢爬吧。

tomfs

2018-09-12 13:51:16 +08:00

不加盐,貌似只能这样了.
https://www.patrick-wied.at/talks/image-protection/demos/demo-encrypted.html
加盐的话,用 webgl 吧

ala2008

2018-09-12 13:58:27 +08:00

学习哈。。

vjnjc

2018-09-12 13:58:30 +08:00

感觉和技术无关。

没登录，或者是普通用户给他看普通图，vip 用户才给看高清图~
这也防不了 vip 用户用技术手段下载图片，只能法律见了。

txwd

2018-09-12 14:06:19 +08:00

插个眼，也想知道有什么好办法

3a3Mp112

2018-09-12 14:08:25 +08:00

天狼星之类的客户端是能最大限度的防止技术手段录像和截图的。
但是直接过手机拍照无解。

kernel

2018-09-12 14:12:11 +08:00 via Android

把大图随机分割成大量小图, 在客户端拼接起来显示

infra

2018-09-12 14:13:44 +08:00

不展示原图，只用 image-data 展示原图编码

alwayshere

2018-09-12 14:17:05 +08:00

后端把图片打乱，前端拼成 css sprite 展示，但是我用 phantomjs 截图又完了，所以，这题无解

aitaii

2018-09-12 14:25:00 +08:00

手机拍照无解

bumz

2018-09-12 15:17:07 +08:00

简单地说，能免费看到就能免费抓到

各种技术只不过防零预算小白，大不了我雇佣一堆廉价劳动力手工截图

weipt

2018-09-12 15:43:33 +08:00

用一般网站验证码的技术控制图片

uuair

2018-09-12 16:02:07 +08:00

不要用技术解决问题。。。。你把图片放到视觉中国上去，然后谁用了你的图，就让视觉中国起诉他。你俩一起赚钱，何乐不为。

yksoft1

2018-09-12 16:12:15 +08:00

也只有加水印或者不可见数字水印了。
图源拿 JS 加密了，防不住浏览器插件；浏览器插件防住了，防不住操作系统的截图；操作系统的截图防住了，防不住 VGA/HDMI 采集卡。

bumz

2018-09-12 16:13:37 +08:00

放一个服务器加密，前端解密的 demo

https://bumfo.github.io/protect/index

打开控制台，只能看到一个加密过的脚本和加密过的图片

VgV

2018-09-12 16:17:37 +08:00

flash

locoz

2018-09-12 16:19:58 +08:00

注册需要正常手机号+注册最后一步付费验证+登陆付费可见+每天可见高清图片数量限制+图片加密后 js 渲染+隐式水印，js 高度混淆+动态生成+每次更换。
这样够复杂了吧？然而还是挡不住人家招一群实习生手动截图保存

TomatoYuyuko

2018-09-12 16:21:02 +08:00

加水印加法律声明，不然截屏或者拍照岂不是无解。

w516322644

2018-09-12 16:33:27 +08:00

@uuair 2333

Famio

2018-09-12 16:36:39 +08:00

赞同图片加水印，数字的那种
这里是我之前看到过的方案： http://accu.cc/content/pil/watermark/

JmmBite

2018-09-12 16:38:40 +08:00

记得有个漫画是把每张图片分为 N 部分打乱合成，然后前端重组后正常显示。

hicdn

2018-09-12 16:39:16 +08:00

@fuermosi777 用 phantomjs 把图点一遍，就可以下载完高清图，再用 imagemagic 拼接好。现在用 chrome headerless 更方便了

zsdroid

2018-09-12 16:50:15 +08:00

@bumz #45 你以为去掉 canvas 的鼠标事件就万事大吉了？？

coolcoffee

2018-09-12 16:54:09 +08:00

可以参考一下 pexels.com ，注册和登录都要过 Google 家 reCAPTCHA 的，然后登录后才能下载高清图，每下载 10 张就触发一次 reCAPTCHA 验证。整个网站应该上百万条数据，要一个个点验证码几乎不可能了。

bumz

2018-09-12 18:08:27 +08:00

@zsdroid #53 canvas 保存图片和和截图的原理是一样的，这个只要绘制 canvas 的时候加上水印就行了

xd314697475

2018-09-12 18:39:21 +08:00

我记得我们老师讲过

把图切成若干个部分，然后+水印

前几天遇到一个网站是对访问进行限制，大概是必须包含特定头文件才能访问

uptime

2018-09-12 19:49:36 +08:00

感觉是 H 站……

sampeng

2018-09-12 20:12:54 +08:00

其实没什么意义。你防一次。我只要下一次就可以无限制分发。
除了水印，几乎无解。网页版的东西。有无数办法爆破。。flash 会好点。分块成无数的小图片。然后 flash 按规则拼起来。但你也挡不住直接屏幕截图的。。。。

sampeng

2018-09-12 20:14:54 +08:00

如果你的东西很有价值。。要知道中国有一批人是天天在家闲着没事干的。。人力外包 1 张图 1 毛钱-1 块钱。大把的人抢着干

bk201

2018-09-12 20:16:43 +08:00

有个做法就是转成 flash

qiuqiuer

2018-09-12 20:17:44 +08:00

截图特征搜索没什么办法

qsbaq

2018-09-12 20:29:43 +08:00

几乎无解~

hackxing

2018-09-12 20:47:17 +08:00

大佬们，可以看看中国汽车报的图片处理，我是没抓回来图片。
http://www.cnautonews.com/

defel

2018-09-12 22:07:27 +08:00 via iPhone

截图无解，如果还不行，手机对着电脑拍照就更无解了。。

cy97cool

2018-09-12 23:13:27 +08:00

@bumz F12 控制台直接对 canvas 转 base64
document.querySelector("body > canvas").toDataURL("image/png")

xider

2018-09-12 23:16:20 +08:00 via Android

webp，header 里设置成 jpeg

crab

2018-09-12 23:27:19 +08:00

这和防止视频翻录一样无解

cy97cool

2018-09-12 23:38:31 +08:00

@tomfs 虽然 js 里面把 canvas 的 toDataURL 给覆盖了但我们还是可以创建一个 iframe 来获取原本的函数
var i = document.createElement('iframe');
i.style.display = 'none';
document.body.appendChild(i);
var c=i.contentDocument.createElement("canvas")
c.toDataURL.call(document.getElementsByTagName("canvas")[0])

WriteJob

2018-09-12 23:50:01 +08:00

了解一下~

yankebupt

2018-09-12 23:50:34 +08:00

@jiafaner
如果是观赏类图片(口水)
不知道可不可以打一个 alpha 值很低不影响美观效果，但是抠图起来特别费劲且必定留痕迹的彩色智能水印.....
楼主下次发这个帖子的时候贴两张图诱惑一下我们也好有动力回帖啊....
这次就算了，说不定问之前都是有图库没版权放出来要出事...下次记得买几张图放出来贿赂一下 233

jiafaner

2018-09-13 00:06:38 +08:00

@yankebupt 不是观赏类的图啊，是一些特别专业的一些行业图，都是些图纸啥的，也有一些有版权的照片，还有一些奇怪的不认识的东西

libook

2018-09-13 00:07:33 +08:00

puppeteer 项目了解一下，你就理解了什么是能见到就能抓到。

CDN Token 鉴权、Canvas 绘制、高频水印、IP 限流等等无非就是提升爬图的难度，但都是可破解的，防菜鸟不防大牛，之前新闻里说的阿里能在截图里藏匿截图者的信息，但这也只是为了事后调查保存证据。

牛 13 的公司从来都是通过法务手段来解决版权问题的，参见迪斯尼、甲骨文和微软。。。