语雀等防盗链绕过失败特殊情况及解决
语雀等防盗链绕过失败特殊情况及解决
Natro92问题
前几天看到关于页面的部分图片不显示，当时全部换语雀的图床时候没注意。
尝试解决
后来发现没加载出来的代码都是因为加载的图的位置是背景图，也就导致不能使用之前的禁用referrer策略来绕过防盗链。
比如：
这里使用了css来设定背景图，或者：
都是使用css来设定url内容。就导致修改插件并没有检测到img元素，没有使用替代策略。
首先想到的解决方案是给元素加上禁用策略，但是后面读了文档之后发现：无论用不用css，禁用策略只对a、img、area等起作用。所以即使添加上了还是加载不出来。
再然后考虑就是单独开请求访问，fetch的参数上使用禁用策略，虽然这种方式可以，但是会加重前端的压力，我现在用的这个主题，已经很笨重了，再加几个js，可能会更卡，所以这个方案也后考虑。
然后就考虑换图床，但是其他的图片都直接使用的语雀的，单独为几张图片开一个付费图床不太值。有考虑放在静态文件位置，但是会加速vercel的流量消耗，而且因为cdn比较差，使用效果也不太好。因此别的方法都不行的话再考虑这个。
解决方案
后面就想到用vps将图片解析并缓存，类似cdn的方式。但是突然想到可以让一些放开引用策略的网站去获取图片，在之前的博客就有师傅评论说可以用这种方案。
经过查询发现真有类似的内容：
内容就不多介绍了，也就是通过应用大厂的来源来绕过yuque的白名单过滤。
这里简单列举几个：
搜狗cdn
缺点，可能偶尔会掉。
1 | https://img02.sogoucdn.com/v2/thumb/retype_exclude_gif/ext/auto/q/95/crop/xy/ai/t/0/?appid=122&url= |
使用测试：
1 | https://img02.sogoucdn.com/v2/thumb/retype_exclude_gif/ext/auto/q/95/crop/xy/ai/t/0/?appid=122&url=https://cdn.nlark.com/yuque/0/2024/png/34866087/1711015416373-25c283be-684b-4a65-a71b-4b1ca3f74820.png |
测试图片（如果这张图可以被正常加载，就说明可以用）：
百度cdn1
我现在使用的是这个，感觉还可以。
1 | https://image.baidu.com/search/down?url= |
使用测试：
1 | https://image.baidu.com/search/down?url=https://cdn.nlark.com/yuque/0/2024/png/34866087/1711015416373-25c283be-684b-4a65-a71b-4b1ca3f74820.png |
测试图片（如果这张图可以被正常加载，就说明可以用）：
百度cdn2
1 | https://gimg2.baidu.com/image_search/&app=2020&src= |
使用方法，注意这个地址需要去掉协议头（https://）：
1 | https://gimg2.baidu.com/image_search/&app=2020&src=cdn.nlark.com/yuque/0/2024/png/34866087/1711015416373-25c283be-684b-4a65-a71b-4b1ca3f74820.png |
测试图片（如果这张图可以被正常加载，就说明可以用）：
其他cdn
这里就不一一展示了：
1 | http://collect34.longsunhd.com/source/plugin/yzs1013_pldr/getimg.php?url=https://cdn.nlark.com/yuque/0/2024/png/34866087/1711015416373-25c283be-684b-4a65-a71b-4b1ca3f74820.png |
无法使用：
1 | # 这个掉了 |
总结
可以使用这种办法来绕过所有的yuque防盗链，但是还是建议使用插件自动检测替换，插件无法使用的地方再用这个方法。
