kanomahoro1224
a069be4538
玩家那边遇到的是：游戏放着 BGM，突然弹出下载管理器的「下载文件信息」框，有时还会把整条 音轨抢去下载。原因是这些工具会嗅探以媒体扩展名结尾的 XHR/fetch。改成客户端统一请求不带 扩展名的 `/media/<原路径去掉 .mp3>`，服务端再解析回 `public/assets/audio/…`。 - `public/js/media.js`：`mediaUrl()` 把 `/assets/audio/**.mp3` 换算成 `/media/**`，只处理同源、 且扩展名在名单内的地址；跨域、目录、`..`、点开头、不认识的扩展名一律原样返回。 - `server/index.js`：新增 `/media/` 路由。按 `AUDIO_EXTS` 顺序找 `.mp3/.m4a/.aac/.ogg/.oga/.opus/.wav`， 显式写了扩展名的以它为准；Range/ETag/Content-Type/缓存策略都复用 `serveFile`，所以和直接请求 `/assets/audio/…` 行为一致（一天缓存、支持 Range）。 - 直接请求 `/assets/audio/…` 仍然可用 —— 这是给不支持 `/media/` 的纯静态托管留的退路，客户端 在 `/media/` 404 时才回退到原地址。 安全：`/media/` 的路径只接受正常片段，`..`/`.` 直接 403，点开头或点结尾的片段 404，解析出的 绝对路径必须落在 `public/assets/audio` 之内，且只允许上面那几个音频扩展名 —— 不会变成任意文件读取。 测试： - `test/media-url.test.js`：`mediaUrl()` 的换算与各种「别动它」的边界。 - `test/lobby.test.js`：真实服务器上的 `/media` 路由（正常解析、显式扩展名优先、Range、HEAD、 目录与穿越请求被拒、客户端回退用到的 `/media/bgm.mp3` 仍 200）。 - `test/ui/audio.test.js`：音频管理器现在先请求无扩展名地址，404 才回退原地址；断言跟着 `mediaUrl()` 换算后再比对（原先拿 manifest 原地址比对，等于断言一个客户端永不请求的 URL）。
61 lines
3.0 KiB
JavaScript
61 lines
3.0 KiB
JavaScript
// Audio URLs for download managers (IDM / 迅雷 / FDM …) — and why they have no extension.
|
|
//
|
|
// The game plays audio with fetch() + Web Audio (`audio.js`): it never uses <audio src>, <a download> or a
|
|
// navigation. Download managers do not care — their browser integration hooks XHR/fetch whose URL ends in a
|
|
// media extension and (usually above ~1 MB) pops up "下载文件信息" for every BGM track. That dialog has nothing
|
|
// to do with the game, but players see it and blame the game.
|
|
//
|
|
// So audio is fetched through a same-origin, extension-less path instead:
|
|
//
|
|
// /assets/audio/bgm/act1.mp3 → /media/bgm/act1
|
|
//
|
|
// `server/index.js` resolves /media/… back to the real file under public/assets/audio and still answers with
|
|
// `Content-Type: audio/mpeg` + range support; Web Audio sniffs the container, so the URL is all the same to it.
|
|
// A host that does not implement /media/ keeps working: `audio.js` falls back to the original URL on 404.
|
|
|
|
/** Prefix of the extension-less audio route served by `server/index.js`. */
|
|
export const MEDIA_PREFIX = '/media/';
|
|
|
|
/** Extensions `/media/…` may resolve to, in the order the server tries them. */
|
|
export const AUDIO_EXTS = Object.freeze(['.mp3', '.m4a', '.aac', '.ogg', '.oga', '.opus', '.wav']);
|
|
|
|
const AUDIO_PATH = /^\/assets\/audio\/(.+)$/i;
|
|
|
|
/**
|
|
* Rewrite an audio URL to its extension-less `/media/…` form.
|
|
*
|
|
* Returns the input unchanged when the URL is not one of our audio assets, points at another origin (a CDN
|
|
* serves media itself, so the download-manager problem is not ours to solve there), or would produce a path the
|
|
* server refuses (empty / dot segments).
|
|
* @param {string} url
|
|
* @param {string} [origin] origin of the page; defaults to `location.origin`
|
|
* @returns {string} a URL safe to pass to fetch()
|
|
*/
|
|
export function mediaUrl(url, origin = globalThis.location?.origin) {
|
|
if (typeof url !== 'string' || !url) return url;
|
|
let u;
|
|
// No origin known (Node / tests): parse relative URLs against a placeholder, absolute ones are rejected below.
|
|
try { u = new URL(url, origin || 'http://localhost'); } catch { return url; }
|
|
// Cross-origin (or absolute while the page origin is unknown) stays untouched: that host serves its own media.
|
|
const absolute = /^[a-z][a-z0-9+.-]*:/i.test(url) || url.startsWith('//');
|
|
if (origin ? u.origin !== origin : absolute) return url;
|
|
const m = AUDIO_PATH.exec(u.pathname);
|
|
if (!m) return url;
|
|
let rest = m[1];
|
|
const ext = AUDIO_EXTS.find((e) => rest.toLowerCase().endsWith(e));
|
|
if (!ext) return url; // not a file we serve as audio (e.g. "x.mp3.bak") — leave it alone
|
|
rest = rest.slice(0, -ext.length);
|
|
const segments = rest.split('/');
|
|
if (!rest || segments.some((s) => !s || s === '.' || s === '..' || s.startsWith('.'))) return url;
|
|
return `${MEDIA_PREFIX}${rest}${u.search}`;
|
|
}
|
|
|
|
/**
|
|
* Is this URL already one of the extension-less media paths?
|
|
* @param {string} url
|
|
* @param {string} [origin]
|
|
*/
|
|
export function isMediaUrl(url, origin = globalThis.location?.origin) {
|
|
return mediaUrl(url, origin) !== url;
|
|
}
|