如何使用文件系统访问 API 获取视频的 src?

2023-12-15

使用新的文件系统访问 API 选择文件夹时,我想列出带有 HTML 标签的视频。但我无法从文件句柄中获取源代码。

可以从输入读取视频

const blobUrl = URL.createObjectURL(droppedFiles[0])
this.$refs.video1.src = blobUrl

但对于文件系统访问 API,我无法执行相同的操作:

async getVideo(FileHandle) {
  const file = await FileHandle
  return URL.createObjectURL(file)
}

从 console.log 来看,文件句柄是:File {name: "front.mp4", lastModified: 1600193856925, lastModifiedDate: Tue Sep 15 2020 20:17:36 GMT+0200 (Central European Summer Time), webkitRelativePath: "", size: 492148773, …}

PS:你可以检查一下完整的例子使用文件系统访问 API


我通过将视频源分配给以下内容来解决这个问题:

const src = URL.createObjectURL(await fileHandle.getFile())
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用文件系统访问 API 获取视频的 src? 的相关文章

  • jQuery .val() 返回单选按钮的未定义

    我正在尝试获取 jQuery 中选中的单选按钮值 但它返回的值是 未定义 我搜索了这个问题的解决方案 但对我来说没有任何作用 我的 HTML 代码
  • 将 Sweet Alert 弹出窗口添加到 React 组件中的按钮

    我为 Bootstrap 和 React 找到了这个完美的 Sweet Alert 模块 我在 Meteor 应用程序中使用它 http djorg83 github io react bootstrap sweetalert http d
  • 禁用 JavaScript 中的右键单击

    当我尝试禁用右键单击时 它不起作用 我尝试使用下面的代码 document onclick function e console log e button if e button 2 e preventDefault return fals
  • 创建 Cookie 时需要帮助

    我有一个名为yes和另一个名叫no
  • html5 输入模式属性在表单之外不起作用?

    这把小提琴 http jsfiddle net 2gaw3 按预期工作 当用户输入无效的国家 地区代码时 它会显示警告 这另一个小提琴 http jsfiddle net y66vH 4 没有form元素 不起作用 看来输入的pattern
  • 在 MVC Razor 中的 C# 和 Javascript 之间共享常量

    我想在服务器上的 C 和客户端上的 Javascript 中都使用字符串常量 我将常量封装在 C 类中 namespace MyModel public static class Constants public const string
  • 保存/导出Chrome的JavaScript控制台输入历史记录

    无论如何 我可以保存或导出 JavaScript 控制台的历史记录吗 input 控制台历史记录 在 Google Chrome 中 我不想保存输出或错误 因此将鼠标悬停在控制台框上 右键单击并选择Save as 不是解决方案 我不想每次都
  • 使react-leaflet能够离线使用

    我一直在使用反应传单 https github com PaulLeCam react leaflet图书馆 到目前为止运作良好 现在我希望网站预加载尽可能多的图块 以便网络应用程序 也是 PWA 可以在没有互联网的情况下使用 我找到了一些
  • 用数组反向查找对象

    假设我有一个这样的对象 resourceMap a 0 1 2 3 4 5 6 7 8 9 10 b 11 12 c 21 23 d 54 55 56 57 510 确定是否的最佳方法是什么resourceId 21将会 c 我们不知道钥匙
  • 使用 jquery 将字符串数组转换为整数

    我正在尝试将 jquery 中的字符串数组转换为整数数组 这是我的尝试 var cdata data values split each cdata function i l l parseInt l 我认为在这种情况下你不需要使用 Jqu
  • Flux + React.js - 操作中的回调是好还是坏?

    让我解释一下我最近遇到的问题 我有 React js Flux 驱动的应用程序 有一个列表显示文章数量 注意 应用程序中有多个不同的列表 和文章详情查看在里面 但每个列表只有一个 API 端点 它返回文章数组 为了显示我需要的详细信息fin
  • 如何将 Browserify 与外部依赖项一起使用?

    我正在尝试慢慢地将 Browserify 引入我的网站 但我不想重写所有 js 也不希望 jquery 和其他库的重复实例与我的 Browserify 版本捆绑在一起 如果我构建将 jquery 列为外部依赖项的模块 那么如何将其指向我的全
  • React无限滚动scrollableTarget动态获取id?

    我在我的项目中使用react infinite scroll component 如何让scrollableTarget动态获取item id 我试过这样scrollableTarget item id 但它不起作用 必须与该 div 具有
  • 使用 html5 分块上传文件

    我正在尝试使用 html5 的文件 API 分块上传文件 然后在服务器端用 php 重新组装它 我正在上传视频 但是当我在服务器端合并文件时 大小增加了 并且它变成了无效文件 请注意 以下 html5 代码仅适用于 chrome 浏览器 在
  • Keycloak javascript 适配器 `keycloak.init` 加载 404 iframe

    我正在尝试使用 javascript 适配器将 Keycloak 集成到我的客户端应用程序keycloak js 但是 我似乎无法让它发挥作用 这是我的代码 const keycloak new Keycloak realm my real
  • 如何在网页上实现文件上传进度条?

    当用户将文件上传到我的网络应用程序时 我想显示比动画 gif 更有意义的内容 我还有哪些可能性 编辑 我正在使用 Net 但我不介意是否有人向我展示与平台无关的版本 如果您对这一切在客户端通常如何工作感兴趣 就是这样 所有解决方案都通过 J
  • ES6 模板文字的延迟执行

    我正在玩新的ES6 模板文字 http tc39wiki calculist org es6 template strings 我首先想到的是String format对于 JavaScript 所以我开始实现一个原型 String pro
  • 您如何看待引导模式触发器的相应回调?

    On 引导模态 http getbootstrap com javascript modals 我们知道我们可以为触发器绑定事件 例如show or hide using show shown hide hidden 但此事件绑定仅适用于一
  • html,将链接显示为普通文本

    我想知道您是否可以将链接显示为普通文本 a href target self img src width 121 height 20 alt div style font size 12px display block font color
  • Restangular - _.contains() 不是一个函数

    如果您最近通过 Bower 更新了 Restangular 它将安装最新的 Lodash 新的 4 0 然而 这是一个问题 因为 Restangular Angular 现在会抛出错误 contains 不是函数 你怎么解决 解决方案非常简

随机推荐

  • javascript 函数中的“return this”有什么作用?

    我想知道 return this 在 javascript 函数中做什么 它的目的是什么 假设我们有以下代码 Function prototype method function name func this prototype name
  • 有没有办法通过自定义事件传递附加数据?

    我需要在两个自主用户脚本之间传递数据 理想情况下不接触unsafeWindow对象 我认为使用自定义事件是可行的方法 我想到了这样的事情 为了示例的目的 让我们忽略 MSIE 模型 addEventListener customEvent
  • 如何获得 compose 中的活动

    有没有办法获取撰写功能中的当前活动 Composable fun CameraPreviewScreen val context ContextAmbient current if ActivityCompat checkSelfPermi
  • 如何在 Mac 上使用 cx_Freeze?

    我在我的 Mac 上使用了 python 3 4 和 cx Freeze 我试图将我的 python 脚本转换为独立的应用程序 这是我在 setup py 文件中获得的代码 application title Death Dodger 1
  • 将共享文件夹路径转换为 ​​UNC 路径

    我正在尝试通过使用计算机名称操作当前路径来将当前共享文件夹路径转换为 unc 路径 但是会导致编译错误 公共函数 UNCpath 中的 elem UBound CurrentPathA 行上存在预期数组 你们能告诉我造成这个问题的原因是什么
  • Firefox XPCOM 组件 - 调用方法 UnnamedClass 的权限被拒绝

    Firefox XPCOM 组件可以跨多个页面读写页面内容吗 设想 一堆本地 HTML 和 javascript 文件 Main html 文件打开一个窗口 pluginWindow 并使用以下命令创建一个插件 netscape secur
  • 使用RVM安装Ruby 1.9.2时出现Curl证书错误

    尝试下载 Ruby 1 9 2 时 RVM 遇到证书错误 看起来像curl存在证书问题 但我不知道如何绕过它 我在下面包含了确切的错误信息 rvm install 1 9 2 Installing Ruby from source to U
  • 使用指令内在函数在 Hexagon DSP 中启用 HVX SIMD

    我使用 Hexagon SDK 3 0 编译 HVX DSP 架构的示例应用程序 有许多与 Hexagon LLVM 相关的工具可供使用 位于以下文件夹 Qualcomm HEXAGON Tools 7 2 12 Tools bin 我编写
  • 如何打印画布元素?

    我的页面上有一个画布元素 我在其上绘制图像以及用户输入的一些数据 按一下按钮 我想将画布发送到打印机 将其打印在纸上 我尝试使用这个插件 jQuery printElement 像那样 按钮代码 a href PRINT a print v
  • iOS 应用程序相机访问被拒绝 iOS 9.1(黑屏)

    我想在我的应用程序中访问相机 我正在尝试以下代码 if UIImagePickerController isSourceTypeAvailable UIImagePickerControllerSourceTypeCamera UIImag
  • 在 eclipse luna 中启用 javascript 验证

    前段时间我问过这个问题 为 eclipse 启用 javascript 验证 我希望 Eclipse 突出显示 javascript 错误 警告 您在答案中看到的问题是该项目未配置为 Javascript Nature 现在我迁移到 Ecl
  • 何时使用内容提供商

    我了解内容提供商的目的是允许在应用程序之间公开共享数据 但是 我想知道是否有人有关于制作一个内容提供程序以仅在您自己的应用程序中使用的想法 这样做有什么好处吗 有什么缺点吗 过去 我刚刚实现了 SQliteOpenHelper 来访问数据库
  • 我可以使用 VBA 将网络图像 (gif) 导入到 Excel 中吗?

    我在 Excel 工作表中有一个 gif 文件的 URL 列表 我想使用 VBA 查询这些网站并将这些图像插入到同一个工作表中 我使用的是 Excel 2007 我尝试使用 获取外部数据 从网络 功能来查询网站 但返回以下错误 打不开htt
  • 为什么绝对定位的元素由其同级元素放置,而不是放置在页面的顶角?

    我不明白为什么我的绝对定位元素出现在我的之后child static分区我一直认为绝对定位的元素会从流程中取出 那么为什么不呢child absolute覆盖child static div parent position relative
  • 使用utf8编码的Perl脚本,它可以打开GB2312编码的文件名吗?

    我不是在谈论以 utf 8 或非 utf 8 编码读取文件内容之类的内容 这是关于文件名的 通常我将 Perl 脚本保存为系统默认编码 在我的情况下为 GB2312 并且不会遇到任何文件打开问题 但出于处理目的 我现在有一些以 utf 8
  • 检查异常是编译时还是运行时? [关闭]

    Closed 这个问题需要细节或清晰度 目前不接受答案 我读到有关检查异常的内容 它由编译器检查 但仅在运行时检查 这是对的吗 如果正确的话又如何呢 检查异常在编译时进行检查 以确保您正在处理它们 方法是捕获它们或声明包含方法throws例
  • HTMLUnit 不等待 Javascript

    我有一个基于 GWT 的页面 我想使用 HtmlUnit 为其创建 HTML 快照 该页面使用产品上的 Ajax JavaScript 信息进行加载 因此大约 1 秒后会出现 正在加载 消息 然后显示内容 问题是 HtmlUnit 似乎没有
  • TopAppBar 与导航集成的支架

    如何在中显示导航图标 后退箭头或菜单 TopAppBar using Scaffold基于 NavController 中的实际位置 我在用使用 Compose 1 0 0 alpha02 进行导航 下面是一个示例代码 描述了它应该如何工作
  • 为什么C++不允许继承友谊?

    为什么友谊在 C 中至少不能选择性地继承 我知道出于明显的原因而禁止传递性和反身性 我这么说只是为了阻止简单的常见问题解答引用答案 但缺乏类似的东西virtual friend class Foo 让我困惑 有谁知道这个决定背后的历史背景吗
  • 如何使用文件系统访问 API 获取视频的 src?

    使用新的文件系统访问 API 选择文件夹时 我想列出带有 HTML 标签的视频 但我无法从文件句柄中获取源代码 可以从输入读取视频 const blobUrl URL createObjectURL droppedFiles 0 this