Web如何hook媒体请求并修改媒体请求响应？

Question

我在 CDN 上托管了视频。但视频文件已被修改。所以视频无法直接播放。

在我的应用中，我可以在播放前反转视频的修改。

但是我如何在浏览器中执行此操作？有ajax hook，试过了，不能hook midia stream

Answer 1

The video file header is encrypted by modify the header purposely.

首先，如果您尝试加密视频，这并不能为您提供太多保护。我建议使用某种带有 Encrypted Media Extensions 的 DRM。这将确保您的视频无法在不付出额外努力的情况下访问。没有什么是fool-proof，但这至少好很多。

Web how to hook media request and modify the media request response?

您可以使用 Service Worker 处理任何内容的 request/response，包括媒体元素。

基本上，Service Worker 充当代理，拦截请求。如果它选择，它可以自己处理请求。通常这用于对缓存做一些特殊的事情，但是您可以使用相同的方法来修改您认为合适的响应数据。在最基本的层面上，你的 service worker 会做这样的事情：

self.addEventListener('fetch', (event) => {
  event.respondWith(
    // Your modified data in a Response object here
  );
});

尽管要开始，您还需要执行很多操作。您可以在这里找到完整的教程：

另请注意，请注意请求中的范围 headers。这些在媒体数据中很常见，您需要在 Service Worker 脚本中处理它们！

Web how to hook media request and modify the media request response?