MVC 音频控件从字节播放歌曲

Question

我的歌曲以 bytes[] 的形式存储在数据库中。我如何在 <audio> 标签中使用它们。

所以像这样。我需要先将字节转换为其他内容吗？我不确定。

foreach (var item in Model)
    {
        <audio controls>
            <source src=@item.SongBytes type="audio/mp3"/>
        </audio>  
    }

Answer 1

一种方法是在您的控制器中添加一个新操作，returns 数据：

public ActionResult Audio(int someId)
{
    byte[] songBytes; 
    // Add code to get data
    return new FileStreamResult(songBytes, "audio/mp3");
}

然后将 URL 放入 src 属性中：

foreach (var item in Model)
{
    <audio controls>
        <source src="/Controller/Audio/@item.someId" type="audio/mp3"/>
    </audio>  
}

Answer 2

Google chrome/Ipad 需要支持内容范围请求，因此要在此处添加给定答案，请执行以下操作：

 public FileStreamResult StreamUploadedSongs(int id)
    {
        byte[] song = db.UploadedSongs.Where(x => x.Id == id).FirstOrDefault().SongBytes;

        long fSize = song.Length;
        long startbyte = 0;
        long endbyte = fSize - 1;
        int statusCode = 200;
        if ((Request.Headers["Range"] != null))
        {
            //Get the actual byte range from the range header string, and set the starting byte.
            string[] range = Request.Headers["Range"].Split(new char[] { '=', '-' });
            startbyte = Convert.ToInt64(range[1]);
            if (range.Length > 2 && range[2] != "") endbyte = Convert.ToInt64(range[2]);
            //If the start byte is not equal to zero, that means the user is requesting partial content.
            if (startbyte != 0 || endbyte != fSize - 1 || range.Length > 2 && range[2] == "")
            { statusCode = 206; }//Set the status code of the response to 206 (Partial Content) and add a content range header.                                    
        }
        long desSize = endbyte - startbyte + 1;
        //Headers
        Response.StatusCode = statusCode;

        Response.ContentType = "audio/mp3";
        Response.AddHeader("Content-Accept", Response.ContentType);
        Response.AddHeader("Content-Length", desSize.ToString());
        Response.AddHeader("Content-Range", string.Format("bytes {0}-{1}/{2}", startbyte, endbyte, fSize));
        //Data

        var stream = new MemoryStream(song, (int)startbyte, (int)desSize);

        return new FileStreamResult(stream, Response.ContentType);
    }

Answer 3

它对我有用，我的问题是当我尝试通过 wavesurfer.js 在 chrome 中通过调用控制器方法播放 .wav 文件时，return ActionResult 然后文件正在播放但我无法向前和向后寻找。当我寻找时，玩家 returns 开始位置。尽管此功能在 Firfox 中运行良好。

MVC 音频控件从字节播放歌曲

MVC audio controls playing song from bytes

asp.net-mvc

byte

html5-audio