通过Web API 2流式传输视频内容 [英] Stream video content through Web API 2

问题描述

我正在制定出最好的方式来做以下工作：

我有一堆CCTV录像文件（MP4文件，大小从4MB到50MB），我想通过一个门户网站提供。我的第一个想法是通过Web API流式传输文件，所以我找到了以下链接：

http://www.strathweb.com/2013/01/asynchronously-streaming-video-withasp -net-web-api /

在实现示例项目之后，我意识到该示例基于Web API 1，而不是Web API 2.1，这是我正在使用的。做了更多的研究后，我得到了使用WebAPI 2.1进行编译的代码。然后我意识到，如果我想做流式传输，我不能使用MP4文件，背后有相当多的技术细节，所以这里是线程：

实时http流式传输到HTML5视频客户端的最佳方法

似乎这样工作，我需要将我的MP4文件编码为WebM，但这将花费太多时间。 Icecast（ http://icecast.org/ ），这是一个流媒体服务器，但我还没有尝试过但是，再次不知道这是否是我需要做的。

现在我想到了，我实际上不需要直播，我只需要允许客户通过浏览器播放视频文件，也许使用HTML5视频元素？事实是，我的应用程序也需要在IOS上工作，所以我认为这意味着我甚至不能将我的MP4编码到FLV，只需使用闪存。

需要的是将所有视频剪辑作为缩略图放在网页上，如果客户端点击了一个视频剪辑，则开始播放，而无需下载整个文件。想想imdb.com上的Watch Trailer功能。只需播放一个视频文件，那就是我想要的。我不需要LIVE流媒体，这是我认为WebM是什么？再次，不确定。

解决方案

两件事：

1. 在您的HTML中使用视频元素（这适用于浏览器和iOS）：

    < video src =http://yoursite.com/api/Media/GetVideo?videoId=42/> ; 
     




2. 支持 206部分内容请求在你的Web API代码。对于流式传输和iOS支持，这是至关重要的，在您发布的线程中被提及。

只需按照以下示例：

http://blogs.msdn.com/b/webdev/archive/2012/11/23/asp-net-web-api -and-http-byte-range-support.aspx

简而言之：

 if（Request.Headers.Range！= null）
 {
 //返回部分视频
 HttpResponseMessage partialResponse = Request.CreateResponse（HttpStatusCode.PartialContent ）; 
 partialResponse.Content = new ByteRangeStreamContent（stream，Request.Headers.Range，mediaType）; 
 return partialResponse; 
} 
 else 
 {
 //返回完整视频
 HttpResponseMessage fullResponse = Request.CreateResponse（HttpStatusCode.OK）; 
 fullResponse.Content = new StreamContent（stream）; 
 fullResponse.Content.Headers.ContentType = mediaType; 
 return fullResponse; 
} 
  

I'm in the process of working out what the best way is going to be to do the following:

I have a bunch of CCTV footage files (MP4 files, ranging from 4MB-50MB in size), which I want to make available through a web portal. My first thought was to stream the file through Web API, so I found the link below:

http://www.strathweb.com/2013/01/asynchronously-streaming-video-with-asp-net-web-api/

After implementing a sample project, I realised that the example was based on Web API 1, and not Web API 2.1, which is what I'm using. After doing some more research, I got the code to compile with WebAPI 2.1. I then realised that if I want to do streaming I cannot use MP4 files, there is a fair amount of technical detail behind this, so here is the thread:

Best approach to real time http streaming to HTML5 video client

It seems for this to work I need to encode my MP4 files to something like WebM, but that is going to take too much time. Icecast (http://icecast.org/), which is a streaming server, but I haven't tried it out yet, again not sure if this is what I need to do.

Now that I think of it, I actually don't need live streaming, I just need to allow the client to play the video file through their browser, perhaps using HTML5 video element? The thing is, my application needs to work on IOS as well, so I reckon that means I cant even encode my MP4 to FLV and just use flash.

All I really need is to have all my video clips as thumbnails on a web page, and if the client clicks on one, it begins to play ASAP, without having to download the entire file. Think of the "Watch Trailer" feature on imdb.com. Simply just play a video file, thats really what I want. I don't need LIVE streaming, which is what I think WebM is for? Again, not sure.

解决方案

Two things:

1. Use a video element in your HTML (this works in browsers AND iOS):

   <video src="http://yoursite.com/api/Media/GetVideo?videoId=42" /> 
   

2. Support 206 PARTIAL CONTENT requests in you Web API code. This is crucial for both streaming and iOS support, and is mentioned in that thread you posted.

Just follow this example:

http://blogs.msdn.com/b/webdev/archive/2012/11/23/asp-net-web-api-and-http-byte-range-support.aspx

In a nutshell:

if (Request.Headers.Range != null)
{
    // Return part of the video
    HttpResponseMessage partialResponse = Request.CreateResponse(HttpStatusCode.PartialContent);
    partialResponse.Content = new ByteRangeStreamContent(stream, Request.Headers.Range, mediaType);
    return partialResponse;
}
else 
{
    // Return complete video
    HttpResponseMessage fullResponse = Request.CreateResponse(HttpStatusCode.OK);
    fullResponse.Content = new StreamContent(stream);
    fullResponse.Content.Headers.ContentType = mediaType;
    return fullResponse;
}

这篇关于通过Web API 2流式传输视频内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！