SWA 앱 생성 방법 Case2

OIN에서 SWA 사용을 위해 만든 커스텀 앱

Okta 공식문서

Configure the Okta Template App and Okta Plugin Template App

SWA 앱 생성 방법 Case1으로 앱이 정상 동작하지 않는 경우, OIN에서 SWA 커스텀 앱 사용합니다.

OIN에서 제공해주는 SWA 커스텀 앱은 총 6가지입니다.

• Template App: 앱이 양식 POST를 통한 인증을 지원하는 경우

• Template Plugin App: 로그인 페이지에 사용자 이름, 비밀번호 또는 제출 버튼 필드가 있는 경우

• Template App 3 Fields: ID, PW 이외에 다른 필드가 있을 경우

• Template 2 Page Plugin App: Template Plugin App과 유사한 기능을 하며, 로그인 페이지가 하나가 아닌 두 페이지로 분산된 경우 Browser plugin auto-submit을 지원하지 않습니다.

• Template Basic Auth App: 앱이 기본 Auth를 지원하는 경우

• Template Frame Plugin App: 앱이 Iframe을 지원하는 경우

Ⅰ. SWA 앱 생성 및 설정

1. [Okta] 앱 등록

경로: Application ➡ Application ➡ Browse App Catalog ➡ Okta template Plugin App ➡ Add Integration

1. Application label: 앱을 할당받을 경우 데시보드에서 보여지는 앱의 이름입니다.

2. Login URL: 로그인 페이지 URL을 입력합니다.

3. Username field: CSS selector 찾는 방법에서 ID 필드값을 찾아서 복사 붙여넣기합니다.

4. Password field: 아래 CSS selector 찾는 방법에서 PW 필드값을 선택하여 복사 붙여넣기합니다.

5. Login button: 아래 CSS selector 찾는 방법에서 로그인 버튼 값을 선택하여 복사 붙여넣기합니다.

2. [Web]CSS selector 찾는 방법

경로: 값을 찾을 영역을 선택하고 마우스 우클릭 ➡ 검사 ➡ Copy ➡ Copy selector

Username, Password, Login button에 알맞은 CSS Selector 값을 복사하여 붙여넣기 하면 됩니다.

Ⅱ. 최종 사용자 경험

1. Okta Dashboard 로그인