지식 재료

Node-RED

Microsoft ID 플랫폼 및 OAuth 2.0 인증 코드 흐름

이용환경

[Node-RED]

IBM Cloud (https URL이 필요하므로 IBM Cloud에서 환경을 준비하는 것이 쉽습니다.)

이번 목표

조직의 Microsoft 계정으로 로그인할 수 있는 웹 응용 프로그램의 로그인 부분을 Node-RED로 구현합니다.

실천 개요

Microsoft Application ID 획득

Azure에 로그인한 후 왼쪽 메뉴에서 Azure Active Directoryメニュー를 클릭합니다.
이 이후에는 Azure Active Directory (AzureAD)의 메뉴를 조작한다.

애플리케이션 등록

애플리케이션 작성

조직의 App registrationsメニュー를 클릭하십시오.

App registrations 대화상자의 상단 "+ New registration"을 클릭합니다.


Register an application 대화 상자에서 Name 속성에이 응용 프로그램의 이름을 입력합니다. (예에서는 TestLogin)
입력이 끝나면 대화 상자 하단의 Register를 클릭하십시오.


응용 프로그램 작성이 완료되면 응용 프로그램 속성 화면에서 Application (client) ID 및 Directory (tenant) ID를 기록합니다.

RedirectURL 등록

작성한 어플리케이션의 다이얼로그에서 Authentication 메뉴를 클릭해, RedirectURL 에, 지금부터 작성하는 웹 어플리케이션의 톱 페이지의 URL 를 입력한다.
입력이 완료되면 대화상자 상단의 Save를 클릭합니다.

Client secrets 만들기

작성한 어플리케이션의 다이얼로그에서 Certificates & secrets 메뉴를 클릭해, 다이얼로그 하단의 Client secrets 로부터 「+New client secret」버튼을 클릭해, 새로운 client secret 를 작성해, 메모한다. (유효 기한은 적절히 선택한다)

Node-RED 흐름 생성

흐름 소스

(1)ログイン画面へ 및 (2)Token 取得의 Function 노드에서 다음을 적절한 값으로 변경하십시오.

{Directory (tenant) ID}

{Application (client) ID}

{RedirectURL};

{client secret}

[{"id":"946738f8.0aea78","type":"tab","label":"Microsoft ID","disabled":false,"info":""},{"id":"f2fd2be5.f839b8","type":"http in","z":"946738f8.0aea78","name":"","url":"/msapp","method":"get","upload":false,"swaggerDoc":"","x":90,"y":60,"wires":[["f936e317.9c61e"]]},{"id":"80013dcd.a758f","type":"http in","z":"946738f8.0aea78","name":"","url":"/mslogin","method":"post","upload":false,"swaggerDoc":"","x":90,"y":140,"wires":[["77eca14a.70ea5","7bd7564c.af5b58"]]},{"id":"f936e317.9c61e","type":"function","z":"946738f8.0aea78","name":"(1)ログイン画面ヘ","func":"var tenant = {Directory (tenant) ID};\nvar clientid = {Application (client) ID};\nvar redirectURL = {RedirectURL};\n\nmsg.url = \"https://login.microsoftonline.com/\" + tenant + \n \"/oauth2/authorize\";\n \nmsg.method = \"GET\";\nmsg.statusCode = 303;\nmsg.headers = {\n    location : \n    msg.url + \n    \"?client_id=\" + clientid + \n    '&response_type=code' + \n    '&redirect_uri=' + encodeURIComponent(redirectURL) + \n    '&response_mode=form_post' + \n    '&state=nagi_hisakawa'\n};\nmsg.payload = {};\nreturn msg;\n","outputs":1,"noerr":0,"x":330,"y":60,"wires":[["2a2e40a7.09177"]]},{"id":"2a2e40a7.09177","type":"http response","z":"946738f8.0aea78","name":"","statusCode":"","headers":{},"x":670,"y":60,"wires":[]},{"id":"77eca14a.70ea5","type":"debug","z":"946738f8.0aea78","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":310,"y":220,"wires":[]},{"id":"7bd7564c.af5b58","type":"function","z":"946738f8.0aea78","name":"(2)Token 取得","func":"var tenant = {Directory (tenant) ID};\nvar clientid = {Application (client) ID};\nvar redirectURL = {RedirectURL};\nvar secret = {client secret};\n\nmsg.url = \"https://login.microsoftonline.com/\" + tenant + \"/oauth2/token\";\n\nmsg.method = \"POST\";\nmsg.headers = \n{\n    'Content-Type': \"application/x-www-form-urlencoded\"\n}\n\nmsg.payload = {\n  'grant_type' : \"authorization_code\",\n  'client_id' : clientid,\n  'code' : msg.payload.code,\n  'redirect_uri' : redirectURL,\n  'client_secret': secret,\n  'resource' : clientid\n};\nreturn msg;\n","outputs":1,"noerr":5,"x":320,"y":140,"wires":[["22ae285e.090488"]]},{"id":"22ae285e.090488","type":"http request","z":"946738f8.0aea78","name":"","method":"use","ret":"obj","url":"","tls":"","x":490,"y":140,"wires":[["2c257eeb.8c3312"]]},{"id":"2c257eeb.8c3312","type":"function","z":"946738f8.0aea78","name":"(3)JWT 展開","func":"var base64Url = msg.payload.id_token.split('.')[1];\nvar base64 = base64Url.replace('-', '+').replace('_', '/');\nvar bb = new Buffer(base64, 'base64').toString();\nvar c = JSON.parse(bb);\nmsg.payload = c;\n//msg.payload.user = c.name;\n\nreturn msg;\n","outputs":1,"noerr":0,"x":490,"y":180,"wires":[["2a2e40a7.09177"]]}]

실행 및 결과

https://ホスト名/msapp로 이동하면 Microsoft 로그인 화면으로 리디렉션됩니다.

로그인에 성공하면 로그인한 사용자 정보가 브라우저에 표시됩니다.