前言
主要的灵感来源于某个知乎用户说TA想要上传视频到自己的博客中。
其实我个人觉得,最佳的方案就是将视频上传到公共平台,然后获取iframe脚本进行插入。比如,我要插入视频:【罗翔】我们为什么要读书?
感觉这个效果已经不错。不过,也许有某些小伙伴有一些别的要求。比如,他想上传自己的视频到自己的博客,但又不想其它人可以随便引用这个视频。说白了,他想让这个视频的分享权限受到限制。
我找了一下,发现Nextcloud确实可以实现这样的效果。大致的思路是这样的:
- 修改
ContentSecurityPolicy.php
文件的$allowedFrameAncestors
增加分享受信任域名 - 修改
OC_Response.php
文件的参数以增强对IE的兼容
下面我们来说一下怎么做吧!
测试环境
还是之前的那个VPS
uname -a # Linux VM-12-8-ubuntu 5.4.0-42-generic #46-Ubuntu SMP Fri Jul 10 00:24:02 UTC 2020 x86_64 x86_64 x86_64 GNU/Linux
docker --version # Docker version 20.10.5, build 55c4c88
docker-compose --version # docker-compose version 1.28.6, build 5db8d86f
修改文件权限
ContentSecurityPolicy
首先,确定之前安装nextcloud的位置:
work=~/docker/nextcloud && cd $work
查看ContentSecurityPolicy.php
的位置:
sudo find $work/app/ | grep ContentSecurityPolicy.php |xargs ls -ld
我的输出为:
-rw-r--r-- 1 www-data root 5908 Apr 23 15:29 /home/test_user/docker/nextcloud/app/lib/private/Security/CSP/ContentSecurityPolicy.php
-rw-r--r-- 1 www-data root 3493 Apr 29 08:10 /home/test_user/docker/nextcloud/app/lib/public/AppFramework/Http/ContentSecurityPolicy.php
-rw-r--r-- 1 www-data root 15197 Apr 23 15:29 /home/test_user/docker/nextcloud/app/lib/public/AppFramework/Http/EmptyContentSecurityPolicy.php
-rw-r--r-- 1 www-data root 3124 Apr 23 15:29 /home/test_user/docker/nextcloud/app/lib/public/AppFramework/Http/StrictContentSecurityPolicy.php
-rw-r--r-- 1 www-data root 1793 Apr 23 15:29 /home/test_user/docker/nextcloud/app/lib/public/AppFramework/Http/StrictEvalContentSecurityPolicy.php
-rw-r--r-- 1 www-data root 1798 Apr 23 15:29 /home/test_user/docker/nextcloud/app/lib/public/AppFramework/Http/StrictInlineContentSecurityPolicy.php
修改这个$work/app/lib/public/AppFramework/Http/ContentSecurityPolicy.php
文件:
sudo vim $work/app/lib/public/AppFramework/Http/ContentSecurityPolicy.php
添加以下内容:
/** @var array Domains which can embed this Nextcloud instance */
protected $allowedFrameAncestors = [
'\'self\'',
'blognas.hwb0307.com' /** 添加受信任域名 */
];
这段代码的相对位置如下图所示:
OC_Response
在某些Nextcloud旧版本中,这个文件可能叫response.php
。
我们找一下这个文件的位置:
sudo find $work/app/ | grep OC_Response.php |xargs ls -ld
输出为:
-rw-r--r-- 1 www-data root 4656 Apr 23 15:29 /home/test_user/docker/nextcloud/app/lib/private/legacy/OC_Response.php
此时修改这个文件$work/app/lib/private/legacy/OC_Response.php
:
sudo vim $work/app/lib/private/legacy/OC_Response.php
添加内容为(对应的改成自己的域名吧):
header('X-Frame-Options: ALLOW-FROM https://blog.hwb0307.com');
header('X-Content-Security-Policy: frame-ancestors https://*.hwb0307.com');
header('Content-Security-Policy: frame-ancestors https://*.hwb0307.com');
当然,原来那个禁止iFraming的命令要注释掉。类似这样:
获取分享链接
Nextcloud获取分享链接的方法之前也说过了。自己看图吧!
链接应该类似于(这里只是示范,此链接无效):
https://nextcloud.example.com/s/DAsR258Iw7xWnFm
分享到个人博客
最后,在MarkDown里源代码界面插入这个代码:
<iframe src="https://nextcloud.example.com/s/DAsR258Iw7xWnFm" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" style="width: 100%; height: 500px; max-width: 100%;align:center; padding:20px 0;"> </iframe>
就可以在你的个人博客分享你的视频了!
由于我们只信任了自己的域名,所以其它人用同样的代码是没有办法嵌入你的视频的!
最终效果图:
感觉没有B站视频那种嵌入那么优雅,只能说勉强能用吧!
小结
Nextcloud对Inframe的支持还是差了点,不过勉强可用。对于iframe外观没有要求的小伙伴可以考虑!
我还测试了Embed link-shared video in Wordpress?里面的方法,即通过sharingpath插件进行共享。然而,虽然视频可以通过访问链接播放,但是在iframe
里不能生效。等以后解决了再来更新此文。可能也是个好办法!
更多Nextcloud玩法敬请期待喽!
参考
- Nextcloud 19 Server: Allow iframe / embedding from external Domains
- Embed link-shared video in Wordpress?