Docker系列 深度使用nextcloud(六)在博客中嵌入视频

发布于 2022-07-02  52 次阅读


前言

主要的灵感来源于某个知乎用户说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' /** 添加受信任域名 */
];

这段代码的相对位置如下图所示:

image-20220429080930619

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的命令要注释掉。类似这样:

image-20220429082000259

获取分享链接

Nextcloud获取分享链接的方法之前也说过了。自己看图吧!

image-20220429090930079

链接应该类似于(这里只是示范,此链接无效):

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>

就可以在你的个人博客分享你的视频了!

由于我们只信任了自己的域名,所以其它人用同样的代码是没有办法嵌入你的视频的!

最终效果图:

image-20220429085510814

感觉没有B站视频那种嵌入那么优雅,只能说勉强能用吧!

小结

Nextcloud对Inframe的支持还是差了点,不过勉强可用。对于iframe外观没有要求的小伙伴可以考虑!

我还测试了Embed link-shared video in WordPress?里面的方法,即通过sharingpath插件进行共享。然而,虽然视频可以通过访问链接播放,但是在iframe里不能生效。等以后解决了再来更新此文。可能也是个好办法!

更多Nextcloud玩法敬请期待喽!

参考