- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
我想向客户端发送一个视频文件并使用.createObjectURL() 显示视频。
Node 服务器.js:
var fs = require("fs"),
http = require("http");
http.createServer(function (req, res) {
if (req.url == "/") {
res.writeHead(200, { "Content-Type": "text/html" });
res.end('<video id="video" src="" autoplay controls loop width="200px" height="200px" muted></video>' +
'<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>' +
'<script src="blobvideo.js"></script>');
}
else if (req.url == "/blobvideo.js") {
res.writeHead(200, { "Content-Type": "application/javascript" });
fs.readFile('./blobvideo.js', function(err, data) {
res.end(data.toString());
});
}
else if (req.url == "/video") {
fs.readFile('video.mp4', function(err, data) {
res.end(data);
});
}
}).listen(3000);
客户端 blobvideo.js:
$.ajax( "/video" ).done(function(data) {
var ab = new ArrayBuffer(data.length);
var view = new Uint8Array(ab);
for(var i = 0; i < data.length; ++i) {
view[i] = data[i];
}
blob = new Blob([ab], { type: "video/mp4" });
document.getElementById("video").src = (window.URL || window.webkitURL).createObjectURL(blob);
});
在这段代码中,视频是一次性全部发送出去的,视频没有播放。我的问题:
如何解决此问题以播放视频?
如何更改它以流式传输文件而不是等待整个视频下载?
编辑澄清
我想在客户端使用 Blob
和 .createObjectURL()
因为我正在尝试构建 WebRTC RTCPeerConnection 的点对点视频实现,所以静态视频数据可以从客户端发送到另一个客户端,而无需通过服务器发送。
最佳答案
这是纯 nodejs javascript,无需外部库依赖即可流式传输视频/音频,并且不需要客户端代码...使用以下方式启动它:
node this_code.js
然后将您的客户端浏览器指向
http://localhost:8888
巨大的好处是浏览器客户端视频渲染 UI 小部件可以正常工作——(能够跳转到某个随机媒体位置等)
var http = require('http'),
fs = require('fs'),
util = require('util');
// put any audio or video file here
var path = "/path/to/audio/or/video/file/local/to/server/cool.mp4";
var port = 8888;
var host = "localhost";
http.createServer(function (req, res) {
var stat = fs.statSync(path);
var total = stat.size;
if (req.headers.range) {
// meaning client (browser) has moved the forward/back slider
// which has sent this request back to this server logic ... cool
var range = req.headers.range;
var parts = range.replace(/bytes=/, "").split("-");
var partialstart = parts[0];
var partialend = parts[1];
var start = parseInt(partialstart, 10);
var end = partialend ? parseInt(partialend, 10) : total-1;
var chunksize = (end-start)+1;
console.log('RANGE: ' + start + ' - ' + end + ' = ' + chunksize);
var file = fs.createReadStream(path, {start: start, end: end});
res.writeHead(206, { 'Content-Range': 'bytes ' + start + '-' + end + '/' + total, 'Accept-Ranges': 'bytes', 'Content-Length': chunksize, 'Content-Type': 'video/mp4' });
file.pipe(res);
} else {
console.log('ALL: ' + total);
res.writeHead(200, { 'Content-Length': total, 'Content-Type': 'video/mp4' });
fs.createReadStream(path).pipe(res);
}
}).listen(port, host);
console.log("Server running at http://" + host + ":" + port + "/");
享受,
关于javascript - 如何使用 Node 将视频发送到客户端 JavaScript blob,然后显示它?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32429708/
我正在尝试从 Azure 容器中删除 blob。我能够连接到它并列出此问题中代码后面的所有 blob:Upload and Delete Azure Storage Blob using azure-
我正在尝试从 Azure 容器中删除 blob。我能够连接到它并列出此问题中代码后面的所有 blob:Upload and Delete Azure Storage Blob using azure-
运行我的 azure 函数(用于读取 azure blob 存储)后出现错误。 错误是 ID 0dad768d-36d4-4c1a-85ae-2a5122533b3c fail: Func
运行我的 azure 函数(用于读取 azure blob 存储)后出现错误。 错误是 ID 0dad768d-36d4-4c1a-85ae-2a5122533b3c fail: Func
我正在使用 C# 控制台应用程序 (.NET Core 3.1) 从 Azure Blob 存储读取大量图像文件并生成这些图像的缩略图。新图像将保存回 Azure,并将 Blob ID 存储在我们的数
我没有在网上看到任何有关如何获取位于 BlobContainerClient 内特定目录内的所有 blob 的示例。 以前,我使用的是 Microsoft.Azure.Storage 软件包,但这些软
我正在使用 C# 控制台应用程序 (.NET Core 3.1) 从 Azure Blob 存储读取大量图像文件并生成这些图像的缩略图。新图像将保存回 Azure,并将 Blob ID 存储在我们的数
我没有在网上看到任何有关如何获取位于 BlobContainerClient 内特定目录内的所有 blob 的示例。 以前,我使用的是 Microsoft.Azure.Storage 软件包,但这些软
我正在编写一些代码,允许用户使用麦克风录制自己的声音,然后将录音上传到 Azure Blob 存储。 为了录制音频,我使用类似于下面的代码 let recordedBlobs = []; this.m
当前使用:https://github.com/Azure/azure-sdk-for-go 概述:我当前正在从 azure blob 存储中下载一个 blob,解析该 blob,然后将转录的 blo
正在观看 this video about how to design Tinder ,在 06:50 提出了关于文件与 BLOBS 的观点。 我想知道大二进制文件和 BLOB(二进制大对象)之间有什
目前我有 hibernate JPA HSQLDB 来自动创建我的数据库表。 如何告诉 JPA 或 Hibernate 将字符串保存为 clob/blob 字段?即一个很长的字符串。到目前为止我找不
我有一个一维 NumPy 数组,其中包含一些“坏”值。我想剔除它们。 每个坏值的邻居只是“顽皮”,但我也想剔除它们。 对不良值的可靠测试是询问: arr<0.1 但是,(我能想到的)对于顽皮值的唯一可
查看有关获取 Blob 和获取 Blob 属性的 MSDN 文档。两个请求看起来相同 "https://myaccount.blob.core.windows.net/mycontainer/mybl
我有 2 个 Blob 存储,一个在 eastus,一个在 canadaeast,我想将一个 .vhd 从 eastus 复制到 canadaeast。我去了 eastus,在我想要复制的 blob
所以场景如下: 我有多个 Web 服务实例,用于将 blob 数据写入 Azure 存储。我需要能够根据收到的时间将 blob 分组到容器(或虚拟目录)中。偶尔(最坏的情况是每天)旧的 blob 会被
在 Azure Blobstorage 中,我有 100 个 Blob,但我只想列出前 10 个 Blob。我该怎么做? 我写的{maxResults:1}没有任何效果,它仍然列出了我所有的 Blob
我们当前的代码使用 Azure SDK 1.8,为了生成共享访问签名,它将首先调用 CloudBlobContainer.GetBlobReference(),然后调用 CloudBlob.GetSh
我有大量文件存储在公共(public) Azure blob 容器中,所有这些文件都通过我的 ASP.NET MVC Web 应用程序中的 HTML 直接引用。例如,blob 存储中一个图像的路径如下
我有一个 NodeJS 后端,它使用 Microsoft 的官方 Blob 存储库 (@azure/storage-blob) 来管理我的 Blob 存储: https://www.npmjs.com
我是一名优秀的程序员,十分优秀!