이 장에서는 일부 페이지에 대하여 로그한 사람들에게만 사용할 수 있도록 웹사이트를 보호하는 방법을 보여줍니다. (당신은 또한 누구나 액세스할 수있는 페이지를 만드는 방법을 확인할 수 있습니다.)
다음을 배웁니다 :
일부 페이지에 대하여 회원에 대한 액세스를 제한할 수 있도록 등록 페이지 및 로그인 페이지가있는 웹사이트를 만드는 방법.
공용 페이지와 회원 전용 페이지를 만드는 방법.
자동 프로그램(bots:로봇)이 회원 등록하는 것을 방지하기 위해 CAPTCHA를 사용하는 방법.
이들은 장에서 소개 ASP.NET 기능 위치 :
The WebSecurity helper.
The SimpleMembership helper.
The ReCaptcha helper.
1. 웹사이트 회원 소개 사이트에서 회원 가입을 지원하여, 사용자가 로그인할 수 있도록 웹사이트를 설정한다면, 여러 이유로 유용할 수 있습니다. 예를 들어, 귀하의 사이트를 회원만이 사용하도록 할 수도 있습니다. 어떤 경우에는 사용자가 당신에게 피드백을 보내거나 코멘트를 남겨주기위해 로그인할 필요가 있을 수도 있습니다.
웹사이트가 회원 가입을 지원하더라도, 사용자는 반드시 그들이 사이트에있는 페이지의 일부를 사용하기 전에 로그인할 필요는 없습니다. 로그인하지 않은 사용자는 익명 사용자(Anonymous Users)로 알려져 있습니다.
사용자는 웹사이트에 등록한 다음 사이트에 로그인할 수 있습니다. 웹사이트는 사용자 이름 (종종 이메일 주소) 및 비밀 번호가 필요합니다. 로그인하고 사용자의 신원을 확인하는 과정을 인증(Authentication)이라고도합니다.
WebMatrix에서, 다음을 포함하는 웹사이트를 만드는 초보 사이트 서식 파일을 사용할 수 있습니다 :
회원을위한 사용자 이름과 암호를 저장하는 데 사용되는 데이터베이스.
익명 (신규) 사용자가 등록할 수있는 등록 페이지.
로그인과 로그아웃 페이지.
비밀 번호 복구 및 재설정 페이지.
시작 사이트 템플릿 파일은 자동으로 페이지를 만들어주지만, 이 장에서는 ASP.NET의 보안 및 회원의 기초 과정에서 수동으로 단순화된 버전을 만들것입니다.
2. 등록 및 로그인 페이지가 있는 웹사이트 만들기
WebMatrix 시작.
빠른 시작 페이지 템플릿에서 사이트를 선택합니다.
기초 사이트 서식 파일을 선택한 다음 확인을 누릅니다. WebMatrix에서 새 사이트를 만듭니다.
왼쪽 창에서, 파일 작업 영역 선택을 누릅니다.
귀하의 웹사이트 루트 폴더에서 _AppStart.cshtml 파일을 엽니다. 그것은 전역 설정을 포함하는 데 사용하는 특수 파일입니다 그것은 주석(//)을 포함하여 몇 가지 문장이 있습니다.
이메일을 보낼 수있게하기 위해서, WebMail helper를사용할 수 있습니다. 웹사이트에 이메일을 추가합니다. - 이것은 제 11 장에서 설명하는 SMTP 서버에 대한 액세스를 필요로 합니다. 11장에서 한 페이지에 여러 SMTP 설정을 하는 방법을 보여주었습니다. 이 장에서는 그와 동일한 설정을 사용할 것입니다. 하지만 당신이 각 페이지에 코딩을 계속 할 필요가 없도록 중앙 파일에 저장할 것입니다. (당신은 데이터베이스를 등록 설정하는 SMTP를 구성 설정을 할 필요가 없습니다, 그들의 전자 우편 별칭에서 사용자의 유효성을 검사하고 사용자가 잊어버린 암호를 재설정하자하려는 경우에만 설정을 SMTP를 필요합니다.)
주석 제거. (각 줄의 앞에 있는 //)
코드에서 다음 이메일 관련 설정을 수정 : ◦ WebMail.SmtpServer를 당신이 액세스할 수있는 SMTP 서버의 이름으로 설정.
◦이 WebMail.EnableSsl true로 설정합니다. 이 설정은 그들을 암호화하여 SMTP 서버로 전송되는 자격 증명을 보호해줍니다. ◦ WebMail.UserName를 SMTP 서버 계정의 사용자 이름으로 설정.
◦ WebMail.Password를 SMTP 서버 계정에 대한 암호를 설정.
◦ WebMail.From를 사용자 이메일주소로 설정. 이것은 메시지를 보내는 이메일 주소입니다.
_AppStart.cshtml를 저장하고 종료합니다.
Default.cshtml 파일을 찾아서 엽니다.
브라우저에서 Default.cshtml 페이지를 실행합니다.
페이지 오른쪽 상단의 Register링크를 클릭하고, 사용자 이름과 비밀 번호를 누른 다음 Register 정보를 누릅니다.
당신은 Starter Site 템플릿 파일에서 웹 사이트를 만들 때 데이터베이스가 App_Data 폴더에 StarterSite.sdf라는 이름으로 만들어집니다. 등록하는 동안, 사용자 정보는 데이터베이스에 추가됩니다. 메시지가 당신이 등록을 마칠 수 있도록 사용하는 이메일 주소로 전송됩니다.
이메일 프로그램에 가서 확인 코드와 해당 사이트에 대한 하이퍼 링크가 게시된 메시지를 찾습니다.
하이퍼 링크를 클릭하여 귀하의 계정을 활성화합니다. 확인 하이퍼 링크 등록 확인 페이지가 열립니다.
Login 링크를 클릭, 그리고 당신은 등록된 계정을 사용하여 로그인하십시오. 로그인 후, Login 및 Register 링크가 로그아웃 Logout로 대체됩니다.
About 링크. About.cshtml 페이지가 표시됩니다. 지금, 유일하게 눈에 띄는 변화 (메시지가 조 오신 것을 환영합니다!과 로그아웃 링크)는 로그온 상태로 변화된 것입니다.
참고 기본적으로 ASP.NET 웹 페이지는 일반 텍스트로 서버에 자격 증명을(사람이 읽을 텍스트로) 보내드립니다. 실제 사이트는 보안 HTTP(https : / /, 또한 보안 소켓 계층 또는 SSL로 알려진) 를 사용해야합니다. 이는 서버와 교환되는 민감한 정보를 암호화합니다. 앞의 예제와 같이 WebMail.EnableSsl = true로 설정하여 중요한 정보를 암호화할 수 있습니다. SSL이에 대한 자세한 내용을 보려면 Securing Web Communications: Certificates, SSL, and https://.를 참조하십시오.
3. 회원 전용 페이지 만들기 당분간, 누군가가 귀하의 웹사이트의 모든 페이지를 탐색할 수 있습니다. 하지만 당신은 로그인(즉, 회원) 한 사람에게 사용할 수있는 페이지를 갖고 싶어 할 수도 있습니다. ASP.NET은 그들에 의해서만 접근할 수 있도록 페이지를 구성할 수 있습니다. 일반적으로 로그인 하지않은 회원, 익명 사용자는 회원 전용 페이지에 액세스하려고하면, 당신은 로그인 페이지로 리디렉션합니다.
이 절차에서는, 액세스를 제한 할 수있는 정보 페이지(About.cshtml)는 로그인한 유저에서만 액세스할 수 있습니다.
About.cshtml 파일에 모든 코드를 다음 코드로 교체합니다. 이 코드는 사용자가 로그인 했다면 true를 반환, WebSecurity 개체의IsAuthenticated 속성을 테스트합니다. 그렇지 않다면, 코드는 Account 폴더에있는 Login.cshtml 페이지로 사용자를 보내는 Response.Redirect를 호출합니다. 여기에 전체 About.cshtml 파일이 있습니다 :
@if (!WebSecurity.IsAuthenticated) { Response.Redirect("~/Account/Login"); } @{ Layout = "~/_SiteLayout.cshtml"; Page.Title = "About My Site"; } <p> This web page was built using ASP.NET Web Pages. For more information, visit the ASP.NET home page at <ahref="http://www.asp.net"target="_blank">http://www.asp.net</a> </p>
참고: 예제의 URL을(("~/Account/Login처럼). cshtml 파일 확장명을 포함하지 않는 이유는 . ASP.NET은 그 시점에 URL에 파일 확장명을 필요로하지 않습니다. cshtml 페이지를. 사용자 정의 사이트 전체 동작에 대한 자세한 내용은 Chapter 18 - Customizing Site-Wide Behavior. 를 참조하십시오.
브라우저에서 Default.cshtml를 실행시킵니다. 이 사이트에 로그 인한 경우, 로그아웃 링크를 클릭하십시오.
About 링크를 클릭합니다. 당신이 로그인되지 않기 때문에 당신은 Login.cshtml 페이지로 리디렉션됩니다.
여러 페이지에 대한 액세스를 보장하기 위해서, 당신도 각 페이지에 보안 검사를 추가하거나 당신은 보안 검사를 포함하는 레이아웃 페이지를 _SiteLayout.cshtml와 비슷한 만들 수 있습니다. 사이트의 다른 페이지로부터 보안 체크를 위해 레이아웃 페이지를 참조하는 것처럼, Default.cshtml 은 일반적으로 _SiteLayout.cshtml를 참조합니다.
4. 사용자 그룹에 대한 보안 만들기(Roles) 귀하의 사이트에 회원이 많이있다면, 그들이 페이지를 보기위해 당신이 개별적으로 각 사용자에 대해 권한을 확인하는 것은 효율적이지 못합니다. 당신이 대신 할 수있는 그룹이나 역할, 개별 회원에 속하는 것을 만드는 것입니다. 그런 다음 역할에 따라 권한을 확인할 수 있습니다. 이 섹션에서는, 당신은 "관리자"역할을 만들어야합니다 그런 다음 역할(누가 어디에 속하는가)에있는 사용자에 액세스할 수있는 페이지를 만듭니다.
시작하려면, 당신은 회원 데이터베이스에 대한 역할 정보를 추가해야합니다.
WebMatrix, 데이터베이스 작업 영역 선택을 누릅니다.
왼쪽 창에서, StarterSite.sdf 노드를 열고, 테이블 노드를 연 다음 webpages_Roles 테이블을 더블 클릭합니다.
"admin"이라는 이름의 Role를 추가합니다. Role ID 필드가 자동으로 채워집니다. (이것은 primary key로 필드를 식별되도록 설정되었습니다.)
ID 필드에 어떤 값이 기록됩니다. (이것이 첫번 째 기록된 역할이라면, 1일 것입니다.)
webpages_Roles 테이블을 닫습니다.
UserProfile 테이블을 엽니다.
테이블에 하나 이상의 사용자 ID 값을 적어 다음 테이블을 닫습니다.
webpages_UserInRoles 테이블을 열고, ID와 테이블에 역할 ID 값을 입력합니다. 예를 들어, "admin"이 역할에 사용자 3을 넣으려면,이 값을 입력하면됩니다:
webpages_UsersInRoles 테이블을 닫습니다. 지금은 역할이 정의된 것을, 당신은 그 역할에있는 사용자에 액세스할 수있는 페이지를 구성할 수 있습니다.
웹사이트 루트 폴더에, AdminError.cshtml라는 새 페이지를 만들고 다음 코드로 기존 내용을 바꿉니다. 이것은 그들이 페이지에 대한 액세스를 허용하지 않으면 사용자가 리디렉션되는 페이지가됩니다.
@{
Layout = "~/_SiteLayout.cshtml";
PageData["Title"] = "Admin-only Error";
}
<p>You must log in as an admin to access that page.</p>
AdminOnly.cshtml라는 새 페이지를 만들고 다음 코드로 기존 코드를 대체합니다. :
Roles.IsUserInRole 메서드가 true를 반환하면 현재 사용자가 "admin"역할의 구성원입니다.
브라우저에서 Default.cshtml를 실행합니다,하지만 로그인하지 않은 경우(이미 로그인 되었다면 Logout)
브라우저의 주소 표시줄에서 "Default"에서 URL에 "AdminOnly"로 교체합니다(다른 말로, AdminOnly.cshtml를 요청합니다). 귀하는 현재 "admin"이 역할의 사용자로 로그인되지 않기 때문에 AdminError.cshtml 페이지로 리디렉션할 것입니다.
Default.cshtml로 돌아가서 "admin"역할에 추가한 사용자로 로그인하십시오.
브라우저에서 AdminOnly.cshtml를 볼 수 있습니다.
5. 암호 변경 페이지 만들기 사용자가 암호 변경 페이지를 작성하여 자신의 암호를 변경할 수 있습니다. 이 예제에서는 이 작업을 수행하는 페이지의 기초를 보여줍니다.(Starter Site 템플릿은 이 절차에서 당신이 만든 페이지보다 더 완벽한 에러를 체크하는 ChangePassword.cshtml 파일이 포함되어 있습니다.)
웹사이트의 Account 폴더에 ChangePassword2.cshtml라는 페이지를 만듭니다.
다음 코드로 내용을 대치합니다:
@{ Layout = "~/_SiteLayout.cshtml"; PageData["Title"] = "Change Password"; var message = ""; if(IsPost) { string username = Request["username"]; string newPassword = Request["newPassword"]; string oldPassword = Request["oldPassword"]; if(WebSecurity.ChangePassword(username, oldPassword, newPassword)) { message="Password changed successfully!"; } else { message="Password could not be changed."; } } } <style> .message {font-weight:bold; color:red; margin:10px;} </style> <formmethod="post"action=""> Username: <inputtype="text"name="username" value="@WebSecurity.CurrentUserName"/> <br/> Old Password: <inputtype="password"name="oldPassword"value=""/> <br/> New Password: <inputtype="password"name="newPassword"value=""/> <br/><br/> <inputtype="submit"value="Change Password"/> <divclass="message">@message</div> <div><ahref="Default.cshtml">Return to home page</a></div> </form>
body는 사용자가 자신의 사용자 이름과 나이와 새 암호를 입력하는 텍스트 상자가 포함되어 있습니다. 코드에서, 당신은 WebSecurity Helper의 ChangePassword 메서드를 호출하고 당신이 사용자로부터 얻을 값을 전달합니다.
브라우저에서 페이지를 실행합니다. 이미 로그 인한 경우 사용자 이름이 페이지에 표시됩니다.
기존 암호를 잘못 입력하거나 올바른 비밀 번호를 입력하지 않으면, WebSecurity.ChangePassword 메서드가 실패 메시지를 표시합니다.
유효한 값을 넣고 다시 비밀 번호를 변경해보십시오.
6. 사용자의 새 비밀 번호를 생성해 주기 사용자가 자신의 암호를 잊어버린 경우, 당신은 그들이 새로 생성해줄 수 있습니다. (이것은 그들이 아는 비밀 번호를 변경하는 것과 다릅니다.) 사용자가 새 비밀 번호를 얻을 수 있도록하려면, WebSecurity helper의 GeneratePasswordResetToken 메서드를 사용합니다. token은 사용자에게 전송하고 고유 비밀 번호를 재설정 같은 목적을 위해 사용자를 식별하는 암호 보안 문자열입니다. 사용자의 이메일에 그것을 보내, 토큰을 생성한 다음 토큰을 읽고 사용자가 새 비밀 번호를 입력 수있는 페이지로 링크합니다 -이 절차는이 모든 것들을 할 수있는 전형 방법을 보여줍니다. 사용자 이메일에 링크는 다음과 같이 표시됩니다 :
(Starter Site 템플릿은 이 절차에서 당신이 만든 페이지보다 더 완벽한 에러를 체크하는 ForgotPassword.cshtml 파일이 포함되어 있습니다.)
웹사이트의 Account 폴더에 ForgotPassword2.cshtml라는 새 페이지를 추가합니다.
다음 코드로 기존 내용를 교체합니다:
@{ Layout = "~/_SiteLayout.cshtml"; PageData["Title"] = "Forgot your password?";
var message = ""; var username = "";
if (WebMail.SmtpServer.IsEmpty() ){ // The default SMTP configuration occurs in _start.cshtml message = "Please configure the SMTP server."; }
if(IsPost) { username = Request["username"]; var resetToken = WebSecurity.GeneratePasswordResetToken(username);
var portPart = ":" + Request.Url.Port; var confirmationUrl = Request.Url.Scheme + "://" + Request.Url.Host + portPart + VirtualPathUtility.ToAbsolute("~/Account/PasswordReset2?PasswordResetToken=" + Server.UrlEncode(resetToken));
WebMail.Send( to: username, subject: "Password Reset", body: @"Your reset token is:<br/><br/>" + resetToken + @"<br/><br/>Visit <ahref=""" + confirmationUrl + @""">" + confirmationUrl + @"</a> to activate the new password." );
message = "An email has been sent to " + username + " with a password reset link."; } } <style> .message {font-weight:bold; color:red; margin:10px;} </style> <formmethod="post"action="">
@if(!message.IsEmpty()) { <divclass="error">@message</div> } else{ <div> Enter your email address: <inputtype="text"name="username"/><br/> <br/><br/> <inputtype="submit"value="Get New Password"/> </div> } </form>
페이지 본문에 사용자 이메일 주소를 묻는 메시지가 텍스트 상자가 포함되어 있습니다. 사용자가 양식을 제출하면, 먼저 페이지의 요점은 이메일 메시지를 보낼 수 있기 때문에 SMTP 메일 설정이 되어 있는지 확인합니다.
페이지의 핵심은 비밀 번호 재설정, 그리고 사용자가 제공한 이메일주소(사용자 이름)을 넘기는, 이런 방식으로 토큰을 만드는데 있습니다:
코드는 얻은 토큰과(여기서, 08HZGH0ALZ3CGz3) 그 토근에 새로운 패스워드를 넘겨, WebSecurity helper의 ResetPassword 메서드에를 호출합니다. 토큰이 유효하면, 이메일에 있는 토큰을 가지고있는 사용자에 대한 암호를 업데이트합니다. 리셋이 성공하면 ResetPassword 메서드는 true를 반환합니다.
이 예제에서는 ResetPassword에 대한 호출에서 몇 가지 유효성 검사는 & & (논리 그리고) 연산자를 사용하여 결합됩니다. 논리가 재설정면 성공입니다 :
◦ newPassword 텍스트 상자가 비어있지 않다. (! 연산자는 아니다는 뜻) 그리고 ◦ newPassword and confirmPassword 의 값이 일치한다. 그리고 ◦ 이 ResetPassword 메서드 성공했다.
브라우저에서 ForgotPassword2.cshtml 실행합니다.
귀하의 이메일 주소를 입력한 다음 새 암호 가져오기를 누릅니다. 페이지를 이메일을 보냅니다. (이것은이 작업을 수행하는 동안 지연이있을 수 있습니다.)
귀하의 이메일을 확인하고 누구의 제목아래 메시지를 찾아서 "Password Reset."을 찾습니다.
7. 웹사이트의 조인에서 자동화된 프로그램 방지 로그인 페이지가 귀하의 웹사이트에 등록할에서 자동화된 프로그램(때로는 웹 로봇으로 참조됨)을 중지하지 않습니다. (봇(bots)그룹에 대한 일반적인 동기는 판매를 위한 Url를 게시(post)하는 것입니다.) 귀하는 컴퓨터 프로그램이 아닌 진짜 사람으로 입력의 유효성을 검사하기 위해 보안 문자 테스트를 사용하여 컴퓨터 프로그램에 있는지를 확인하는데 도움이 필요할 수 있습니다. (CAPTCHA(보안문자)는 컴퓨터와 인간이 말하는 것에 대한 완전 자동화된 공용 튜링 테스트의 기준입니다.)
ASP.NET 페이지에서, 당신은 reCAPTCHA 서비스 (http://recaptcha.net)을 기반으로하는 보안 문자(CAPTCHA) 테스트를 렌더링하는 ReCaptcha Helper를 사용할 수 있습니다. ReCaptcha 도우미를 표시하여 사용자가 페이지를 확인하기 전에 변형된 단어의 이미지를 정확하게 입력해야만 ReCaptcha.Net 서비스에 의해 사용사 응답이 확인됩니다.
ReCaptcha.Net (http://recaptcha.net)에서 귀하의 웹사이트를 등록을 완료한 후, 당신은 public key 와a private key를 가져올 수 있습니다.
ASP.NET 웹 Helpers를 라이브러리가 설치되어 있어야 합니다.
Account 폴더에서 Register.cshtml라는 파일을 엽니다.
captchaMessage 변수에 / / 주석 문자를 제거합니다.
개인 키를 사용하여 PRIVATE_KEY 문자열을 교체합니다.
ReCaptcha.Validate 호출을 포함하는 라인에서 / / 주석 문자를 제거합니다.
다음 예제는 완성된 코드를 보여줍니다. (사용자 키로 여기에 있는 key를 대체.)
// Validate the user's response if(!ReCaptcha.Validate("user-key-here")){ captchaMessage ="Response was not correct"; isValid =false; }
Register.cshtml 페이지의 하단, 당신의 public key와 함께 PUBLIC_KEY 문자열을 바꿉니다.
ReCaptcha 호출을 포함하는 라인에서 주석 문자를 제거합니다. 다음 예제는 (사용자 키로 여기에 다시 user-key-here로 대체할 것을 제외) 완성된 코드를 보여줍니다 :
브라우저에서 Default.cshtml를 실행합니다. 이 사이트에 로그 인한 경우, 당신은 로그아웃 링크를 클릭하십시오.
등록 링크 및 보안 문자 테스트를 사용하여 등록을 테스트합니다.
참고: 컴퓨터가 프록시 서버를 사용하는 도메인에있는 경우, 당신은 Web.config 파일의 defaultproxy 요소를 구성해야 할 수도 있습니다. 다음 예제는 작동 reCAPTCHA 서비스를 사용하도록 구성된 defaultproxy 요소를 Web.config 파일을 보여줍니다.