SuperPlayer自定义错误页面-西瓜

自定义错误页面

首先需要在播放器的运行目录创建一个名为model的文件夹，如下图

然后在创建的model的文件夹里面创建一个public的文件夹，并在里面创建一个fail.html的错误页面如下图

然后就可以编辑这个html文件用来自定义自己的错误页面

下面是一个举例模板

<!DOCTYPE html>
<html lang="zh">
<!--一般情况下此处不能删除-->
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>解析失败</title>
</head>
<body>
    <!--错误消息API-->
<div th:text="${msg}"></div>
<!--th:text="${msg}"是获取服务器返回给你这个模板的数据获取的语法 其中${msg}就是API的名字-->
</body>
<script id="TempScript">
    /*线路API*/
    let RouteUrls = "[[${RouteUrls}]]";
    /*在JS中API的使用方法和html中有所不同
    由于错误页面需要用到线路功能所以这里还提供了一个获取线路的API
    */
</script>
</html>

然后就是保存文件重新启动播放器 不重启不生效

接下来就是测试结果

可以看到错误消息和后台配置的线路都已经成功获取到了

页面的整体CSS样式和其中线路功能如何处理就看各位开发者了

下面也提供了一些小思路

//比如如何判断线路是否开启和是否配置
//判断开启线路
//线路功能在后台未开启或者开启了没有配置的时候都是会获取到空字符串
if (RouteUrls != ""&&RouteUrls.length!=0)
//获取的线路可以用split(",")来分割每个线路的名字
RouteUrls.split(",");
//使用线路也很简单
window.location.href = "/player?url=" + 要解析的连接 + "&route=" + 线路名称;

文章版权归作者所有，未经允许请勿转载。

THE END

常规文章