安装Oneindex&aria2下载完成后自动上传至Onedirve&Onedrive跨域显示字幕

Posted by xx on September 12, 2018

本文设置的下载文件放置目录为 /home/download ,可自行修改

已知问题

字幕仅在 Firefox 和 Edge 上可以看到,手机浏览器多数对MKV格式的文件播放有性能问题(帧数较低,有卡顿感,除了小米默认浏览器没这个毛病)

安装宝塔面板

Centos安装命令:

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install.sh && sh install.sh

Ubuntu/Deepin安装命令:

wget -O install.sh http://download.bt.cn/install/install-ubuntu.sh && sudo bash install.sh

Debian安装命令:

wget -O install.sh http://download.bt.cn/install/install-ubuntu.sh && bash install.sh

Fedora安装命令:

wget -O install.sh http://download.bt.cn/install/install.sh && bash install.sh

安装完成后登陆面板,安装NGINX和PHP(PHP >= 5.6)

安装并配置aria2

在安装LNMP过程中,可以不用等它安装完,这边同时安装aria2

Aria2一键安装脚本

wget -N --no-check-certificate https://raw.githubusercontent.com/ToyoDAdoubi/doubi/master/aria2.sh && chmod +x aria2.sh && bash aria2.sh

然后输入 bash aria2.sh,选择修改配置文件,修改dir为/home/download,并在最后插入新的一行 on-download-complete=/root/autoupload.sh

img

修改完后会弹回关键aria2配置信息,记下来(类似如下)

Aria2 简单配置信息:

 地址	: 1.1.1.1
 端口	: 6800
 密码	: cde45d8274b598e96ae2
 目录	: /home/download

[信息] Aria2 启动成功 !

在/root目录下新建文件autoupload.sh

由于睿智的??系统导致这个脚本显示错误,直接复制的无法使用,请移步 https://sigma.whoa.top/post/one/autoupload.sh 观看

给予脚本执行权chmod +x autoupload.sh,并在面板放行aria2端口(默认为6800,可自行设定)

img

安装Oneindex

https://github.com/donwa/oneindex下载代码,放到网站目录下,过程略

网站伪静态代码(可选)

if (!-f $request_filename){
set $rule_0 1$rule_0;
}
if (!-d $request_filename){
set $rule_0 2$rule_0;
}
if ($rule_0 = "21"){
rewrite ^/(.*)$ /index.php?/$1 last;
}

img

配置信息获取方法如图

img

安装完成后后台登陆地址为: http://你的域名或ip/?/admin

刷新参数用crontab -e录入定时任务即可

配置Onedrive上传

wget --no-check-certificate -q -O /tmp/OneDrive.sh "https://raw.githubusercontent.com/weiyidu/OneDrive/master/OneDrive.sh" && chmod +x /tmp/OneDrive.sh && bash /tmp/OneDrive.sh

请将三个参数填入/usr/local/etc/OneDrive/onedrive.cfg 如下示例:

export api_client_id="ea2b36f6-b8ad-40be-bc0f-e5e4a4a7d4fa"
export api_client_secret="h27zG8pr8BNsLU0JbBh5AOznNS5Of5Y540l/koc7048="
export api_reply_url="https://onedrive.live.com/about/business/"

1、运行语句 onedrive -a

2、将返回的网址复制到浏览器中打开

3、登陆你的OneDrive for Business账号

4、登陆成功后复制地址栏中的地址,并提取code的字段(code=后面至&前面,即code和session之间的那段)

5、粘贴至终端,并敲回车键

如果返回错误信息,请检查code字段,或重新生成密钥

如果返回以下字段:

It seems like we have a refresh token, so we are ready to go

恭喜你,设置成功!

如果返回错误信息,请检查code字段,或重新生成密钥.

使用

懒得自己装aria2面板了,直接打开 http://aria2.net/

选择AriaNg设置中的RPC项,填入正确的地址和密匙,上面提到

Aria2 简单配置信息:

 地址	: 1.1.1.1
 端口	: 6800
 密码	: cde45d8274b598e96ae2
 目录	: /home/download

[信息] Aria2 启动成功 !

那么IP就是 1.1.1.1,密匙是cde45d8274b598e96ae2,下载时确认下载目录是否为/home/download

Oneindex 字幕

最终效果

示例请移步到 https://delta.whoa.top/video/ 视频名称为Stellaris.mp4

操作步骤 一、在view文件中新建js文件夹,然后下载https://github.com/Dador/JavascriptSubtitlesOctopus/tree/master/js/asmjs 中的四个文件,并放在新建的js文件夹中

二、修改模版文件video.php(文件在view/material或nexmoe/show,后台选择哪个,就修改哪个。) (要注意的是你修改的video.php文件和你的视频输出播放器有关,你用哪个播放就用哪个播放器)

这是原代码

<?php view::layout('layout')?>
 
<?php 
$item['thumb'] = onedrive::thumbnail($item['path']);
?>
 
<?php view::begin('content');?>
<div class="mdui-container-fluid">
	<br>
	<video class="mdui-video-fluid mdui-center" preload controls poster="<?php @e($item['thumb']);?>">
	  <source src="<?php e($item['downloadUrl']);?>" type="video/mp4">
	</video>
	<br>
	<!-- 固定标签 -->
	<div class="mdui-textfield">
	  <label class="mdui-textfield-label">下载地址</label>
	  <input class="mdui-textfield-input" type="text" value="<?php e($url);?>"/>
	</div>
	<div class="mdui-textfield">
	  <label class="mdui-textfield-label">引用地址</label>
	  <textarea class="mdui-textfield-input"><video><source src="<?php e($url);?>" type="video/mp4"></video></textarea>
	</div>
</div>
<a href="<?php e($url);?>" class="mdui-fab mdui-fab-fixed mdui-ripple mdui-color-theme-accent"><i class="mdui-icon material-icons">file_download</i></a>
<?php view::end('content');?>

修改后的文件(把video2.php复制一份改改就行)

<?php view::layout('layout')?>
 
<?php 
//仅支持教育版和企业版
if(strpos($item['downloadUrl'],"sharepoint.com") == false){
	header('Location: '.$item['downloadUrl']);exit();
}
$item['thumb'] = onedrive::thumbnail($item['path']);
$mpd =  str_replace("thumbnail","videomanifest",$item['thumb'])."&part=index&format=dash&useScf=True&pretranscode=0&transcodeahead=0";
?>
 
<?php view::begin('content');?>
<link class="dplayer-css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/dplayer/dist/DPlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/dashjs/dist/dash.all.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dplayer/dist/DPlayer.min.js"></script>
<script src="//pan.mals.shop/view/js/subtitles-octopus.js"></script>
<div class="mdui-container-fluid">
	<div class="nexmoe-item">
		<div class="mdui-center" id="dplayer"></div>
	<!-- 固定标签 -->
	<div class="mdui-textfield">
	  <label class="mdui-textfield-label">下载地址</label>
	  <input class="mdui-textfield-input" type="text" value="<?php e($url);?>"/>
	</div>
	<div class="mdui-textfield">
	  <label class="mdui-textfield-label">引用地址</label>
	  <textarea class="mdui-textfield-input"><video><source src="<?php e($url);?>" type="video/mp4"></video></textarea>
	</div>
</div>
<script>
const dp = new DPlayer({
	container: document.getElementById('dplayer'),
	lang:'zh-cn',
	video: {
	    url: '<?php e($item['downloadUrl']);?>',
	    pic: '<?php @e($item['thumb']);?>',
	    type: 'auto'
	},
      subtitle: {
        url: '<?php $urlparts = pathinfo($url); e($urlparts['dirname'].'/'.$urlparts['filename'].'.vtt');?>',
        type: 'webvtt',
        fontSize: '29px',
        bottom: '2%',
        color: '#ffffff'
    }
});
dp.on('canplay', function () {
    var video = document.getElementsByTagName('video')[0];
    window.SubtitlesOctopusOnLoad = function () {
        var options = {
            video: video,
            subUrl: '<?php $urlparts = pathinfo($url); e($urlparts['dirname'].'/'.$urlparts['filename'].'.ass');?>',
            fonts: ["//gapis.geekzu.org/g-fonts/ea/notosanssc/v1/NotoSansSC-Regular.otf", "//gapis.geekzu.org/g-fonts/ea/notosanstc/v1/NotoSansTC-Regular.otf", "//gapis.geekzu.org/g-fonts/ea/notosansjapanese/v6/NotoSansJP-Regular.otf"],
            workerUrl: '//pan.mals.shop/view/js/subtitles-octopus-worker.js'
        };
        window.octopusInstance = new SubtitlesOctopus(options);
   };
    if (SubtitlesOctopus) {
       SubtitlesOctopusOnLoad();
   }
})
</script>
<a href="<?php e($url);?>" class="mdui-fab mdui-fab-fixed mdui-ripple mdui-color-theme-accent"><i class="mdui-icon material-icons">file_download</i></a>
<?php view::end('content');?>

修改注释:

1、调用第一步下载的文件,域名修改成你自己的(教程里中的地址会随时改变)

1、<script src="//pan.mals.shop/view/js/subtitles-octopus.js"></script>
2、workerUrl: '//pan.mals.shop/view/js/subtitles-octopus-worker.js'

2、这是DPlayer字幕参数配置

      subtitle: {
        url: '<?php $urlparts = pathinfo($url); e($urlparts['dirname'].'/'.$urlparts['filename'].'.vtt');?>',
        #字幕位置
        type: 'webvtt',
        #字幕格式
        fontSize: '29px',
        #字幕文字大小
        bottom: '2%',
        #到底视频底部位置
        color: '#ffffff'
        #文字颜色
    }

3、ASS/SSA配置

dp.on('canplay', function () {
    var video = document.getElementsByTagName('video')[0];
    window.SubtitlesOctopusOnLoad = function () {
        var options = {
            video: video,
            subUrl: '<?php $urlparts = pathinfo($url); e($urlparts['dirname'].'/'.$urlparts['filename'].'.ass');?>',
            #字幕位置
            fonts: ["//gapis.geekzu.org/g-fonts/ea/notosanssc/v1/NotoSansSC-Regular.otf", "//gapis.geekzu.org/g-fonts/ea/notosanstc/v1/NotoSansTC-Regular.otf", "//gapis.geekzu.org/g-fonts/ea/notosansjapanese/v6/NotoSansJP-Regular.otf"],
            #引用字体
            workerUrl: '//pan.mals.shop/view/js/subtitles-octopus-worker.js'
        };
        window.octopusInstance = new SubtitlesOctopus(options);
   };
    if (SubtitlesOctopus) {
       SubtitlesOctopusOnLoad();
   }
})

字幕文件名字一定要和视频名字一致。

字幕文件名字一定要和视频名字一致。

字幕文件名字一定要和视频名字一致。

但是,到这里只能在Firfox(火狐或) 微软的Edge 浏览器中才能显示字幕(其他未测试)

因为在其它浏览器中字幕文件会提示

XXXXXXXXXX has been blocked by CORS policy XXXXXXXXXX

解决方法:Chrome浏览器安装插件 allow-control-allow-origi 或 access-control-allow-origin(推荐),安装之后开启插件就可以正常显示字幕了。

示例

视频外链示例: 按照Oneindex上面的提示HTML引用,是只有一个<video>标签的,需要自己另外加controls,没有这个就没有控制器,播放不了,还有就是视频的宽和高,不设置的话会超出页面的尺寸(还有就是格式要对,不然MKV用MP4格式默认打开是加载失败要在点击一次播放键?)

Stellaris MP4格式

<video src="https://delta.whoa.top/video/Stellaris.mp4" width="100%" height="100%" controls="controls" type="video/mp4">
</video>

Detroit MKV 格式

<video src="https://delta.whoa.top/%E6%B5%8B%E8%AF%95_%E5%BA%95%E7%89%B9%E5%BE%8B.mkv" width="100%" height="100%" controls="controls" type="video/mkv">
</video>

音频外链示例: GlassWalls.mp3

<audio controls="">
<source src="https://delta.whoa.top/others/GlassWalls.mp3">
</audio>

参考资料:

https://moeclub.org/2017/03/17/24/

https://www.234du.com/1171.html

https://www.234du.com/1170.html

https://www.234du.com/1185.html