如果你是一个喜欢拍抖音快手的站长,那么完全可以把自己这些视频串联起来,做成一个短视频分享程序。下面给大家分享这款短视频在线播放程序源码!
PC截图
手机端截图
演示地址:https://sp.nico.run
代码部署
1.index.html首页
新建一个文件,命名为index.html 放置以下代码保存
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charSet="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta http-equiv="Cache-Control" content="no-transform" /> <meta http-equiv="Cache-Control" content="no-siteapp" /> <meta name="referrer" content="never"> <meta name="renderer" content="webkit" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title> XJJ </title> <link rel="stylesheet" href="style.css"> </head> <body> <section id="main"> <video id="player" src="video.php" controls webkit-playsinline playsinline></video> </section> <section id="buttons"> <button id="switch">连续: 开</button> <button id="next">播放下一个</button> </section> <script> (function (window, document) { if (top != self) { window.top.location.replace(self.location.href); } var get = function (id) { return document.getElementById(id); } var bind = function (element, event, callback) { return element.addEventListener(event, callback); } var auto = true; var player = get('player'); var randomm = function () { player.src = 'video.php?_t=' + Math.random(); player.play(); } bind(get('next'), 'click', randomm); bind(player, 'error', function () { randomm(); }); bind(get('switch'), 'click', function () { auto = !auto; this.innerText = '连续: ' + (auto ? '开' : '关'); }); bind(player, 'ended', function () { if (auto) randomm(); }); })(window, document); </script> </body> </html>
2.video.php 随机播放视频地址
新建文件命名video.php 放置以下代码保存
<?php function read(...$filelist) { $list = []; foreach ($filelist as $file) { $handle = fopen($file, 'r'); while (($line = fgets($handle)) !== false) { array_push($list, trim($line)); } fclose($handle); } return $list; } $list = read('ks.txt'); $url = $list[array_rand($list)]; header("Location: {$url}");
3.style.css CSS样式
新建文件style.css 放置以下代码保存
* { border: 0; margin: 0; padding: 0; outline: none; box-sizing: border-box; } body { background: #000; width: 100vw; height: 100vh; overflow: hidden; display: flex; flex-direction: column; align-items: center; } #main { height: calc(100vh - 60px); display: flex; justify-content: center; align-items: center; } #player { width: 100%; height: auto; max-height: 100%; } #buttons { height: 60px; padding: 10px; } #switch, #next { background: #FFF; background: linear-gradient(to bottom, #FF2,#FB0); color: #AF2E08; font-size: 16px; font-weight: bold; height: 40px; padding: 0px 20px; margin: 0px 5px; border-radius: 20px; }
4.ks.txt 视频播放链接
新建空白文件,命名为ks.txt,之后,放置你的自己拍摄的短视频的视频地址
http://wuzuhua.cn/1.mp4 [video src="http://wuzuhua.cn/2.mp4" /] [video src="http://wuzuhua.cn/3.mp4" /] …… 放置格式,一行一个地址即可!
安装环境
- 服务器或虚拟主机
- nginx1.17
- PHP7.3
没有任何力量能毁了下一代,除了不懂时代的上一代。可以,不错
一别之后,两地相思,只道是三四月,又谁知五六年。
出入相友,守望相助。
你的笑容怡人如晚霞般,在川流不息的时光中,神采飞扬。
宇宙说:你所斗争醉后不知天在水,满船清梦压星河的黑暗就在你心中,你所寻找的光明就在你心中。
醉后不知天在水,满船清梦压星河。
😤😖😜😱
不错的东东,谢谢
666
支持一下
不错不错不错
不错不错不错
不错不错
嗯?
666
希望能对学习php有帮助?
?
111111
1
好东西
666
好东西
?
牛掰
支持一下
9999999
好东西好东西
不错,收藏了
好东西
✗棒棒的✗