laoyang
bee1d077d8
用户报（2026-11-05）：「你好像把 .mp4 后面也带上了问号，写成了 1600
这样的参数…你刚才没有进行图片压缩的时候，我自己播放好像还是好的。
是你更新了这个功能之后，出了这个问题。」
用户完全正确，这是我的错。
根因：media.php 只看 $imgW，没判是不是图片：
Storage::read($familyId, $key, $imgW > 0 ? $OssSizes[$imgW] : );
⇒ 视频 URL 带 ?w=1600 后，给 .mp4 对象传了
x-oss-process=image/resize,l_1600
⇒ OSS 图片处理服务对非图片返回错误内容
⇒ <video> 拿不到有效数据 ⇒ 播不了
三道防线：
1. _attachments.php（直接触发点）
原来对所有附件都传 w=1600。改为 $attKind === image 才传。
视频只传 v（版本号，破缓存用）。
2. media.php（核心防线）
$imgW 与 $isImageKey 绑定，只有图片才允许压缩。
$isImageKey 判定提前到 Storage::read 之前，
并扩到扩展名兜底（jpg/png/webp...），
视频/文档扩展名强制 false。
3. media_url()（前置防线）
生成 URL 时按扩展名过滤：非图片自动去掉 w。
这样即使调用方传错，URL 里也不会出现无效参数。
验证（模拟事故场景，URL 带 ?w=1600 请求 .mp4）：
HTTP 206，Content-Type: video/mp4
无 hvc1，含 avc1
ffprobe: h264/yuv420p，2.19MB ✅ 正常
media_url 生成视频 URL：...mp4&v=2295119（无 w）
media_url 生成图片 URL：...jpg&w=1600&v=609017（有 w）
133 lines
7.5 KiB
PHP
133 lines
7.5 KiB
PHP
<?php
|
||
/**
|
||
* 附件缩略图墙（v24 用户第 3 条；第 19 批 第 6 条改）。
|
||
*
|
||
* 一处渲染、全站通用：旅程节点 / 资源 / 任务 / 日程的附件都长一样。
|
||
*
|
||
* 规则（用户原话）：
|
||
* · 图片、视频 → **缩略图**，点开在**本页**预览（不再新开标签页）
|
||
* · PDF → 浏览器里直接预览（自带阅读器）
|
||
* · Word / Excel / PPT / 其它 → 一个**和缩略图一样大**的图标，点了直接下载
|
||
* （浏览器渲染不了的东西，绝不装一个"点了没反应"的预览）
|
||
* · 预览框**右上角**恒有一个下载按钮
|
||
*
|
||
* ────────────────────────────────────────────────────────────────
|
||
* v24 第 19 批 用户第 6 条（本次改的三点）：
|
||
* 「图片和视频，文件名都是 md5 的，放在图片预览图下面没有任何意义，去掉吧。」
|
||
* 「如果是文件，则在图标上显示文件名。」
|
||
*
|
||
* ① 图片 / 视频**下面不再写文件名与大小** —— 那串是用户手机上传时的原始名，
|
||
* 而照片/视频是**看**的，一串 `9d3fcc70fe46161275f850b93470e0bb.mp4`
|
||
* 既认不出内容、也不比缩略图本身多任何信息。
|
||
* （图与视频仍带 title 悬停提示，「下载」按钮也还在 —— 功能没少，只是不占版面。）
|
||
* ② 非图片的**文件**（PDF/Word/Excel/PPT/文本）：文件名挪到**图标里面**，
|
||
* 压着色块显示。文件是**读名字**的，「学位学历证书_博士学位证书.pdf」
|
||
* 这行字本身就是最重要的信息，放在图标下方的小灰字里反而看不清。
|
||
* ③ 删除按钮与下载入口保留在缩略图下方（.att-meta 仍在，只是不再放文件名/大小）。
|
||
*
|
||
* 用法（先准备变量再 require）：
|
||
* $attRows 附件行（Attachment::list 的结果）
|
||
* $attCanEdit 是否显示删除按钮
|
||
* $attDelUrl 删除动作的路由名（如 'resources/attach_del'）
|
||
* $attHostId 删除时要回传的宿主 id（表单里的隐藏字段用 $attHostKey 指定键名）
|
||
* $attDelField 删除表单里「附件 id」的字段名（各路由不一致：有的叫 id、有的叫 attach_id）
|
||
* $attExtra 额外隐藏字段 [键 => 值]（如日程要连带传宿主 id 才能判权限）
|
||
*
|
||
* ⚠️ 无 JS 也能用：可预览的是 <a href=预览地址>，不可预览的是 <a href=下载地址>，
|
||
* 脚本只是把"可预览"的那部分拦下来改成弹层。
|
||
*/
|
||
|
||
$attCanEdit = !empty($attCanEdit);
|
||
$attRows = $attRows ?? [];
|
||
$attDelField = $attDelField ?? 'id';
|
||
$attExtra = $attExtra ?? [];
|
||
$attDelUrl = $attDelUrl ?? '';
|
||
?>
|
||
<?php if ($attRows): ?>
|
||
<div class="att-wall">
|
||
<?php foreach ($attRows as $attRow): ?>
|
||
<?php
|
||
$attKind = \App\Attachment::kind($attRow);
|
||
$canPrev = \App\Attachment::previewable($attRow);
|
||
/* 🔴🔴 #56（用户 2026-11-05：「你好像把 .mp4 后面也带上了问号，
|
||
写成了 1600 这样的参数…是你更新了这个功能之后，出了这个问题」）
|
||
|
||
**压缩档位只能给图片。** 原来这里对**所有附件**都传 `w=1600`：
|
||
视频 URL 变成 `media.php?k=xxx.mp4&w=1600` ⇒ OSS 收到
|
||
`x-oss-process=image/resize,l_1600` 去处理 .mp4 ⇒ 返回错误内容
|
||
⇒ `<video>` 拿不到有效数据 ⇒ **播不了**。
|
||
|
||
⇒ `$attKind === 'image'` 才传 `w`。
|
||
|
||
⚠️ `v`（版本号）**所有类型都传** —— 视频转码后靠它破缓存。
|
||
⚠️ 下载链接 `$attDl` 一律不带 `w`（要原文件，不能偷偷降质）。 */
|
||
$attOpts = $attKind === 'image' ? ['w' => 1600] : [];
|
||
$attView = media_url((string)$attRow['key'], $attOpts,
|
||
(int)($attRow['size'] ?? 0));
|
||
$attDl = media_url((string)$attRow['key'], ['dl' => 1]);
|
||
$attNm = (string)($attRow['name'] ?? '');
|
||
$attSz = \App\Attachment::sizeWord($attRow['size'] ?? 0);
|
||
// ① 图片 / 视频：下面不放文件名（见文件头说明）
|
||
$attIsMedia = ($attKind === 'image' || $attKind === 'video');
|
||
// ② 文件：图标上显示文件名；没有名字时退回类别词（「PDF」「Word」…）
|
||
$attFileWord = $attNm !== '' ? $attNm : \App\Attachment::kindWord($attKind);
|
||
?>
|
||
<div class="att-cell">
|
||
<?php if ($canPrev): ?>
|
||
<a class="att-thumb att-kind-<?= e($attKind) ?>"
|
||
href="<?= e($attView) ?>"
|
||
data-prev="<?= e($attKind === 'pdf' ? 'pdf' : ($attKind === 'video' ? 'video' : 'image')) ?>"
|
||
data-src="<?= e($attView) ?>"
|
||
data-dl="<?= e($attDl) ?>"
|
||
data-name="<?= e($attNm !== '' ? $attNm : \App\Attachment::kindWord($attKind)) ?>"
|
||
data-size="<?= e($attSz) ?>"
|
||
title="<?= e($attNm) ?>">
|
||
<?php if ($attKind === 'image'): ?>
|
||
<img src="<?= e($attView) ?>" alt="<?= e($attNm) ?>" loading="lazy">
|
||
<?php elseif ($attKind === 'video'): ?>
|
||
<?php /* #t=0.1 让浏览器把第 0.1 秒那一帧当封面显示出来 ——
|
||
没有它视频位就是一块黑板，看不出这是段什么视频。 */ ?>
|
||
<video src="<?= e($attView) ?>#t=0.1" preload="metadata" muted playsinline></video>
|
||
<span class="att-play" aria-hidden="true">▶</span>
|
||
<?php else: ?>
|
||
<?php /* PDF：文件名压在图标上（用户第 6 条） */ ?>
|
||
<span class="att-doc att-doc-pdf">
|
||
<span class="att-doc-name"><?= e($attFileWord) ?></span>
|
||
</span>
|
||
<?php endif; ?>
|
||
</a>
|
||
<?php else: ?>
|
||
<a class="att-thumb att-kind-<?= e($attKind) ?>" href="<?= e($attDl) ?>"
|
||
title="<?= e($attNm) ?>（点击下载）">
|
||
<span class="att-doc att-doc-<?= e($attKind) ?>">
|
||
<span class="att-doc-name"><?= e($attFileWord) ?></span>
|
||
</span>
|
||
</a>
|
||
<?php endif; ?>
|
||
<div class="att-meta">
|
||
<?php /* 图片/视频不显示那串哈希名；文件的名字已经在图标上了，这里也不必再抄一遍 */ ?>
|
||
<?php if (!$attIsMedia): ?>
|
||
<span class="att-fsize"><?= e($attSz) ?></span>
|
||
<?php endif; ?>
|
||
<a class="link-quiet att-dl" href="<?= e($attDl) ?>">下载</a>
|
||
<?php if ($attCanEdit && !empty($attDelUrl)): ?>
|
||
<form method="post" action="<?= e(url($attDelUrl)) ?>" class="att-del">
|
||
<?= csrf_field() ?>
|
||
<input type="hidden" name="<?= e($attDelField) ?>" value="<?= (int)$attRow['id'] ?>">
|
||
<?php foreach ($attExtra as $ek => $ev): ?>
|
||
<input type="hidden" name="<?= e((string)$ek) ?>" value="<?= e((string)$ev) ?>">
|
||
<?php endforeach; ?>
|
||
<button class="btn btn-ghost btn-sm" type="submit"
|
||
onclick="return confirm('删掉这个附件？')">删除</button>
|
||
</form>
|
||
<?php endif; ?>
|
||
</div>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
<?php /* ⚠️ 循环里用到的临时变量一律用完即清：宿主模板里很可能也有 $attRow / $attKind /
|
||
$attView / $attDl / $attNm / $attSz（各模块页面都爱用这种短名），留着就是静默覆盖。 */ ?>
|
||
<?php unset($attRow, $attKind, $canPrev, $attView, $attDl, $attNm, $attSz,
|
||
$attIsMedia, $attFileWord); ?>
|
||
</div>
|
||
<?php endif; ?>
|