메인 콘텐츠로 건너뛰기

위챗 미니프로그램

정보

Casdoor는 버전 1.41.0부터 위챗 미니 프로그램을 지원합니다.

소개

위챗 미니 프로그램은 표준화된 OAuth를 지원하지 않으므로, 로그인을 위해 자체 호스팅된 Casdoor 웹페이지로 리디렉션할 수 없습니다. 따라서, 위챗 미니 프로그램에서 Casdoor를 사용하는 과정은 일반 프로그램과 다릅니다.

이 문서에서는 위챗 미니 프로그램에 Casdoor를 통합하는 방법에 대해 설명합니다. 이 통합에 대한 예제는 여기 GitHub에서 찾을 수 있습니다: casdoor-wechat-miniprogram-example. 자세한 정보는 위챗 미니 프로그램 로그인 문서를 참조하십시오.

구성에는 다음과 같은 이름이 포함됩니다:

CASDOOR_HOSTNAME: Casdoor 서버가 배포된 도메인 이름 또는 IP 주소, 예를 들어, https://door.casbin.com.

단계 1: Casdoor 배포

먼저, Casdoor 서버를 배포해야 합니다.

Casdoor를 성공적으로 배포한 후에는 다음을 확인해야 합니다:

  1. Casdoor에 정상적으로 접근하고 사용할 수 있습니다.
  2. Casdoor의 origin 값을 (conf/app.conf) CASDOOR_HOSTNAME으로 설정하세요. Casdoor conf

단계 2: Casdoor 애플리케이션 구성

  1. Casdoor에 위챗 IDP를 생성하고 위챗 미니 프로그램 개발 플랫폼에서 제공하는 APPIDAPPSECRET를 제공하세요. WeChat_MiniProgram.png
  2. 새로운 Casdoor 애플리케이션을 생성하거나 기존의 것을 사용하세요.
  3. 이전 단계에서 생성한 IDP를 사용하려는 애플리케이션에 추가하세요.
Tips

편의를 위해, Casdoor는 애플리케이션의 첫 번째 위챗 타입 IDP를 기본적으로 위챗 미니 프로그램 IDP로 취급합니다.

따라서, 이 앱에서 위챗 미니 프로그램을 사용하려면 하나의 앱에 여러 위챗 타입 IDP를 추가하지 마세요.

단계 3: 위챗 미니프로그램 코드 작성

위챗 미니 프로그램은 내부적으로 로그인하고 코드를 얻는 API를 제공합니다. 그런 다음 코드를 Casdoor에 보내야 합니다. Casdoor는 이 코드를 사용하여 위챗 서버에서 정보(예: OpenID 및 SessionKey)를 검색합니다.

다음 코드는 위의 과정을 어떻게 수행하는지 보여줍니다:

// Login in mini program
wx.login({
success: res => {
// This is the login code that needs to be sent to Casdoor
console.log(res.code)

wx.request({
url: `${CASDOOR_HOSTNAME}/api/login/oauth/access_token`,
method: "POST",
data: {
"tag": "wechat_miniprogram", // Required
"client_id": "6825f4f0af45554c8952",
"code": res.code,
"username": this.data.userInfo.nickName, // Update user profile when you log in.
"avatar": this.data.userInfo.avatarUrl,
},
header:{
"content-type": "application/x-www-form-urlencoded",
},
success: res => {
console.log(res)
this.globalData.accessToken = res.data.access_token // Get Casdoor's access token
}
})
}
})

tag 매개변수는 이것이 WeChat 미니 프로그램에서의 요청임을 Casdoor에 알리는 데 필수적이라는 점을 주의해야 합니다.

위의 코드는 로그인 중인 WeChat 미니 프로그램 사용자의 사용자 이름과 아바타 URI를 포함합니다. 이 두 매개변수를 별도로 전달하고 성공적인 로그인 및 액세스 토큰 획득 후에 Casdoor에 전달할 수 있습니다:

wx.getUserProfile({
desc: 'share your info to Casdoor',
success: (res) => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
console.log(app.globalData.accessToken)
wx.request({
url: `${CASDOOR_HOSTNAME}/api/update-user`, // Casdoor URL
method: "POST",
data: {
"owner": "test",
"name": "wechat-oGk3T5tIiMFo3SazCO75f0HEiE7Q",
"displayName": this.data.userInfo.nickName,
"avatar": this.data.userInfo.avatarUrl
},
header: {
"Authorization": "Bearer " + app.globalData.accessToken, // Bearer token
"content-type": "application/json"
},
success: (res) => {
console.log(res)
}
})
}
})

또한, 필요한 Casdoor 작업에 대한 베어러 토큰으로 액세스 토큰을 사용할 수 있습니다.

Tips

현재 Casdoor는 기존 계정을 WeChat 미니 프로그램 사용자에게 연결할 수 없습니다. Casdoor가 WeChat에서 OpenID를 검색한 후, ID가 존재하지 않으면 새 사용자를 생성하거나, 존재하면 기존 사용자를 사용합니다.