Question

我从mvc action方法获取一个字节数组。我想将其设置为HTMl视频标签的源。怎么做到呢。我的代码如下。

var sourcePDF = '../../Content/Images/video.webm'
                if (sourcePDF != undefined && sourcePDF.trim() != "") {
                    var url = ResolvedUrl.replace('ActionName', 'StreamFile').replace('ControllerName', 'File');
                    $.ajax({
                        type: "POST",
                        url: url,
                        data: JSON.stringify({ filename: sourcePDF }),
                        contentType: "application/json; charset=utf-8",
                        datatype: "JSON",
                        success: function (response) {
                            debugger; 
                         console.log(response)
                            var HealthCareIframeAppend = '<video  width="100%" height="inherit" src="' + response + '" autoplay controls ></video>';
                                   $('#HealthCareAttachementi').append(HealthCareIframeAppend);
                              $('#_SwitchFullScreenContentNewTab').switchClass('show', 'hide');
                        },
                        error: function (error) {
                           console.log(error);
                        }
                    });

Answer 1

你可以使用base64编码的字符串ant然后将它放在你的src tad中，但这不是一个好主意，因为它会很大。您可以在here找到演示（请查看本页的源代码）

如何操作，您可以找到here。

但是在你的情况下，另外的挑战是如何将字节数组转换为base64字符串，这将消耗时间和内存，如果你仍然想这样做，你可以从服务器返回base64字符串

Answer 2

我最终做到了这一点并且工作正常。它在Chrome和firefox中运行良好，您也可以在Chrome中下载该文件。这是我的Javascript

var url= '../../Content/Images/video.webm'
var sourceVideo = parent.window.ResolvedUrl.replace('ActionName', 'videoStream').replace('ControllerName', 'File') + '?' + $.param({ "filePath": url });
 $('#HealthCareAttachementi video').remove();
 $('#HealthCareAttachementi iframe').remove();                       
 var HealthCareIframeAppend = '<video  width="100%" height="inherit"  autoplay controls >    <source src=' + sourceVideo + '    type="video/mp4" ></video>';                            $('#HealthCareAttachementi').append(HealthCareIframeAppend);
 $('#_SwitchFullScreenContentNewTab').switchClass('show', 'hide');

这是行动方法

       public void videoStream(string filePath)
    {
        //The header information 
        HttpContext.Response.AddHeader("Content-Disposition", "attachment; filename=Training.mp4");

        var file = new FileInfo(filePath);
        //Check the file exist,  it will be written into the response 
        if (file.Exists)
        {
            var stream = file.OpenRead();
            var bytesinfile = new byte[stream.Length];
            stream.Read(bytesinfile, 0, (int)file.Length);
            HttpContext.Response.BinaryWrite(bytesinfile);
        }

    }

有没有办法在html5源视频标签上使用字节数组。

2 个答案: