javascript - 如何从视频元素中删除“下载”按钮?

标签 javascript node.js google-cloud-platform google-cloud-storage cloud

我有一个网站,用户可以使用signedUrl 访问保存在Google Cloud Storage 上我的存储桶中的视频,但该视频具有下载选项:

enter image description here

并且我不想允许此按钮,我希望视频仅供预览。我怎样才能做到这一点?我在 GCS 文档 ( https://googleapis.dev/nodejs/storage/latest/index.html ) 中没有找到任何内容。

我使用 NodeJs 作为后端,并创建如下的signedUrl:

var expiry = new Date(Date.now() + 120000);
const file = bucket.file(req.file.cloudStorageObject);
const config = {
  action: "read",
  expires: expiry
};

file.getSignedUrl(config, function(err, url) {
  if (err) {
    console.error(err);
    return;
  }

  // The file is now available to read from this URL.
  request(url, function(err, resp) {
    console.log(444444, url);
  });
});
res.send(200);

最佳答案

您可以使用controlsList HTMLMediaElement 接口(interface)的属性,用于从视频元素中删除下载按钮。

只需使用 setAttribute方法在页面加载后将值为 nodownloadcontrolslist 属性添加到您的视频元素,并且它应该为您删除下载选项。

document.querySelector('video').setAttribute("controlslist", "nodownload");

检查并运行以下代码片段以获取上述方法的实际示例:

document.querySelector('video').setAttribute("controlslist", "nodownload");
<video controls="" autoplay="" name="media"><source src="https://storage.googleapis.com/plataforma-redacao/1583013110538y2mate.com%20-%20OZZY%20OSBOURNE%20-%20Under%20The%20Graveyard%20%28Official%20Audio%29_fMAAMfHgO4Q_720p.mp4?GoogleAccessId=plataforma-redacao%40redacao-269717.iam.gserviceaccount.com&amp;Expires=1583025155&amp;Signature=bScPwZkEhJVjt8mEQMT0BeE8CdQLoqPb5CrxLd%2BLUTd%2BF6ypL3eNVe3oGSxiRM4nWpfESlA32PgsrQ417%2FZrWuT%2FxZoeyQmSxW0G4ksZjG%2FNWBnsMGBRP7D6a2nJsuS%2BYy82anismfaBKtKEhTRhF6EehC3YRQD5BqgeJ8Q4yU3u9IeI9WWwr8aeQJUt2PafWiNADGz9rk4hR%2BdWl3SHR5sj9fZf6k8%2BSyW3ZKPsd%2BzGGrX6QhpkKYXCxf%2FioedEClbFriWKYfKhpZGvkSdmYSv9ZHHUD0%2ByjiXRHWZrO8QOvIQd2kUDATC%2B6EARuHk0jcQmapOAkm2S4k6rwwolbg%3D%3D" type="video/mp4"></video>

关于javascript - 如何从视频元素中删除“下载”按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60469776/

相关文章:

javascript - 从对象中删除特定键

node.js - Mongo/Mongoose - 按日期聚合

node.js - Expresso教程

JavaScript 同步循环

npm - 将 Google Cloud Functions 与 registry.npmjs.org 以外的注册表一起使用

google-cloud-platform - Google 云存储列出存储桶中的文件需要项目所有者的许可

google-cloud-platform - 如何解决 : Error when reading or editing Project Service Foo/container. googleapis.com: googleapi: Error 403

javascript - 如何正确读取 Firefox "about:memory"?

javascript - 如何在本地浏览器上存储用户 session ?

javascript - Flash 和 JavaScript 中 Web 小部件的比较