首页 > 其他分享 >js获取视频时长

js获取视频时长

时间:2023-04-11 10:34:56浏览次数:43  
标签:视频 const js 获取 blob reader duration result

 //获取视频时长
        if (names.indexOf('mp4') > -1) {
          const reader = new FileReader()
          const rs = reader.readAsArrayBuffer(file.file)
          let blob = null
          reader.onload = (e) => {
            if (typeof e.target.result === 'object') {
              blob = new Blob([e.target.result])
            } else {
              blob = e.target.result
            }
            if (blob == null) return
            const url = URL.createObjectURL(blob)
            const audioElement = new Audio(url)
            let duration
            const fun = (duration) => {
              this.duration = duration
              console.log('视频时长:', this.duration)
            }
            //下面需要注意的是在监听loadedmetadata绑定的事件中对duration直接进行赋值是无效的,需要在fun回调函数中进行赋值
            audioElement.addEventListener('loadedmetadata', function () {
              //音频/视频的元数据已加载时,会发生 loadedmetadata 事件
              duration = audioElement.duration //时长以秒作为单位
              fun(parseFloat(duration).toFixed(1))
            })
          }
        }

  

标签:视频,const,js,获取,blob,reader,duration,result
From: https://www.cnblogs.com/212s/p/17305346.html

相关文章

  • Android 短视频和图片无读写权限TargetApi>=29解决方案
    一、背景        目前很多公司在适配API29,也就是targetSdkVersion=29的权限适配。不仅是权限的适配,还有政策的要求。目前就有很多大公司已收到工信部要求,不给读写权限:android.permission.WRITE_EXTERNAL_STORAGE和android.permission.READ_EXTERNAL_STORAGE      ......
  • 如何在EasyCVR视频融合平台中播放MP4格式的视频文件?
    EasyCVR视频融合平台基于云边端协同架构,具有强大的数据接入、处理及分发能力,平台可支持多协议、多类型的设备接入,可覆盖市面上绝大多数的视频源设备,包括:IPC、NVR、视频编码器、移动执法仪、应急布控球、移动警用单兵、智能终端、无人机、车机设备、智能一体机等。今天我们来分享......
  • EasyCVR视频融合平台onvif接入云台控制接口,出现延时是什么原因?
    EasyCVR视频融合平台基于云边端一体化架构,部署轻快、功能灵活,平台可支持多协议、多类型设备接入,包括:国标GB28181、RTMP、RTSP/Onvif、海康Ehome、海康SDK、大华SDK、宇视SDK等(具体见下图)。在视频能力上,可实现视频直播、录像、回放、检索、云存储、告警上报、语音对讲、集群、智能......
  • 每日学习记录20230323_Bert视频学习
    20230323:Bert视频学习B站视频RNN这个东西不能并行运算,所以翻译的时候需要用Transformer,这样输出结果是同时被计算出来的.并且Transformer有注意力机制进行并行计算Transformer输入如何编码?输出结果是什么?Attention的目的?怎样组合在一起?Transformer最核心的机制是S......
  • 全网最详细中英文ChatGPT-GPT-4示例文档-智能聊天机器人从0到1快速入门——官网推荐的
    目录Introduce简介setting设置Prompt提示Sampleresponse回复样本APIrequest接口请求python接口请求示例node.js接口请求示例curl命令示例json格式示例其它资料下载ChatGPT是目前最先进的AI聊天机器人,它能够理解图片和文字,生成流畅和有趣的回答。如果你想跟上AI时代的潮流......
  • C++-C11-chrono-获取当前时间、获取阶段时间
    C++-C11-chrono-获取当前时间、获取阶段时间Linux下使用C++11的chrono库获取时间。#include<chrono>#include<thread>#include<iostream>int64_tgetCurrentLocalTimeStamp(){std::chrono::time_point<std::chrono::system_clock,std::chrono::millisec......
  • kettle从入门到精通 第十一课 kettle javascript 解析json数组
    1、json步骤虽然可以解析json数组,但是不够灵活。通过javascript步骤来解析json数组比较灵活,且可以按照需要组装数据流转到下个步骤。1)步骤名称:可以自定义2)TransformScripts:当前步骤编写的javascript脚本3)TransformConstants:重新定义的静态常量,用于控制数据行发生的情况。您必......
  • js 数据转换问题
    题目将下面的数据结构[{"id":"1","pid":"","title":"标题1"},{"id":"2","pid":"1","title&qu......
  • Js中delete的作用
    JavaScript中的delete用于删除对象的属性或数组的元素。它可以让你删除一个对象的指定属性或数组的指定元素。以下是使用delete来删除一个对象的属性的示例:constperson={name:"John",age:30,city:"NewYork"};deleteperson.age;console.log(person);//输出......
  • m基于形态学处理和SVM的视频行人密集度分析matlab仿真
    1.算法描述       行人检测技术已经成为计算机视觉领域的关键研究方向。行人检测的最重要的任务就是对行人目标进行准确定位。行人检测技术有很强的使用价值,可以与多人跟踪、行人重识别等技术结合,应用于汽车无人驾驶系统、智能机器人、智能视频监控、人体行为分析、人流量......