معرفی
این مقاله نحوه آپلود فایل صوتی تا 50 مگابایت و پخش پویا با استفاده از ASP.NET MVC 5 را نشان می دهد. من فایل صوتی را در پوشه پروژه خود (AudioFileUpload) و مسیر آن را در جدول پایگاه داده SQL Server آپلود می کنم.
من تمام فایل های صوتی آپلود شده و داده های مربوط به آنها را در جدول HTML با قابلیت مرتب سازی، جستجو و صفحه بندی با استفاده از بوت استرپ 4 و پلاگین جدول داده های جی کوئری بازیابی (نمایش) خواهم داد. ما این را گام به گام درک خواهیم کرد.
مرحله 1
یک پایگاه داده در SQL Server به انتخاب خود ایجاد کنید.
- CREATE TABLE [dbo].[AudioFiles](
- [ID] [int] IDENTITY(1,1) NOT NULL,
- [Name] [nvarchar](50) NULL,
- [FileSize] [int] NULL,
- [FilePath] [nvarchar](100) NULL,
- CONSTRAINT [PK_AudioFiles] PRIMARY KEY CLUSTERED
- (
- [ID] ASC
- )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
- ) ON [PRIMARY]
- GO
- CREATE procedure [dbo].[spAddNewAudioFile]
- (
- @Name nvarchar(50),
- @FileSize int,
- @FilePath nvarchar(100)
- )
- as
- begin
- insert into AudioFiles (Name,FileSize,FilePath)
- values (@Name,@FileSize,@FilePath)
- end
- CREATE procedure [dbo].[spGetAllAudioFile]
- as
- begin
- select ID,Name,FileSize,FilePath from AudioFiles
- end
![ASP.NET](http://pezhvak24.ir/dl/10kcor/cscd/article/how-to-dynamically-upload-and-play-audio-file-using-mvc-5/Images/image001.jpg)
مرحله 2
یک پروژه خالی ASP.NET Web Application در ویژوال استودیو 2015 ایجاد کنید. همانطور که در تصویر زیر نشان داده شده است، ویژوال استودیو را باز کنید (در مورد من VS 2015). روی پروژه جدید کلیک کنید، الگوی وب را انتخاب کنید >> ASP.NET Web Application را انتخاب کنید و نام معناداری به آن بدهید. سپس، روی OK کلیک کنید.
![ASP.NET](http://pezhvak24.ir/dl/10kcor/cscd/article/how-to-dynamically-upload-and-play-audio-file-using-mvc-5/Images/image002.png)
خالی را از ASP.NET Templates انتخاب کنید، چک باکس MVC را انتخاب کنید و روی OK کلیک کنید.
مرحله 3
دوبار کلیک کنید و فایل webconfig را باز کنید تا اتصال پایگاه داده را اضافه کنید.
- <connectionStrings>
- <add name="DBCS" connectionString="data source=FARHAN\SQLEXPRESS; database=MvcDemo; integrated security=true;" />
- </connectionStrings>
این کد زیر را در فایل webconfig اضافه کنید تا امکان آپلود فایل 50 مگابایتی وجود داشته باشد.
- <httpRuntime executionTimeout="3600" maxRequestLength="51200" enable="true" />
- <system.webServer>
- <security>
- <requestFiltering>
- <requestLimits maxAllowedContentLength="104857600" />
- </requestFiltering>
- </security>
- </system.webServer>
مرحله 4
روی پروژه کلیک راست کرده، New Folder را اضافه کنید، نام آن را AudioFileUpload بگذارید تا تمام فایل های صوتی موجود در آن پوشه آپلود شود.
مرحله 5
روی پوشه Models کلیک راست کرده و Add >> Class را انتخاب کنید.
اسکرین شات برای ایجاد مدل class-1
![ASP.NET](http://pezhvak24.ir/dl/10kcor/cscd/article/how-to-dynamically-upload-and-play-audio-file-using-mvc-5/Images/image004.png)
یک پنجره ظاهر می شود. Class را انتخاب کنید، نام آن را AudioFile بگذارید، سپس روی Add کلیک کنید.
اسکرین شات برای ایجاد مدل class-2
![ASP.NET](http://pezhvak24.ir/dl/10kcor/cscd/article/how-to-dynamically-upload-and-play-audio-file-using-mvc-5/Images/image005.png)
فیلد و ویژگی کلاس را همانطور که در جدول پایگاه داده داریم بنویسیم.
- using System;
- namespace MvcUploadAudioFile_Demo.Model
- {
- public class AudioFile
- {
- public int ID { get; set; }
- public string Name { get; set; }
- public Nullable<int> FileSize { get; set; }
- public string FilePath { get; set; }
- }
- }