SPA + WebAPI 용 OpenID Connect 미들웨어

Question

Google을 통해 OpenID Connect를 인증하기 위해 WebAPI 백엔드가있는 SPA (각형) 앱을 업그레이드하는 중입니다. 이상적으로 우리는 하이브리드 플로우를 사용하고자합니다.

Google 로그인 버튼을 클릭하면 브라우저가 Google로 리디렉션되고 동의 화면이 표시되며 코드 및 ID 토큰으로 앱에 응답이 전송됩니다. 시나리오의 대부분은 거기 출판 보여 당신이 통지 인증 코드가 반환되는 화재와의 MVC 응용 프로그램 구성 방법 :

app.UseOpenIdConnectAuthentication(new OpenIdConnectAuthenticationOptions 
     { 
      ClientId = "", 
      MetadataAddress = "https://accounts.google.com/.well-known/openid-configuration", 
      RedirectUri = "https://localhost:44300/authentication", 
      Scope = "openid profile", 

      Notifications = new OpenIdConnectAuthenticationNotifications 
      { 
       AuthorizationCodeReceived = async n => 
       { 

우리의 경우 화재 결코 나는 응답이 전송되기 때문에 그 이유가 생각 다시 우리의 SPA로, 우리의 애플 리케이션의 서버 측 엔드 포인트로 돌아 가지 않습니다. 여기에 다음 단계는 무엇입니까?

• 클라이언트에서 코드를 수신하고 웹 토픽 레이어에 ajax 요청을 보내 액세스 토큰을 교환합니까? 액세스 토큰이 있으면 js에서 API 호출을 할 때 토큰이 유효한 것으로 인식되도록 사용자가 로그인되었음을 알리는 방법은 무엇입니까?
• 우리 웹 API 계층에 응답을 보내고, 액세스 토큰에 대한 코드를 교환하고, 마지막에 액세스 토큰을 포함하는 해시 조각으로 리디렉션 응답을 보냅니다. 알림 핸들러가 해당 인스턴스에서 실행됩니까?

두 경우 모두 OpenID 미들웨어에서 코드를 교환하기 위해 무엇을 활용할 수 있습니까? 게시물 요청은 굉장히 복잡해 보이지 않지만 가능한 경우 기존 라이브러리를 활용하면 좋을 것입니다.

Answer 1

미들웨어 "Microsoft.Owin.Security.Google"을 사용하면 더 높은 수준의 추상화를 사용할 수 있습니다. 외부 Google 액세스 토큰을 얻을 수 있으며 "OAuth"와 함께 제공되는 복잡성에 신경 쓰지 않아도됩니다. 인증 코드 흐름 "이 미들웨어에 의해 처리되고 외부 액세스 토큰을 직접 가져옵니다. 이 미들웨어의 기본 범위는 "openid profile email"이며이를 무시할 수 있지만 빈 범위를 통과 한 경우 기본적으로 해당 범위를 갖습니다. 이 middleware here에 대한 구현을 확인할 수 있습니다.

마찬가지로 웹 API와 함께 Google 외부 로그인을 사용하는 방법에 대한 자세한 게시물을 블로깅했습니다. MVC 라이브러리가 포함되어 있지 않다면이 post here을 확인하십시오. 귀하의 경우에 유용 할 것입니다.