Angular를 사용하는 로그인 화면이 있는SPA의 예JS 및 ASP에 접속합니다.NET Web API 2?
새로운 AngularJS Web API Single page 어플리케이션을 만들고 싶습니다.ASP를 사용하는 간단한 로그인(Google/Facebook 로그인 등 필요 없음)을 위해 WEB API 컨트롤러에 접속하는 사용자 로그인 화면을 설정하는 예를 들어보신 분 계십니까?사용자 등록이 필요 없는 NET ID.
또한 로그인이 완료된 후 새로운 보기를 표시하는 방법은 무엇입니까?하지 않는 를 들어, 로그인 몇 개의 에서 URL을 할 수 .그래서 예를 들어 로그인 뷰와 다른 뷰에서 URL을 변경하지 않고 전환할 수 있으면 좋겠습니다.www.abc.com
, 저는 '보다 낫다', '보다 낫다', '보다 낫다'는 것을 .www.abc.com/login,www.abc.com/screen1,www.abc.com/screen2
어떤 조언이라도 해주시면 감사하겠습니다.
그래서 예를 찾는 대신 (아래 링크)를 만들었습니다.이 기능의 구조를 설명하기 위해 몇 가지 사항을 살펴보겠습니다.
새로운 ASPNET Identity 시스템은 HTTP를 통해 Web API 리소스를 소비하는 클라이언트에서 사용할 수 있는 OAuth 2.0 베어러 토큰 구현을 제공합니다.인증은 세션쿠키에 저장되지 않기 때문에 서버는 인증 상태를 유지할 책임이 없습니다.단, 서버 인증과 반환된 토큰 관리를 소비자가 관리해야 한다는 것입니다.이는 Microsoft가 VS 2013에서 제공하는SPA 템플릿에서 사용하는 시스템입니다.
AngularJS는 인증에 관한 전제를 하지 않기 때문에 인증 방법은 사용자에게 달려 있습니다.
는 Angular를 제공합니다.JS★
$http및 기반 서비스를$resource있습니다.$http.★★★★★★ 。Authorization위의 베어러 토큰을 구현한 헤더를 조합하여 HTTP를 통해 서버 리소스에 대한 인증된 액세스를 제공할 수 있습니다. JS를 할 수 .AuthorizationHTTP를 사용합니다.
설정 등세부사항을 .AuthorizationWeb API 서버와 SPA 사이의 헤더.사용자의 인증 상태에 따라 특정 UI 요소를 숨겨 탐색을 방지할 수 있습니다.단, 스테이트를 인증이 필요한 것으로 정의하고 있는 경우resolve스테이트 오브젝트, 워처 세트$stateChangeError이벤트는 오류를 캡처하고 사용자를 로그인 폼으로 수정합니다.적절한 인증이 이루어지면, 유저는 네비게이트 하려고 했던 상태로 리다이렉트 됩니다.
브라우저 세션 간에 인증이 손실되는 것을 방지하기 위해(클라이언트가 인증 토큰을 관리하고 해당 토큰이 메모리에 유지되므로) 사용자가 인증을 쿠키에 유지하는 기능도 추가했습니다.이 모든 것은 사용자에게 투명합니다.기존 형식 및 세션 기반 인증과 실질적으로 동일합니다.
사용자가 경로를 볼 수 없도록 하려는 이유를 모르겠지만, 그렇게 코드화했습니다.나는 Sedushi의 Angular 사용법에 대한 Plunker의 예에 빚이 있다.URL을 사용하지 않고 상태 저장 방식으로 탐색하는 UI 라우터.하지만 제가 직접 쓸 수 있는 어플리케이션에는 이 어플리케이션을 추천할 수 있을지 모르겠습니다.
완전한 솔루션(WebAPI와 Web 양쪽 모두)UI)는 여기서 단계별 지시와 함께 제공됩니다.
뭔가 불명확한 부분이 있으면 가르쳐 주세요.답변에서 좀 더 명확하게 하도록 하겠습니다.
ASP용 싱글 페이지 애플리케이션(SPA) 데모는 다음 블로그를 참조하십시오.Marlabs 팀이 개발한 NET Web API 2 및 AngularJS.
이 앱은 다음과 같은 기술로 구축되었습니다.
- ASP.NET Web API 2
- EF 6 코드 우선
- 오토매퍼
- 오토팩
- 시멘틱 UI
- AngularJS 1.1.5
어플리케이션은 https://github.com/MarlabsInc/webapi-angularjs-spa의 github에 공개되어 있습니다.
@DavidAntaramian은 훌륭한 예를 들었다.단, 심플하게 하고 싶은 경우는, Microsoft사의 HOL을 참조할 수 있습니다.github의 최신 예에서는 를 사용합니다.NET Core 단, 2015년 10월부터 릴리즈를 다운로드할 수 있습니다.
언급URL : https://stackoverflow.com/questions/21662778/example-of-an-spa-with-a-login-screen-that-uses-angularjs-and-connects-to-asp-ne
'programing' 카테고리의 다른 글
| 각진 서비스에서는 어떻게 $on을 사용할 수 있습니까? (0) | 2023.03.05 |
|---|---|
| SQLPLUS를 사용하여 CSV 형식의 파일로 스풀하려면 어떻게 해야 합니까? (0) | 2023.02.28 |
| ORA-28040: 일치하는 인증 프로토콜 예외 없음 (0) | 2023.02.28 |
| ASMX 파일에서 JSON을 출력하는 방법 (0) | 2023.02.28 |
| 오라클 인덱스를 선택하고 최적화하는 방법 (0) | 2023.02.28 |