axios

这里是请求了个mp3做例子；

this.$axios({

    methods:"GET",

    url:"/api/music/soures/双笙.mp3",

    responseType:'blob'

}).then(res=>{

    let blob=new Blob([res.data],{type:res.data.type});

    let url=window.URL.createObjectURL(blob);

    this.music=url

})

可能会遇到地址生成 但音视频并没有播放；

<video controls="" autoplay="" loop v-if="music">

    <source :src="music" type="audio/mpeg">

</video>

文件流转blob并播放的更多相关文章

  1. 文件流转换(一般用于axios设置接收文件流设置时responseType: 'blob')

    文件流转换 一般用于axios设置接收文件流设置时responseType: 'blob'当接口报错时,前端因已设置responseType: 'blob'无法再接收json格式数据,会把json格式 ...

  2. 实现php获取mp3文件元信息如播放时间歌曲作者等

    最近收集到一个php获取mp3文件元信息的类,感觉比较方便.现在分享给大家! 下面是使用方式和测试方式: <?php include_once 'mp3file.class.php'; func ...

  3. Android音频处理——通过AudioRecord去保存PCM文件进行录制，播放，停止，删除功能

    Android音频处理--通过AudioRecord去保存PCM文件进行录制,播放,停止,删除功能 音频这方面很博大精深,我这里肯定讲不了什么高级的东西,最多也只是一些基础类知识,首先,我们要介绍一下 ...

  4. H5页面实现一个Audio标签加载多个音频文件，并进行播放和展示音频长度

    最近微信项目中有需求,要将微信端发送过来的amr格式的语音文件,在项目中的页面上进行展示和播放,实现方式如下: 1.首先java后台收到微信端的消息推送的时候,使用 ffmpeg将amr格式的音频文件 ...

  5. delphi 怎么将一个文件流转换成字符串（String到流，String到文件，相互转化）

    //from   http://kingron.myetang.com/zsfunc0d.htm (*//   标题:充分利用pascal字符串类型   说明:和PChar不同,string可以保存# ...

  6. java调用本地播放器播放视频文件。调用本地播放器不能播放指定文件的说明。

    public class OpenExe extends HttpServlet { //打开本地播放器并播放视频 public static void openExe(String file) { ...

  7. PPT文件流转为图片，并压缩成ZIP文件输出到指定目录

    实现流程: 接收InputStream流->复制流->InputStream流转为PPT->PPT转为图片->所有图片压缩到一个压缩文件下 注意: 1.PPT文件分为2003和 ...

  8. h5页面自动播放视频、音频_关于媒体文件自动全屏播放的实现方式

    在移动端(ios和android)播放视频的时候,我们即使定义了autoplay属性,仍然不能自动播放.这是由于手机浏览器为了防止浪费用户的网络流量,在默认情况下是不允许媒体文件自动播放的,除非用户自 ...

  9. 前端vue下载文件时blob返回流中怎么获取文件名

    我很久之前写了一篇前端vue利用blob对象下载文件,有些人私信我,如果后端返回流失败,给出的json对象该怎么获得?前端获取的流怎么能获取原文件名?其实在那篇文章之后,我就已经针对这两个问题进行了优 ...

随机推荐

  1. Python练习题 011：成绩打分

    [Python练习题 011] 利用条件运算符的嵌套来完成此题:学习成绩>=90分的同学用A表示,60-89分之间的用B表示,60分以下的用C表示. ---------------------- ...

  2. Layman CSS3+H5实现上下垂直居中的几种主要方法

    方法1:通过 translate 移位来实现 H5+CSS3: <div style="width: 100%; height: 100%; margin:0; padding: 0; ...

  3. Matlab .asv文件

    参考: https://blog.csdn.net/u013152895/article/details/44724199 有时在存放m文件的文件夹中会出现*.asv asv 就是auto save的 ...

  4. Jmeter之『如果（If）控制器』

    判断方法 ${__jexl3("${projectName}"=="${targetDir}",)} ${__groovy("${projectNam ...

  5. Hive理论基础

    数仓特征:面向主题,集成,非易失的,时变.数据仓库是在数据库已经大量存在的情况下,为了进一步挖掘数据资源.为了决策需要而产生的,不是所谓的"大型数据库".   数据库与数据仓库的区 ...

  6. [WC 2011]最大Xor和路径

    题目大意: 给你一张n个点,m条边的无向图,每条边都有一个权值,求:1到n的路径权值和的最大值. 题解: 任意一条路径都能够由一条简单路径(任意一条),在接上若干个环构成(如果不与这条简单路径相连就走 ...

  7. IPA的动态库注入+企业重签名过程

    [摘录]之前在进行iOS测试过程中由于要获取一定数据信息,因此需要对原本的安装包进行代码注入并且重新打包安装,因此就需要使用重签名策略,在此进行分享,希望大家可以使用其中的方法来运用到自身的项目中. ...

  8. 通过MapReduce降低服务响应时间

    在微服务中开发中,api网关扮演对外提供restful api的角色,而api的数据往往会依赖其他服务,复杂的api更是会依赖多个甚至数十个服务.虽然单个被依赖服务的耗时一般都比较低,但如果多个服务串 ...

  9. mqtt网关

    MQTT网关 MQTT网关是可以是将普通的串口数据.Modbus RTU数据等转化为MQTT协议的从而方便与平台的对接,通过连接服务器.订阅和发布主题来实现传统设备和MQTT云端的联系.例如,笔记本和 ...

  10. pytest文档54-Hooks函数terminal打印测试结果(pytest_report_teststatus)

    前言 使用命令行执行pytest用例的时候,会在 terminal 终端打印整个用例的测试结果: .代表通过的用例 F代表失败的用例 E代表异常的用例 如果我们不喜欢这种报告结果,可以通过 pytes ...