In this article I will explain with an example, how to play Audio files from Server Folder (Directory) in ASP.Net Core Razor Pages.
This article will explain how to play the various Audio files i.e. mp3, wav and ogg files.
Files Folder Location
The Audio file is stored in the Files Folder (Directory) of the wwwroot Folder (Directory).
![Play Audio file in ASP.Net Core Razor Pages]()
Razor PageModel (Code-Behind)
The PageModel consists of following Handler method.
Handler method for handling GET operation
This Handler method is left empty as it is not required.
public class IndexModel : PageModel
{
public void OnGet()
{
}
}
Razor Page (HTML)
HTML Markup
Inside the View, there is an HTML5 Audio element.
Note: This article makes use of HTML5 Audio Player to play the audios on the web page.
Inside the HTML5 Audio element, the source tag is added. The source tag is specified with following attributes:
src: URL of the Audio file.
type: The MIME type of the Audio file.
Following are the compatible Media Types for Audio.
|
File Format
|
Media Type
|
|
MP3
|
audio/mpeg
|
|
OGG
|
audio/ogg
|
|
WAV
|
audio/wav
|
@page
@model Audio_Core_Razor.Pages.IndexModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<audio controls="controls">
<source src="/Files/Kalimba.mp3" type='audio/mpeg' />
</audio>
</body>
</html>
Screenshot
![Play Audio file in ASP.Net Core Razor Pages]()
Browser Compatibility
* All browser logos displayed above are property of their respective owners.
Demo
Downloads
