修复:将叫号音频内联到前端包
问题:音频使用 /audio 路径,浏览器预加载仍会向服务端发起独立请求。 实现:将 15 个 WAV 作为 Vite 内联资源编入前端 JS,后端继续仅返回叫号数据/文本。 验证:前端 66 项测试与生产构建通过;dist 中 WAV 文件为 0,含 15 个内联音频数据。
This commit is contained in:
@@ -1,53 +1,32 @@
|
||||
import { renderHook } from "@testing-library/react";
|
||||
import { afterEach, describe, expect, it } from "vitest";
|
||||
import { announcementAudioQueue, audioPreloadSources, useAudioAnnouncements } from "./useAudioAnnouncements";
|
||||
import { describe, expect, it } from "vitest";
|
||||
import { announcementAudioQueue } from "./useAudioAnnouncements";
|
||||
|
||||
afterEach(() => {
|
||||
document.head.querySelectorAll("link[data-queue-voice-preload]").forEach((link) => link.remove());
|
||||
});
|
||||
const inlineAudio = (source: string) => source.startsWith("data:audio/wav;base64,");
|
||||
|
||||
describe("announcementAudioQueue", () => {
|
||||
it("忽略项目名并把单号码播报素材重复三遍", () => {
|
||||
const once = [
|
||||
"/audio/queue-voice/please.wav",
|
||||
"/audio/queue-voice/digit-0.wav",
|
||||
"/audio/queue-voice/digit-0.wav",
|
||||
"/audio/queue-voice/digit-0.wav",
|
||||
"/audio/queue-voice/digit-1.wav",
|
||||
"/audio/queue-voice/digit-6.wav",
|
||||
"/audio/queue-voice/number.wav",
|
||||
"/audio/queue-voice/entrance.wav",
|
||||
"/audio/queue-voice/gap.wav",
|
||||
];
|
||||
const queue = announcementAudioQueue(["东门观光车,请零零零一六号,前往入口。"]);
|
||||
const once = queue.slice(0, 9);
|
||||
|
||||
expect(announcementAudioQueue(["东门观光车,请零零零一六号,前往入口。"]))
|
||||
.toEqual([...once, ...once, ...once]);
|
||||
expect(once).toHaveLength(9);
|
||||
expect(once.every(inlineAudio)).toBe(true);
|
||||
expect(once[1]).toBe(once[2]);
|
||||
expect(once[2]).toBe(once[3]);
|
||||
expect(queue).toEqual([...once, ...once, ...once]);
|
||||
});
|
||||
|
||||
it("支持连续号码范围", () => {
|
||||
const queue = announcementAudioQueue(["请一七号至一九号,前往入口。"]);
|
||||
|
||||
expect(queue.slice(0, 9)).toEqual([
|
||||
"/audio/queue-voice/please.wav",
|
||||
"/audio/queue-voice/digit-1.wav",
|
||||
"/audio/queue-voice/digit-7.wav",
|
||||
"/audio/queue-voice/number.wav",
|
||||
"/audio/queue-voice/through.wav",
|
||||
"/audio/queue-voice/digit-1.wav",
|
||||
"/audio/queue-voice/digit-9.wav",
|
||||
"/audio/queue-voice/number.wav",
|
||||
"/audio/queue-voice/entrance.wav",
|
||||
]);
|
||||
expect(queue.slice(0, 9).every(inlineAudio)).toBe(true);
|
||||
expect(queue[1]).not.toBe(queue[2]);
|
||||
expect(queue[3]).not.toBe(queue[4]);
|
||||
});
|
||||
|
||||
it("打开页面时预加载全部声音素材", () => {
|
||||
const { unmount } = renderHook(() => useAudioAnnouncements());
|
||||
const links = Array.from(document.head.querySelectorAll<HTMLLinkElement>("link[data-queue-voice-preload]"));
|
||||
it("音频素材不使用独立 HTTP 路径", () => {
|
||||
const queue = announcementAudioQueue(["请一号,前往入口。"]);
|
||||
|
||||
expect(links.map((link) => link.getAttribute("href"))).toEqual(audioPreloadSources);
|
||||
expect(links.every((link) => link.rel === "preload" && link.getAttribute("as") === "audio")).toBe(true);
|
||||
|
||||
unmount();
|
||||
expect(document.head.querySelector("link[data-queue-voice-preload]")).toBeNull();
|
||||
expect(queue).not.toContain("/audio/queue-voice/please.wav");
|
||||
expect(queue.every(inlineAudio)).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user