In this article I will explain with an example, how to play Video files from Server Folder (Directory) in ASP.Net Core MVC.
This article will explain how to play the various Video files i.e. mp4, webm and ogg files.
Files Folder Locations
The Video file is stored in the Files Folder (Directory) of the wwwroot Folder (Directory).
Controller
The Controller consists of following Action method.
Action method for handling GET operation
Inside this Action method, simply the is returned to the View.
public class HomeController : Controller
{
public IActionResult Index()
{
return View();
}
}
View
HTML Markup
Inside the View, there is an HTML5 Video element.
Note: This article makes use of HTML5 Video Player to play the videos on the web page.
Inside the HTML5 Video element, the source tag is added. The source tag is specified with following attributes:
src: URL of the Video file.
type: The MIME type of the Video file.
Following are the compatible Media Types for Video.
File Format
|
Media Type
|
MP4
|
video/mp4
|
WebM
|
video/webm
|
Ogg
|
video/ogg
|
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<video controls="controls" height="300" width="240">
<source src="/Files/Butterfly.mp4" type='video/mp4' />
</video>
</body>
</html>
Screenshot
Browser Compatibility
* All browser logos displayed above are property of their respective owners.
Demo
Downloads