Getting Video To play using c# ASP.NET MVC
Question
I am trying to let people save video's on a database, then other users can watch these video's online. I save my files in wwwroot/videos/Username, while saving other info (name of video, description, url) in a database. Got all of the files to save, but can't seem to be able to play the video's. Did some research and saw that because of security reasons, firefox and chrome, are not able to play video's from your disk. Is it better to save the IFormFile videofile to the database correctly and call it a day? Or is there a way to make this work?
Uploading and saving the video:
[HttpPost]
public async Task<IActionResult> UploadVideo(VideoViewModel video, IFormFile file)
{
if (file.Length > 0)
{
try
{
string userName = (User.Claims.FirstOrDefault(c => c.Type == System.Security.Claims.ClaimTypes.Name).Value);
string pathString = Path.Combine(@"path", userName);
if (!Directory.Exists(pathString))
{
Directory.CreateDirectory(pathString);
}
int fCount = Directory.GetFiles(pathString, "*", SearchOption.TopDirectoryOnly).Length + 1;
var filePath = Path.Combine(pathString, file.FileName);
using (var stream = new FileStream(filePath, FileMode.Create))
{
await file.CopyToAsync(stream);
_videoLogic.SaveVideo(new Video(video.VideoId, video.Description, file.FileName, DateTime.Now, filePath, video.CategoryId));
}
}
catch (Exception ex)
{
ViewBag.Message = "ERROR: " + ex.Message.ToString();
}
}
else
{
ViewBag.Message = "You have not specified a file.";
}
return RedirectToAction("UploadVideo");
}
Trying to view the video:
<h2>Overzicht Videos gebruiker</h2>
<!DOCTYPE html>
<html>
<head>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<div class="container">
@foreach(var item in Model)
{
<div class="col-sm-4 col-md-4 col-xs-12">
<div class="modal-title" style="width:250px;">@item.Name</div>
<hr/>
<div class="video-frame">
<video style="width:250px; height:150px;" controls>
<source src="@Url.Content(item.ContentUrl)" type="video/mp4" />
</video>
</div>
</div>
}
</div>
</body>
</html>
Code for getting video in Controller:
[HttpGet]
public ActionResult GetVideosUser(UserViewModel user)
{
List<VideoViewModel> videoViewModels = new List<VideoViewModel>();
string userName = user.FirstName + " " + user.LastName;
string pathString = Path.Combine(@"path", userName);
List<Video> videos = _videoLogic.GetVideos();
foreach (Video video in videos)
{
VideoViewModel videoViewModel = new VideoViewModel(video);
videoViewModels.Add(videoViewModel);
}
return View("ViewerVideoList", videoViewModels);
}
This code correctly uploads data to my database, and uploads the correct file to my videofolder. It also correctly gets the ContentUrl stated above. How can I get this video to play correctly? Many thanks in advance!
Image of the code: ![Code]: https://imgur.com/a/xdprrAw
URL in Chrome: /wwwroot/video/Jesse%20Oosterwijk/WhatsApp%20Video%202019-12-04%20at%2018.04.49.mp4
![ChromeCode]: https://imgur.com/a/kCM3p71
![FileIsThere]: https://imgur.com/a/WaXQtUd
2 answers
solution1
0 2020-01-07 02:38:59
Did some research and saw that because of security reasons, firefox and chrome, are not able to play video's from your disk.
You can try to access these video files via a path relative to the web root , rather than a physical path.
Name = "user1",
ContentUrl = "~/videos/user1/movie.mp4"
Test Result
Note: when the issue occurs, if you check Console or html source in your browser, you may find the file path looks like this.
solution2
0 ACCPTED 2020-01-16 14:54:32
Found out how to solve the problem. Through dependency injection I can add an IHostingEnvironment to my videocontroller. This way i can save the video more easily to my webroot.
Adding the hostingenvironment:
public class VideoController : Controller
{
private readonly VideoLogic _videoLogic;
private readonly CategoryLogic _categoryLogic;
private readonly ReportLogic _reportLogic;
private readonly CommentLogic _commentLogic;
private readonly UserLogic _userLogic;
private readonly IHostingEnvironment _environment;
public VideoController(VideoLogic videoLogic, CategoryLogic categoryLogic, ReportLogic reportLogic, CommentLogic commentLogic, UserLogic userLogic, IHostingEnvironment environment)
{
_videoLogic = videoLogic;
_categoryLogic = categoryLogic;
_reportLogic = reportLogic;
_commentLogic = commentLogic;
_userLogic = userLogic;
_environment = environment;
}
In the code saving the video:
[HttpPost]
public async Task<IActionResult> UploadVideo(VideoViewModel video, IFormFile file)
{
if (file.Length > 0)
{
try
{
int userId = int.Parse(User.Claims.FirstOrDefault(c => c.Type == System.Security.Claims.ClaimTypes.Sid)?.Value);
string userName = (User.Claims.FirstOrDefault(c => c.Type == System.Security.Claims.ClaimTypes.Name).Value);
string folder = Path.Combine(_environment.WebRootPath, "video");
string url = @"\video\" + userName + @"\" + file.FileName;
string pathString = Path.Combine(folder, userName);
if (!Directory.Exists(pathString))
{
Directory.CreateDirectory(pathString);
}
var filePath = Path.Combine(pathString, file.FileName);
using (var stream = new FileStream(filePath, FileMode.Create))
{
await file.CopyToAsync(stream);
_videoLogic.SaveVideo(new Video(userId, video.VideoId, video.Description, file.FileName, DateTime.Now, url, video.CategoryId));
}
}
catch (Exception ex)
{
ViewBag.Message = "ERROR: " + ex.Message.ToString();
}
}
else
{
ViewBag.Message = "You have not specified a file.";
}
return RedirectToAction("UploadVideo");
}
After that you can just get the video from the database and get the url from there! Thanks for all the help
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.