I want to Show Video on ASP.NET Core MVC View from SQL Database

Question

so basically I have stored my video files using this below logic to my SQL server database table:

using (var dataStream = new MemoryStream())
            {
                await file.CopyToAsync(dataStream);
                VideoSegment video = new VideoSegment
                {
                    VideoData = dataStream.ToArray(),
                    ProfileidForVideoSegment = userprofileid.Id
                };
                Context.VideoSegments.Add(video);
                Context.SaveChanges();
            }

So using this above code my data stored to table perfectly in form varbinary(MAX) but now I want to retrieve this video data to show video playing on my asp.net core website. I have searched a lot for this but every time I found solutions related to aspx, simple asp.net MVC. but still searching for ASP.NET Core MVC website because I want to show video In my asp.net core MVC not simple asp.net MVC website. So please tell me a solution to how to do this work. Any kind of help will be appreciated. Thanks.

Answer 1

Here is a working demo you could follow:

Model:

public class VideoSegment
{
    public int Id { get; set; }
    public byte[] VideoData { get; set; }
}

Create.cshtml:

@model VideoSegment

<h1>Create</h1>
<div class="row">
    <div class="col-md-4">
        <form asp-action="Create" enctype="multipart/form-data">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="VideoData" class="control-label"></label>
                <input name="file" type="file" class="form-control" />
                <span asp-validation-for="VideoData" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>

VideoSegmentsController:

public IActionResult Create()
{
    return View();
}

[HttpPost]
public async Task<IActionResult> Create([FromForm]IFormFile file)
{
    using (var dataStream = new MemoryStream())
    {
        await file.CopyToAsync(dataStream);
        VideoSegment video = new VideoSegment
        {
            VideoData = dataStream.ToArray(),
        };
        _context.VideoSegment.Add(video);
        await _context.SaveChangesAsync();
        return RedirectToAction(nameof(Index));
    }
}

When you add the videosegment successfully, you will redirect to Index action and display the video:

Index.cshtml:

@model IEnumerable<VideoSegment>

<h1>Index</h1>

<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.VideoData)
            </th>
        </tr>
    </thead>
    <tbody>
@foreach (var item in Model) {
        <tr>
            <td>
                <video autoplay controls src="/Home/[email protected]"></video>
            </td>           
        </tr>
}
    </tbody>
</table>

VideoSegmentsController:

public class VideoSegmentsController : Controller
{
    private readonly YourDbContext _context;

    public VideoSegmentsController(YourDbContext context)
    {
        _context = context;
    }

    // GET: VideoSegments
    public async Task<IActionResult> Index()
    {
        return View(await _context.VideoSegment.ToListAsync());
    }
}

HomeController:

public class HomeController : Controller
{
    private readonly YourDbContext _context;
    public HomeController(YourDbContext context)
    {
        _context = context;
    }
    public IActionResult SampleVideoStream(int id)
    {
        var data = _context.VideoSegment.Find(id);
        return File(data.VideoData, "video/mp4");
    }
}