1.安装宝塔面板
为什么安装宝塔面板，因为宝塔面板的图形化界面使操作更加方便简洁，不需要手动去终端输入路径一个一个打开文件内容查看。
安装入口：https://www.bt.cn/new/index.html
这里我使用了自己购买的云服务器，直接在云服务器上安装即可。
查看面板是否安装成功：（输入14，进入面板）
2.在宝塔面板中添加站点信息
将云服务的ip地址填写进去，端口可变可不变，默认80，想用别的端口记得去云服务器操作台开放安全组。
提交后，访问ip地址，可以看见站点搭建成功的页面。
3.导入代码
站点搭建完毕后，进入网站根目录下的对应目录，将播放器的代码导入该目录下。
这里我导入了自己的几个代码文件，包括index.html（将原始代码删除，粘贴为自己编写后的代码）、yourScript.js（用来加载.mpd文件）、manifest.mpd（使用ffmpeg制作的.mpd文件）、以及三个output.mp4（制作.mpd文件结束后，生成的不同码率的视频文件），其中，需要确保manifest.mpd文件符合dash视频传输标准，即DASH-AVC/264。
index.html
<!DOCTYPE html>
<html>
<head>
<title>DASH.js Test</title>
<style>
/* 你也可以使用CSS来设置视频播放器的大小 */
#videoPlayer {
width: 640px;
height: 360px;
}
</style>
</head>
<body>
<video id="videoPlayer" controls></video>
<script src="./dash.js-4.7.2/dist/dash.all.min.js"></script>
<script>
var url = 'https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd';
var player = dashjs.MediaPlayer().create();
player.initialize(document.querySelector('#videoPlayer'), url, true);
</script>
</body>
</html>
yourScript.js
document.addEventListener('DOMContentLoaded', function() {
const video = document.getElementById('video');
const player = new shaka.Player(video);
player.addEventListener('error', function(event) {
console.error('Player error:', event.detail);
});
player.load('https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd').catch(function(error) {
console.error('Error loading the manifest:', error);
});
});
如果播放失败，应该是.mpd文件编码的问题，解决方法是：使用ffmpeg、MP4Box，将音频和视频分离，并在dash封装的时候为它们单独加工。
不过由于我的.mpd文件也有问题，所以推荐一个可用的链接：https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd
4.云服务器导入dash.js文件
由于之前想导入在/home/ubuntu下，方便后续使用，但是控制台总是报错，找不到http://43.135.*.*/dash.js-4.7.2/dist/dash.all.min.js，我就直接导入index.html同一目录下了，有时间再思考绝对路径的问题吧。
导入方法，先下载，后解压：
wget https://github.com/Dash-Industry-Forum/dash.js/archive/refs/tags/v4.7.2.zip unzip v4.7.2.zip
如果没有安装unzip：
sudo apt-get install unzip
5.进入网页，播放视频
很简易的一个播放器：
标签：播放器,mpd,30fps,bbb,js,dash,error,搭建 From： https://www.cnblogs.com/eisenshu/p/17747083.html