asp.net 코어 2, 면도날 페이지에서 디스크에 이미지를 높이는 방법

Question

저는 asp.net 프레임 워크에서 초보자지만, 배우고 적용하는 것이 좋습니다. https://docs.microsoft.com/en-us/aspnet/core/tutorials/razor-pages/razor-pages-start

나는 그것을 따라 다 괜찮아요 그리고 나는 새로운 모델, 테이블을 추가 전달합니다.

public class Movie 
{ 
    public int ID { get; set; } 
    public string Title { get; set; } 
    public DateTime ReleaseDate { get; set; } 
    public string Genre { get; set; } 
    public decimal Price { get; set; } 
} 

아래 과정 작성의 코드입니다 :

 <div class="form-group"> 
      <label asp-for="Movie.Price" class="control-label"></label> 
      <input asp-for="Movie.Price" class="form-control" /> 
      <span asp-validation-for="Movie.Price" class="text-danger"></span> 
     </div> 

:로부터의 섹션 아래

public async Task<IActionResult> OnPostAsync() 
    { 
     if (!ModelState.IsValid) 
     { 
      return Page(); 
     } 

     _context.Movie.Add(Movie); 
     await _context.SaveChangesAsync(); 

     return RedirectToPage("./Index"); 
    } 

입니다

우리가 영화의 모델이 있다고 가정

이제 "표지 이미지"를 업로드 할 양식에 새 필드를 추가하여 사용자가 찾아서 선택할 수있게하려고합니다. 같은 형태로 업로드 할 영화의 표지 이미지.

• 내가 DB에 파일 이름을 저장하는 생각, 각각의 영화는 내가 표시하거나 삭제하는 데 사용할 수 있습니다, 열 "CoverImage"가 :

  내 질문이 있습니다. 좋은이 접근입니까?

• 파일을 저장하는 가장 좋은 장소는 무엇입니까? "wwwroot"또는 다른 폴더에 있거나 중요하지 않습니까?

• 이미지를 업로드하는 가장 좋은 방법은 무엇인가요? 위 코드의 세 부분에 무엇을 추가해야합니까? 나는 검색을했고 나는 많은 접근법과 방법을 발견했다. 그러나 나는 가장 좋은 접근법 인 asp.net의 전문가로서 너에게 을 알 필요가있다.

Answer 1

테이블에 이미지 경로를 저장하려면 먼저 엔티티 클래스에 속성을 추가해야 테이블에 열이 만들어집니다.

public class Movie 
{ 
    public int ID { get; set; } 
    public string Title { get; set; } 
    public DateTime ReleaseDate { get; set; } 
    public string Genre { get; set; } 
    public decimal Price { get; set; } 
    public string ImageName { set;get;} // This is the new property 
} 

은 이제 UI에서 파일을 수신하려면, 양식에 입력 IFormFile 이제

public class CreateModel : PageModel 
{ 
    [BindProperty] 
    public Movie Movie { set; get; } 

    [BindProperty] 
    public IFormFile Image { set; get; } 
} 

당신의 PageModel 클래스에 새로운 속성을 추가 유형 file의 입력 요소를 추가해야합니다. 양식 태그는 enctype 속성이 있는지 확인하고 값이 OnPost 방법에 multipart/form-data 이제

<form method="post" enctype="multipart/form-data"> 
    <div asp-validation-summary="All"></div> 

    <input type="text" placeholder="Title" asp-for="Movie.Title"/> 
    <input type="text" placeholder="Genre" asp-for="Movie.Genre" /> 
    <input type="text" placeholder="Price" asp-for="Movie.Price"/> 
    <input type="file" asp-for="Image"/> 

    <button type="submit">Save</button> 
</form> 

로 설정되어, 당신은 페이지 모델의 Image 속성 값을 읽고 디스크에 저장할 수 있습니다. asp.net 코어에서 wwwroot 디렉토리는 정적 자산을 보관하는 특수 디렉토리입니다. 따라서 이미지를 그 아래에 보관할 수 있습니다. wwwroot 안에 uploads이라는 하위 디렉토리를 만듭니다.

wwwroot 디렉터리 경로를 얻으려면 IHostingEnvironment을 사용할 수 있습니다. 그러니 페이지 모델 클래스에 삽입하십시오.

public class CreateModel : PageModel 
{ 
    private readonly YourDbContext context; 
    private readonly IHostingEnvironment hostingEnvironment; 
    public CreateModel(YourDbContext context,IHostingEnvironment environment) 
    { 
     this.hostingEnvironment = environment; 
     this.context=context; 
    } 
    //Your existing code for properties goes here 
    public async Task<IActionResult> OnPostAsync() 
    { 
     if (!ModelState.IsValid) 
      return Page(); 

     if (this.Image != null) 
     { 
      var fileName = GetUniqueName(this.Image.FileName); 
      var uploads = Path.Combine(hostingEnvironment.WebRootPath, "uploads"); 
      var filePath = Path.Combine(uploads,fileName); 
      this.Image.CopyTo(new FileStream(filePath, FileMode.Create)); 
      this.Movie.ImageName = fileName; // Set the file name 
     } 
     context.Movie.Add(this.Movie); 
     await context.SaveChangesAsync(); 
     return RedirectToPage("MovieList"); 
    } 
    private string GetUniqueName(string fileName) 
    { 
     fileName = Path.GetFileName(fileName); 
     return Path.GetFileNameWithoutExtension(fileName) 
       + "_" + Guid.NewGuid().ToString().Substring(0, 4) 
       + Path.GetExtension(fileName); 
    } 
} 

이 wwwroot/uploads에 파일을 저장하고 우리가 저장되어있는 Movie 레코드의 ImageName 속성에 이미지 이름을 저장합니다. 따라서 이미지를 표시하려면 레코드를 읽고 ImageName 속성을 사용하고 URL을 만듭니다. 페이지 모델 Movie 개체의 모음입니다 Movies 속성이 다른 페이지에, 예를 들어

: (예는 'yourSiteName/uploads/aaa_9521.jpg의 aaa_9521.jpg이 영화의 기록에서 ImageName 속성 값을 올 경우),이

을 수행 할 수 있습니다

<table>  
    @foreach (Movie m in Model.Movies) 
    { 
     <tr> 
      <td>@m.Title</td> 
      <td>@m.Price</td> 
      <td> 
       <img src="~/uploads/@m.ImageName"/> 
      </td> 
     </tr> 
    } 
</table>