본문 바로가기

카테고리 없음

ASP.NET Core MVC 게시판 만들기_3 / 회원가입 기능

728x90
728x90

1. 회원가입 입력 뷰 페이지 작성

Register.cshtml
- 사용자 정보를 입력 받을 수 있는 페이지 구현
- 모델 클래스인 User.cs 에 정의해 놓은 개체 속성에 맞게 뷰 페이지를 작성

@model User
@{
    ViewData["Title"] = "회원가입";
}

<form class="" method="post" asp-controller="Account" asp-action="Register">
    <div class="form-group">
        <label>사용자 ID</label>
        <input type="text" class="form-control" placeholder="사용자 ID 입력" asp-for="UserId" />
        <span class="text-danger" asp-validation-for="UserId"></span>
    </div>
    <div class="form-group">
        <label>사용자 비밀번호</label>
        <input type="password" class="form-control" placeholder="사용자 비밀번호 입력" asp-for="UserPassword" />
        <span class="text-danger" asp-validation-for="UserPassword"></span>
    </div>

    <div class="form-group">
        <label>사용자 이름</label>
        <input type="text" class="form-control" placeholder="사용자 이름 입력" asp-for="UserName" />
        <span class="text-danger" asp-validation-for="UserName"></span>
    </div>

    <div class="form-group">
        <button type="submit" class="btn btn-primary">회원가입</button>
        <a class="btn btn-warning" href="#">취소</a>
    </div>
</form>

태그 도우미
태그 도우미를 사용하면 Razor 파일에서 HTML 요소를 만들고 렌더링하는 데 서버 쪽 코드를 사용 가능

Form : MVC 컨트롤러 작업 또는 명명된 경로에 대한 HTML <Form> action 특성 값을 생성
Input : 입력 태그 도우미는 HTML <input> 요소를 Razor 뷰의 모델 식에 바인딩

https://docs.microsoft.com/ko-kr/aspnet/core/mvc/views/tag-helpers/intro?view=aspnetcore-6.0

 

ASP.NET Core의 태그 도우미

태그 도우미란 무엇이며 ASP.NET Core에서 어떻게 사용하는지 알아봅니다.

learn.microsoft.com

asp-for 특성에 지정된 식 이름에 대해 id 및 name HTML 특성을 만듭니다
모델 형식 및 모델 속성에 적용된 데이터 주석 특성에 따라 HTML type 특성 값을 설정합니다.
HTML type 특성 값이 지정된 경우 덮어쓰지 않습니다.
모델 속성에 적용된 데이터 주석 특성에서 HTML5 유효성 검사 특성을 생성합니다.
모델 형식 및 모델 속성에 적용된 데이터 주석 특성에 따라 HTML type 특성 값을 설정합니다.


2. 액션 메서드 작성

AccountController.cs > Register(User model)

뷰 페이지의 폴더명과 컨트롤러 명이 동일해야 합니다. 또한 폴더 안의 파일명이 액션 메서드가 동일해야 합니다!

-회원가입 성공 시 뷰 페이지를 통해 입력 받은 사용자 정보의 유효성을 확인 > Data Annotations 사용
- DB에 사용자 정보 저장
- 회원가입 불가능 시 다시 뷰 페이지로 돌아가도록
using AspNetNote.Models;
using AspNetNote.ViewModel;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using System.Linq;

namespace AspNetNote.Controllers
{
    public class AccountController : Controller
    {
        // GET: /<controller>/
        public IActionResult Register()
        {
            return View();
        }

        public IActionResult Login()
        {
            return View();
        }

        /// <summary>
        /// 회원가입 전송
        /// </summary>
        /// <returns></returns>
        [HttpPost]
        public IActionResult Register(User model)
        {
            if (ModelState.IsValid)
            {
                using (var db = new AspnetNoteDbContext())
                {
                    db.Users.Add(model);
                    db.SaveChanges();
                }
                return RedirectToAction("Index", "Home");
            }
            return View();
        }
    }
}

https://docs.microsoft.com/ko-kr/aspnet/core/mvc/models/validation?view=aspnetcore-6.0

 

ASP.NET Core MVC의 모델 유효성 검사

ASP.NET Core MVC 및 Razor Pages의 모델 유효성 검사에 대해 알아봅니다.

learn.microsoft.com

 

 

 

728x90
728x90