如何用PHP的If/Else语句在HTML中展示多格式视频
动态生成多分辨率视频的HTML Source标签实现
方法一:数组循环法(推荐,易维护)
把所有视频分辨率的配置放到数组里,通过循环动态生成标签,后续新增或修改分辨率只需要调整数组即可:
<?php // 定义视频分辨率配置数组,统一管理分辨率信息 $video_configs = [ ['res' => '1080p', 'path' => $video_1080p, 'need_hd_attr' => true], ['res' => '720p', 'path' => $video_720p, 'need_hd_attr' => true], ['res' => '480p', 'path' => $video_480p, 'need_hd_attr' => false], ['res' => '360p', 'path' => $video_360p, 'need_hd_attr' => false], ['res' => '240p', 'path' => $video_240p, 'need_hd_attr' => false], ]; ?> <video controls> <?php foreach ($video_configs as $config): ?> <?php // 处理HD过滤:如果$hd为true,只保留需要添加HD属性的分辨率 if ($hd && !$config['need_hd_attr']) { continue; } // 仅当视频路径非空时生成source标签 if (!empty($config['path'])) { // 构建基础属性,用htmlspecialchars转义路径防止XSS $base_attrs = 'src="' . htmlspecialchars($config['path']) . '" type="video/mp4"'; // 若需要添加HD属性则追加 if ($config['need_hd_attr']) { $base_attrs .= ' data-fluid-hd="true"'; } echo "<source $base_attrs>"; } ?> <?php endforeach; ?> 您的浏览器不支持HTML5视频播放 </video>
方法二:逐个判断法(直观,适合新手)
对每个分辨率变量单独判断,逻辑清晰但扩展性稍差:
<video controls> <?php if (!empty($video_1080p) && (!$hd || $hd)): ?> <source src="<?php echo htmlspecialchars($video_1080p); ?>" type="video/mp4" data-fluid-hd="true"> <?php endif; ?> <?php if (!empty($video_720p) && (!$hd || $hd)): ?> <source src="<?php echo htmlspecialchars($video_720p); ?>" type="video/mp4" data-fluid-hd="true"> <?php endif; ?> <?php if (!empty($video_480p) && !$hd): ?> <source src="<?php echo htmlspecialchars($video_480p); ?>" type="video/mp4"> <?php endif; ?> <?php if (!empty($video_360p) && !$hd): ?> <source src="<?php echo htmlspecialchars($video_360p); ?>" type="video/mp4"> <?php endif; ?> <?php if (!empty($video_240p) && !$hd): ?> <source src="<?php echo htmlspecialchars($video_240p); ?>" type="video/mp4"> <?php endif; ?> 您的浏览器不支持HTML5视频播放 </video>
关键细节说明
- 路径转义:使用
htmlspecialchars()处理视频路径,避免路径中的特殊字符引发XSS安全问题 - 格式适配:
type属性需根据FFmpeg转换的实际视频格式调整,比如WebM格式用video/webm,MP4用video/mp4 - HD过滤逻辑:当
$hd为true时,仅渲染1080p和720p的视频源;为false时,渲染所有非空的视频路径 - 空值处理:通过
!empty()判断变量是否为空,为空则跳过对应source标签的生成
内容的提问来源于stack exchange,提问作者UJJAL
相关产品推荐
相关产品推荐

