Login Controls 고석현 손효일 이규태

Contents 1 Login Controls? 2 ASP.NET 구성 3 Login Control 4 LoginView Control 5 LoginName Control 6 Password Recovery Control 7 Create User Wizard Control 8 Change Password Control

Login Controls? 비쥬얼 스튜디오에서 기본으로 제공해주는 로그인 컨트롤들 입니다.

ASP.NET 구성 [파일]-[새로만들기]-[웹사이트] 에서 “ASP.NET 웹 사이트” 로 프로젝트를 만듭니다.

ASP.NET 구성 프로젝트가 생성 되었으면 [웹 사이트] – [ASP.NET] 구성을 선택 합니다.

ASP.NET 구성 로그인 컨트롤에서 사용하는 사용자를 등록할 수 있는 웹 사이트 관리자 페이지를 볼 수 있다. [보안] 탭을 선택하도록 합니다.

ASP.NET 구성 [보안] 페이지에서 먼저 [사용자] 테이블의 “인증 형식 선택” 링크를 선택합니다.

ASP.NET 구성 사용자가 사이트에 엑세스 하는 방법 페이지가 나오면 [인터넷] 라디오 버튼을 선택하고 완료 버튼을 누르시기 바랍니다.

ASP.NET 구성 [역할]테이블에서 [역할 사용] 을 선택해서 [역할 만들기 또는 관리]를 활상화 시켜준후 [역할 만들기 또는 관리]를 선택합니다.

ASP.NET 구성 [새 역할 만들기] 페이지에서 새 역할 이름으로 “Basic User”라고 작성한후에 역할 추가 버튼을 선택합니다.

ASP.NET 구성 “Basic User”가 추가가 되면 [뒤로] 버튼을 선택합니다.

ASP.NET 구성 [사용자]테이블에서 “사용자 만들기”를 선택 합니다.

ASP.NET 구성 [사용자 만들기] 페이지에서 새로운 계정을 만들도록 합니다. 비밀번호를 입력할때는 최소 암호 길이가 7자이고 영문자 숫자 이외에 특수문자 하나는 꼭 포함해야 합니다. [사용자 만들기] 페이지에서 새로운 계정을 만들도록 합니다. 각각의 TEXTBOX에 내용들을 입력하도록 합니다. 오른쪽에 [역할]에서 먼저 생성한 역할 “Basic User”를 체크해 주시고 사용자 만들기 버튼을 선택해 주시면 됩니다.

ASP.NET 구성 입력을 완료한 후에 [보안]탭을 보면 기존 사용자와 기존 역할이 추가 된것을 볼 수 있습니다. 이렇게 하면 로그인 컨트롤을 사용 하기 위한 기본 설정을 완료 하였습니다.

Login Control 사용자가 로그인하기 위한 입력 폼을 정의한 컨트롤 이다. 사용자 아이디와 암호를 입력받아 등록된 사용자 정보와 비교하여 맞는지 보고 로그인 여부를 결정 한다.

Login Control [웹사이트 속성] 에서 마우스 오른쪽 버튼을 클릭 한후에 [새 항목 추가]를 선택한다. [새 항목 추가]에서 [Web Form]을 선택한후 이름을 알맞게 쓴후 추가 버튼을 선택한다.

Login Control “Login.aspx”파일에서 [디자인]을 선택 한후에

Login Control Login 작업 에서 [자동 서식]을 선택한다. 자동 서식에는 기본적으로 Login Form을 디자인 해주는 서식들이 있는데 여기서 마음에 드는것을 하나 골라 확인을 누른다.

Login Control Login Form의 속성에서 [동작]-[DestinationPageUrl]을 설정해 줍니다. 여기서는 Default.aspx 페이지를 선택후 확인을 누르시면 됩니다.

LoginView Control 사용자 로그인 상태에 따라 메시지를 다르게 보여주는 컨트롤 이다. AnonymousTemplate과 loggedintemplate로 나누어 로그인 상태와 아닌 경우에 대해 보여줄 메시지를 정의 한다.

LoginView Control “Default.aspx” 파일을 에서 [디자인]을 선택후 [도구상자]-[로그인]-[LoginView] 를 선택해서 [디자인]으로 드래그 합니다.

LoginView Control [LoginView작업]에서 [뷰]-[AnonymousTemplate]를 선택한후에 [LoginView1]에 안에다 “로그인 하기 전 상태 입니다” 라는 메시지를 작성한다. [LoginView작업]에서 [뷰]-[LoggedInTemplate]를 선택한후에 [LoginView1]에 안에다 “로그인 상태 입니다” 라는 메시지를 작성한다.

LoginStatus Control 사용자가 로그인하기 전에는 “로그인” 이라고 보여주고 , 로그인한 후에는 “로그아웃”이라고 보여준다. 링크 형식으로 사용자가 선택하여 로그인 또는 로그아웃을 할 수 있다.

LoginStatus Control [도구상자]-[로그인]-[LoginStatus] 를 선택해서 [디자인]으로 드래그 합니다.

LoginName Control 로그인한 사용자의 정보를 보여주는 컨트롤 이다. 사용자 인증 시 입력했던 사용자 아이디를 보여준다.

LoginName Control [도구상자]-[로그인]-[LoginName] 를 선택해서 [디자인]으로 드래그 합니다.

여기까지 실행결과... 로그인을 클릭하면 사용자 이름과 암호를 입력하는 페이지로 가고 로그인을 클릭하면 Default.aspx 페이로 다시 넘어와 각각의 상태가 변경된 것을 볼 수 있습니다.

Password Recovery Control 사용자가 암호를 잊어버렸을때 사용하는 컨트롤이다. 사용자의 이름(ID)로 사용자를 검색한후에 가입시 입력했던 질문의 답을 입력 하면 가입시 입력한 메일로 암호를 전송해준다.

Password Recovery Control [웹사이트 속성] 에서 마우스 오른쪽 버튼을 클릭 한후에 [새 항목 추가]를 선택한다. [새 항목 추가]에서 [Web Form]을 선택한후 이름을 알맞게 쓴후 추가 버튼을 선택한다.

Password Recovery Control 새로만든 “PasswordRecovery.aspx” 페이지에 [도구상자]-[로그인]-[PasswordRecovery] 컨트로를 드레그 한다.

Password Recovery Control

Password Recovery Control “Login.aspx”파일을 선택한후에 Password Recovery페이지로 갈 수 있는 하이퍼링크를 만들자. [도구상자]-[표준]-[HyperLink] 를 선택해서 드래그한다.

Password Recovery Control [HyperLink속성] –[탐색]-[NavigateUrl] 에다가 “PasswordRecovery.aspx” 페이지를 연결시켜준다.

여기까지 실행결과... 암호찾기를 선택하면 사용자 이름과 질문에 대한 답을 차례대로 입력하면 메일이 전송되야 하지만 여기서는 mailSettings/smtp 구성섹션을 지정하라는 오류가 나온다.

Create User Wizard Control 새로운 계정을 등록 시킬 수 있는 컨트롤이다.

Create User Wizard Control [웹사이트 속성] 에서 마우스 오른쪽 버튼을 클릭 한후에 [새 항목 추가]를 선택한다. [새 항목 추가]에서 [Web Form]을 선택한후 이름을 알맞게 쓴후 추가 버튼을 선택한다.

Create User Wizard Control 새로만든 “Signup.aspx” 페이지에 [도구상자]-[로그인]-[CreateUserWizard] 컨트로를 드레그 한다.

Create User Wizard Control [CreateUserWizard1] 속성에서 [동작]-[ContinueDestinationPageUrl] 에 “Login.aspx”페이지를 연결해준다. [ContinueDestinationPageUrl]은 새로운계정 등록 성공시 이동하는 페이지를 설정하면 된다.

Create User Wizard Control [CreateUserWizard1] 속성에서 [동작]-[CancelDestinationPageUrl] 에 “Default.aspx”페이지를 연결해준다. [CancelDestinationPageUrl]은 새로운계정 등록 실패시 이동하는 페이지를 설정하면 된다.

Create User Wizard Control “Default.aspx” 페이지에 “Signup.aspx” 하이퍼링크를 추가한다.

여기까지 실행결과... 새 계정 등록에 요구하는 대로 입력을 해서 가입 성공을 하면 로그인 페이지로 간다. ASP.NET 웹 사이트 관리도구에 추가된 계정을 확인할 수 있다.

Change Password Control 로그인한 사용자의 암호를 변경 시킬수 있게 해주는 컨트롤 이다.

Change Password Control [웹사이트 속성] 에서 마우스 오른쪽 버튼을 클릭 한후에 [새 항목 추가]를 선택한다. [새 항목 추가]에서 [Web Form]을 선택한후 이름을 알맞게 쓴후 추가 버튼을 선택한다.

Change Password Control “Unauthorized.aspx” 파일에 위와 같은 텍스를 작성하고 [ 도구상자]-[로그인]-[LoginStatus]컨트롤을 끌어다 놓는다.

Change Password Control [웹사이트 속성] 에서 마우스 오른쪽 버튼을 클릭 한후에 [새 항목 추가]를 선택한다. [새 항목 추가]에서 [Web Form]을 선택한후 이름을 알맞게 쓴후 추가 버튼을 선택한다.

Change Password Control 새로만든 “SecurePage.aspx” 페이지에 [도구상자]-[로그인]-[ChangePassword] 컨트롤을 드레그 한다. 그리고 [도구상자]-[로그인]-[LoginStatus]컨트롤을 추가시키고 텍스트를 입력한다.

Change Password Control User.Identity.IsAuthenticated 사용자가 신원이 인증되었는지 확인 Roles.IsUserInRile(“…….”) 사용자가 괄호안의 역할에 있는 사람인지 판별 솔루션 탐색기에서 “SecurePage.aspx.cs”를 클릭하면 “Page_Load(….)” 가 나온다. 여기에 위와 같은 코드를 작성한다.

Change Password Control 변경 변경 “Default.aspx”파일을 선택한후에 하이퍼링크 추가해서 [속성]-[TEXT]를 ‘비밀번호 변경’로 하고 [속성]-[NavogateUrl]을 SecurePage.aspx로 해준다.

패스위드 분실을 로그인 컨트롤 안에서 해결하기 “Login.aspx”파일을 선택한후에 로그인 폼을 선택한후에 [속성]-[링크]-[PasswordRecoveryText]에 ‘암호찾기’ 라고 입력하고 [속성]-[링크]-[PasswordRecoveryUrl]에 “Password Recovery.aspx” 파일을 선택한다. 그후에 아래있는 암호찾기 하이퍼링크는 삭제한다.

최종 실행결과...

최종 실행결과...

Thank You !