우측 패널 앱 만들기
우측패널을 사용하는 APP 실습
- 모달창을 띄우는 방식과 같습니다.
- 백엔드 서버가 준비되어 있다는 가정하에 실습을 진행합니다. (본 예제는 fastAPI를 이용함 )
Swit Store App 생성 및 설정
Modal창 띄우기 실습시 사용한 앱을 사용하셔도 무방합니다.
새로 APP을 생성한다는 기준으로 설명을 진행합니다.

2 New app 으로 App name 기입후 생성

3 우측 메뉴 App info -> Install URL 에 인증 받을 URL 입력

4 우측 메뉴 Authentication -> Allowed redirect URLs 에 oauth/callback URL 입력 (oauth 인증후 토큰 발급에 사용될 주소)

5 우측 메뉴 Scopes -> Active scopes 에 app:install 추가 (앱 내에서 필요한 scope 알맞게 추가선택)

6 우측 메뉴 User actions -> 활성화 체크 -> Callback URL 에 https://{host}/{app-server-path} 기입 -> Right panel launcher 활성화

7 우측 메뉴 Status settings -> Activity status 활성화

App install 및 관리자 토큰 (봇 토큰) 발급
관리자 토큰 (봇 토큰) - 최초 앱 설치 로직 시 발급되는 토큰 (app:install 스콥이 포함된 토큰)
사용자 토큰 - 앱 가입(로그인) 로직 시 사용자별로 발급되는 개별 토큰 (사용자 권한별 스콥이 부여된 토큰)
1. Swit Store 에서 해당 앱 설치버튼 클릭
- 앱 설정시 3 번에서 기입한 install URL 을 가지고 인증 요청 됨
- 엑세스 요청 화면에서 허용하고 설치하기 누를시 설정 4번 내용에서 등록한 Allowed redirect URL 로 redirect 됨 (인증 요청 하는 메서드에서 redirect 파라미터를 동일한 URL 로 보내야 함)
- callback URL 에서는 토큰 요청 및 수신 후 앱 설치 완료
@app.get("/oauth")
async def oauth():
get_ep = '/oauth/authorize'
get_params = {
'client_id': clientid,
'redirect_uri': redirect_uri+'/callback',
'response_type': 'code',
'scope': install_scope
}
return RedirectResponse(
url=f"{api}{get_ep}?{parse.urlencode(get_params)}"
)
@app.get("/callback")
async def callback(code: str):
post_ep = '/oauth/token'
r = requests.post(
url=f"{api}{post_ep}",
headers={
'Content-Type': 'application/x-www-form-urlencoded'},
data={
'grant_type': 'authorization_code',
'client_id': clientid,
'client_secret': secret,
'redirect_uri': redirect_uri+'/callback',
'code': code}
)

2. Swit 에서 우측 APP List 에 등록한 앱이 있는지 확인

우측 패널 화면 만들기 및 띄우기