Add third-party identity providers to enable frictionless sign in for your users
Authgear supports the following social and enterprise identity providers. Please click the link below for setup instructions.
Guides on how to add social login providers like Facebook, Google, LinkedIn Apple
To configure "Sign in with Apple" for Authgear, you will need to fulfil the following:
Register an Apple Developer Account. Apple Enterprise Account does not support "Sign in with Apple"
Register your own domain.
Your domain must be able to send and receive emails.
Set up Sender Policy Framework(SPF) for your domain.
Set up DomainKeys Identified Mail(DKIM) for your domain.
Create an "App ID" by adding a new "Identifier" here, choose app IDs, enable "Sign in with Apple" enabled.
Create a "Services ID" by adding a new "Identifier" here, choose service IDs, enable "Sign in with Apple".
Click "Configure" the Next to "Sign in with Apple". In "Primary App ID" field, select app ID created above.
Fill in and verify the domain created above, add https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/apple
to Return URLs
Create a "Key" following this guide with "Sign in with Apple" enabled. Click "Configure" next to "Sign in with Apple" and select "Primary App ID" with app ID created above. Keep the private key safe, you need to provide this later.
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with Apple.
Fill in the Client ID with the Service ID obtained above.
In Apple Developer Portal, view key information of the "Key" created above.
Jot down the Key ID and download the key text file (.p8
file).
Copy the content in the key text file to Client Secret text area in Authgear Portal..
Fill in Key ID field using the Key ID obtained from step 5.
In Apple Developer Portal, click username on the top right corner, click View Membership.
Find the Team ID from Membership Information, fill in Team ID field in Authgear portal.
Save the settings.
🎉Done! You have just added Sign in with Apple to your apps!
Add Google Sign in to your apps in less than 5 minutes.
To configure Google OAuth client for Authgear, you will need to create an OAuth client on Google Cloud Platform first.
Create a project on Google Cloud Platform through console. If you are adding Authgear to your existing Google Cloud Platform projects, you may skip to the next step to create the OAuth client.
After creating a new project, you will need to configure the OAuth consent screen. Press the button on the top-left and go to APIs & Services -> OAuth consent screen and follow the instruction to create the consent screen.
Go to -> APIs & services -> Credentials
Click Create Credentials -> OAuth client ID
Choose Web application in Application type and assign a name as reference. You should always choose Web application here regardless of the platform of the app you are creating. It is because this OAuth Client ID is used by your Authgear services, which is a web application in Google’s classification.
Add https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/google
to redirect URIs.
After creating a client ID, you will see the client ID under the OAuth 2.0 Client IDs section of the Credentials page.
You can find more details in official Google Cloud Platform doc
After creating an OAuth client, click the name of OAuth client to view the details.
You will need the values of Client ID, Client secret to configure Google Sign In.
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with Google.
Fill in the Client ID and Client Secret with the values obtained from the previous step.
Save the settings.
🎉Done! You have just added Google Sign In to your apps!
Your end-users can now sign in with Google on Authgear pre-built Log In and Sign Up page. Existing end-users can connect their account to Google in the User Settings page.
Add Facebook Sign in to your apps in less than 5 minutes.
This guide shows how to connect your Authgear application to Facebook so users can log in using the Login with Facebook feature.
If you are using Authgear in your existing Facebook Apps, you may skip to the next step to set up the OAuth client.
You will need a Facebook developer Account. Register as one by clicking Get Started in the Facebook for Developers website.
To create a new app, go to the Facebook Developers Apps panel then click the Click Create App button.
On the next screen, select Other as your app use case then, click Next.
In the app type selection screen, pick the option that best meets your requirements. For our example, we'll select the Consumer app type.
Enter your app name on the next screen and finish the app creation process.
In the app panel, click Add Product next to Products in the sidebar.
Click the Set Up button in Facebook Login.
Go to Settings of Facebook Login.
Make sure Client OAuth Login and Web OAuth Login are enabled.
Add https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/facebook
to Valid OAuth Redirect URIs and save the changes.
After setting up the Facebook Login product, go to App settings > Basic in the sidebar.
You will need the App ID and App Secret to configure Facebook Login so, note them down.
In the portal, go to Authentication > Social / Enterprise Login.
Enable Login with Facebook.
Fill in the Client ID with the App ID obtained from the Facebook Developers portal in the previous step.
Save the settings.
🎉 Done! You have just added Facebook Login to your apps!
Your end-users can now sign in with Facebook on Authgear's pre-built Log In and Sign Up page. Existing end-users can connect their account to Facebook in the User Settings page.
Follow the official guide to create a OAuth App.
In "Authorization callback URL", use https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/github
.
After the creation, click "Generate a new client secret". Remember the client secret.
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with GitHub.
Fill in Client ID.
Fill in Client Secret.
Save the changes.
🎉 Done! You have just added GitHub integration to your apps!
Create an app in the Linkedin Developers Portal.
In the "Products" section, choose "Sign In with LinkedIn"
In the details page of the created app, click the "Auth" tab
Take notes of "Client ID" and "Client Secret", add https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/linkedin
to "Redirect URLs" in "OAuth 2.0 settings" section
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with LinkedIn.
Fill in Client ID.
Fill in Client Secret.
Save the settings.
🎉 Done! You have just added Linkedin Login to your apps!
To create a website application in WeChat, you can choose to setup a website application and wait for approval or a sandbox account for testing.
Register an account in WeChat Open Platform.
Create Website Application (网站应用), fill in information and wait for approval (It may take few days).
View the application detail page, obtain the "AppID" and "AppSecret" on the top of the application page.
Go to Account Center > Basic information, to obtain the "原始ID".
Use your WeChat app to login in 微信公众平台接口测试帐号申请.
Obtain the "appID", "appSecret" and "原始ID". The "原始ID" is the "微信号" in the top right corner.
Fill in 接口配置信息. The URL must be pointing at a publicly reachable server. The token is a string of your choice.
Implement the 接口配置信息 server. Here is an example written in Golang.
package main
import (
"crypto/sha1"
"crypto/subtle"
"encoding/hex"
"fmt"
"io"
"net/http"
"sort"
"strings"
)
type WechatVerifyHandler struct {
Token string
}
func (h *WechatVerifyHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
err := r.ParseForm()
if err != nil {
http.Error(w, err.Error(), http.StatusBadRequest)
return
}
signature := r.Form.Get("signature")
timestamp := r.Form.Get("timestamp")
nonce := r.Form.Get("nonce")
echostr := r.Form.Get("echostr")
token := h.Token
tmpArr := []string{token, timestamp, nonce}
sort.Strings(tmpArr)
tmpStr := strings.Join(tmpArr, "")
hasher := sha1.New()
io.WriteString(hasher, tmpStr)
computedHash := hasher.Sum(nil)
computedhashInHex := hex.EncodeToString(computedHash)
if subtle.ConstantTimeCompare([]byte(signature), []byte(computedhashInHex)) == 1 {
w.Write([]byte(echostr))
return
}
http.Error(w, fmt.Sprintf("%v != %v", signature, computedhashInHex), http.StatusBadRequest)
}
func main() {
http.Handle("/", &WechatVerifyHandler{
Token: "TOKEN", // Change this value to the value you told Wechat!
})
http.ListenAndServe(":9999", nil)
}
Fill in JS接口安全域名. The value is your Authgear domain name plus port, e.g. 192.168.2.88:3000
or myapp.authgear.cloud
Fill in 网页授权获取用户基本信息. The value is your Authgear domain name plus port, e.g. 192.168.2.88:3000
or myapp.authgear.cloud
Look for an QR code in the sandbox settings page. You must scan it with your Wechat app and follow the sandbox account.
In the portal, do the following:
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with WeChat (Web/网站应用).
Fill in Client ID with the AppID.
Fill in Client Secret with the AppSecret.
Fill in 原始 ID with the 原始 ID.
Check the checkbox Is Sandbox account if you are using sandbox account.
Save the settings.
Wechat integration is a bit more complicated then other social login, here are the overview of what needs to be done:
Register an account and create mobile application in WeChat Open Platform. Approval is needed in this process.
Enable and configure WeChat Login in Authgear portal.
Include Authgear SDK on your app.
Implement a delegate function to be triggered when user clicks the "Login with WeChat" button during authorization. You need to integrate WeChat SDK to open WeChat app to perform authentication in the delegate function (we have sample code below). After obtaining the authorization code from WeChat, call the Authgear callback with the auth code and complete the "Login With WeChat" process.
Here are the detailed steps for iOS, Android, React Native, and Flutter.
Register an account in WeChat Open Platform.
Create Mobile Application (移动应用), fill in information and wait for approval (It may take few days).
View the application detail page, obtain the AppID
and AppSecret
on the top of the page.
Go to Account Center > Basic information, to obtain the "原始ID".
Save those values, we will need them in the section below.
Setup Authgear iOS SDK.
Follow iOS接入指南 to setup WeChat SDK. For the coding part, we will further explain in the below steps.
WechatOpenSDK
is Objective-C library. If you are using swift. You will need to create bridging header. To setup bridge header, please check Importing Objective-C into Swift. Here is the example WechatOpenSDK-Bridging-Header.h
.
#ifndef WechatOpenSDK_Bridging_Header_h
#define WechatOpenSDK_Bridging_Header_h
#import "WXApiObject.h"
#import "WXApi.h"
#endif
After setting up the WechatOpenSDK
, universal link should be enabled in your application. We will need two links for the setup. One is for the WeChat SDK used, another is for the Authgear SDK to trigger delegate function when user click "Login with WeChat" button. Here are the suggestion of the links.
WECHAT_UNIVERICAL_LINK: https://{YOUR_DOMAIN}/wechat
WECHAT_REDIRECT_URI_FOR_AUTHGEAR: https://{YOUR_DOMAIN}/open_wechat_app
Login WeChat Open platform, open the application detail page, update the development information iOS section.
Fill in "Bundle ID" field with your app bundle id.
Fill in "Universal Links" with "WECHAT_UNIVERICAL_LINK" above.
Go to Authgear portal, do the following:
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with WeChat (Mobile/移动应用).
Fill in Client ID with the AppID.
Fill in Client Secret with the AppSecret.
Fill in 原始 ID with the 原始 ID.
Add WECHAT_REDIRECT_URI_FOR_AUTHGEAR above in WeChat redirect URIs.
Save the settings.
Update the code
Setup WeChat SDK when app launch
// Replace WECHAT_APP_ID with wechat app id
// Replace WECHAT_UNIVERICAL_LINK with the link defined above
WXApi.registerApp("WECHAT_APP_ID", universalLink: "WECHAT_UNIVERICAL_LINK")
WXApi.startLog(by: .detail) { log in
print(#line, "wechat sdk wxapi: " + log)
}
Setup Authgear delegate and call WeChat SDK when sendWechatAuthRequest
is triggered
// Replace self with the object that you implement the AuthgearDelegate
authgear.delegate = self
// Replace WECHAT_APP_ID with wechat app id
extension MyClass: AuthgearDelegate {
func sendWechatAuthRequest(_ state: String) {
let req = SendAuthReq()
req.openID = "WECHAT_APP_ID"
req.scope = "snsapi_userinfo"
req.state = state
WXApi.send(req)
}
}
Handle universal link
// Update App Delegate
func application(_ application: NSApplication,
continue userActivity: NSUserActivity,
restorationHandler: @escaping ([NSUserActivityRestoring]) -> Void) -> Bool {
// wechat sdk handle, replace self with object implement WXApiDelegate
WXApi.handleOpenUniversalLink(userActivity, delegate: self)
// authgear sdk handle
return authgear.application(application, continue: userActivity, restorationHandler: restorationHandler)
}
// If your app has opted into Scenes, Update Scene Delegate
func scene(_ scene: UIScene, continue userActivity: NSUserActivity) {
// wechat sdk handle, replace self with object implement WXApiDelegate
WXApi.handleOpenUniversalLink(userActivity, delegate: self)
// authgear sdk handle
authgear.scene(scene, continue: userActivity)
}
// Implement WXApiDelegate
extension MyClass: WXApiDelegate {
func onReq(_ req: BaseReq) {}
func onResp(_ resp: BaseResp) {
// Receive code from WeChat, send callback to authgear
// by calling `authgear.wechatAuthCallback`
if resp.isKind(of: SendAuthResp.self) {
if resp.errCode == 0 {
let _resp = resp as! SendAuthResp
if let code = _resp.code, let state = _resp.state {
authgear.wechatAuthCallback(code: code, state: state) { result in
switch result {
case .success():
// send wechat auth callback to authgear successfully
case let .failure(error):
// failed to send wechat auth callback to authgear
}
}
}
} else {
// failed to obtain code from wechat sdk
}
}
}
}
Provide wechatRedirectURI
when calling authenticate
and promoteAnonymousUser
in authgear sdk
// Replace "WECHAT_REDIRECT_URI_FOR_AUTHGEAR" with link defined above
container?.authenticate(
redirectURI: "REDIRECT_URI",
prompt: "login",
wechatRedirectURI: "WECHAT_REDIRECT_URI_FOR_AUTHGEAR"
) { result in
}
// For anonymous user support only
// Replace "WECHAT_REDIRECT_URI_FOR_AUTHGEAR" with link defined above
container?.promoteAnonymousUser(
redirectURI: "REDIRECT_URI",
wechatRedirectURI: "WECHAT_REDIRECT_URI_FOR_AUTHGEAR"
) { result in
}
// Open setting page
// Replace "WECHAT_REDIRECT_URI_FOR_AUTHGEAR" with link defined above
container?.open(
page: .settings,
wechatRedirectURI: "WECHAT_REDIRECT_URI_FOR_AUTHGEAR"
)
Here is the completed example.
Setup Authgear iOS SDK.
Follow Android接入指南 to setup Wechat SDK. For the coding part, we will further explain in the below steps.
Login WeChat Open platform, open the application detail page, update the development information Android section.
Fill in application signature, you can obtain it with command keytool -list -v -keystore YOUR_KEYSTORE_FILE_PATH
. WeChat needs the certificate fingerprint in MD5, remove :
in the fingerprint. It should be string in length 32.
Fill in your package name
We will need to define a custom url for Authgear SDK to trigger delegate function when user click "Login with WeChat" button. Here is the example, you should update it with your own scheme.
"WECHAT_REDIRECT_URI_FOR_AUTHGEAR": com.myapp://host/open_wechat_app
Go to Authgear portal, do the following:
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with WeChat (Mobile/移动应用).
Fill in Client ID with the AppID.
Fill in Client Secret with the AppSecret.
Fill in 原始 ID with the 原始 ID.
Add WECHAT_REDIRECT_URI_FOR_AUTHGEAR above in WeChat redirect URIs.
Save the settings.
Update the code
Update application AndroidManifest.xml
<!-- Your application configuration. Omitted here for brevity -->
<application>
<!-- Other activities or entries -->
<!-- It should be added when setting up Authgear SDK -->
<activity android:name="com.oursky.authgear.OauthRedirectActivity"
android:exported="true"
android:launchMode="singleTask">
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<!-- This is the redirectURI, It should be added when setting up Authgear SDK -->
<data android:scheme="com.myapp"
android:host="host"
android:pathPrefix="/path"/>
<!-- Add this for WeChat setup, this should match the WECHAT_REDIRECT_URI_FOR_AUTHGEAR defined above -->
<data android:scheme="com.myapp"
android:host="host"
android:pathPrefix="/open_wechat_app"/>
</intent-filter>
</activity>
<!-- Add this for WeChat SDK setup, replace YOUR_PACKAGE_NAME-->
<activity
android:name=".wxapi.WXEntryActivity"
android:exported="true"
android:label="@string/app_name"
android:launchMode="singleTask"
android:taskAffinity="YOUR_PACKAGE_NAME"
android:theme="@android:style/Theme.Translucent.NoTitleBar"></activity>
</application>
Configure WeChat SDK
private IWXAPI wechatAPI;
private setupWechatSDK() {
wechatAPI = WXAPIFactory.createWXAPI(app, YOUR_WECHAT_APP_ID, true);
wechatAPI.registerApp(YOUR_WECHAT_APP_ID);
}
Setup Authgear delegate
mAuthgear.setDelegate(new AuthgearDelegate() {
@Override
public void sendWechatAuthRequest(String state) {
if (!wechatAPI.isWXAppInstalled()) {
// User have not installed WeChat app, show them the error
return;
}
SendAuth.Req req = new SendAuth.Req();
req.scope = "snsapi_userinfo";
req.state = state;
wechatAPI.sendReq(req);
}
});
Create wxapi directory in the directory named after your package name and create WXEntryActivity
activity. In WXEntryActivity
, pass the received intent and the object that implements IWXAPIEventHandler API to the handleIntent
method of the IWXAPI
API, as shown below:
api.handleIntent(getIntent(), this);
You will be able to receive the authentication code and state in onResp
method, call Authgear wechatAuthCallback
with code
and state
.
mAuthgear.wechatAuthCallback(code, state, new OnWechatAuthCallbackListener() {
@Override
public void onWechatAuthCallback() {
}
@Override
public void onWechatAuthCallbackFailed(Throwable throwable) {
}
});
Provide wechatRedirectURI
when calling authorize
and promoteAnonymousUser
in Authgear SDK.
// Replace "WECHAT_REDIRECT_URI_FOR_AUTHGEAR" with link defined above
AuthenticateOptions options = new AuthenticateOptions(AUTHGEAR_REDIRECT_URI);
options.setWechatRedirectURI(WECHAT_REDIRECT_URI_FOR_AUTHGEAR);
mAuthgear.authenticate(options, new OnAuthenticateListener() {
@Override
public void onAuthenticated(@Nullable UserInfo userInfo) {
}
@Override
public void onAuthenticationFailed(@NonNull Throwable throwable) {
}
});
// For anonymous user support only
// Replace "WECHAT_REDIRECT_URI_FOR_AUTHGEAR" with link defined above
PromoteOptions options = new PromoteOptions(AUTHGEAR_REDIRECT_URI);
options.setWechatRedirectURI(WECHAT_REDIRECT_URI_FOR_AUTHGEAR);
mAuthgear.promoteAnonymousUser(options, new OnPromoteAnonymousUserListener() {
@Override
public void onPromoted(@NonNull UserInfo userInfo) {
}
@Override
public void onPromotionFailed(@NonNull Throwable throwable) {
}
});
// Open setting page
// Replace "WECHAT_REDIRECT_URI_FOR_AUTHGEAR" with link defined above
SettingOptions options = new SettingOptions();
options.setWechatRedirectURI(WECHAT_REDIRECT_URI_FOR_AUTHGEAR);
mAuthgear.open(Page.Settings, options);
Here is the completed example.
Setup Authgear SDK
Follow iOS接入指南 and Android接入指南 to setup WeChat SDK. For the coding part, we will further explain in the below steps.
In iOS, after setting up the WechatOpenSDK, universal link should be enabled in your application. We will need two links for the setup. One is for the WeChat SDK used, another is for the Authgear SDK to trigger delegate function when user click "Login with WeChat" button. Here are the suggestion of the links.
IOS_WECHAT_UNIVERSAL_LINK: https://{YOUR_DOMAIN}/wechat
IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR: https://{YOUR_DOMAIN}/open_wechat_app
In android, you need to sign your app to use WeChat SDK. Obtain your application signature by running command keytool -list -v -keystore YOUR_KEYSTORE_FILE_PATH
with your keystore file. WeChat needs the certificate fingerprint in MD5, remove :
in the fingerprint. It should be string in length 32.
Login WeChat Open platform, open the application detail page, update the development information iOS and Android sections.
In iOS
Fill in "Bundle ID" field with your app bundle id.
Fill in "Universal Links" with "IOS_WECHAT_UNIVERSAL_LINK" above.
In Android
Fill in application signature.
Fill in your package name
For android, we will need to define a custom url for Authgear SDK to trigger delegate function when user click "Login with WeChat" button. Here is the example, you should update it with your own scheme.
ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR: com.myapp://host/open_wechat_app
Login Authgear portal, go to "Single-Sign On" page, then do the following:
Enable "Sign in with WeChat (Mobile/移动应用)"
Fill in "Client ID" with the WeChat "AppID".
Fill in "Client Secret" with the WeChat "AppSecret".
Fill in "原始 ID" with the WeChat "原始 ID".
Add "IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR" and "ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR" above into "WeChat redirect URIs"
Click save.
Update the code
In Android, Update application AndroidManifest.xml
.
<!-- Your application configuration. Omitted here for brevity -->
<application>
<!-- Other activities or entries -->
<!-- It should be added when setting up Authgear SDK -->
<activity android:name="com.authgear.reactnative.OAuthRedirectActivity"
android:exported="true"
android:launchMode="singleTask">
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<!-- This is the redirectURI, It should be added when setting up Authgear SDK -->
<data android:scheme="com.myapp"
android:host="host"
android:pathPrefix="/path"/>
<!-- Add this for WeChat setup, this should match the WECHAT_REDIRECT_URI_FOR_AUTHGEAR defined above -->
<data android:scheme="com.myapp"
android:host="host"
android:pathPrefix="/open_wechat_app"/>
</intent-filter>
</activity>
<!-- Add this for WeChat SDK setup, replace YOUR_PACKAGE_NAME-->
<activity
android:name=".wxapi.WXEntryActivity"
android:exported="true"
android:label="@string/app_name"
android:launchMode="singleTask"
android:taskAffinity="YOUR_PACKAGE_NAME"
android:theme="@android:style/Theme.Translucent.NoTitleBar"></activity>
</application>
In iOS, update your App Delegate
- (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray *))restorationHandler {
[WXApi handleOpenUniversalLink:userActivity delegate:self];
[AGAuthgearReactNative application:application continueUserActivity:userActivity restorationHandler:restorationHandler];
return YES;
}
Provide wechatRedirectURI
when calling Authgear SDK authorize
and promoteAnonymousUser
in js
// REPLACE IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR and ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR
const wechatRedirectURI = Platform.select<string>({
android: 'ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR',
ios: 'IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR',
});
authgear
.authenticate({
redirectURI: "REDIRECT_URI",
wechatRedirectURI: wechatRedirectURI
});
// For anonymous user support only
authgear
.promoteAnonymousUser({
redirectURI: "REDIRECT_URI",
wechatRedirectURI: wechatRedirectURI
});
// Open setting page
authgear
.open(Page.Settings, {
wechatRedirectURI: wechatRedirectURI,
})
Setup Authgear delegate and open WeChat SDK when sendWechatAuthRequest is triggered
authgear.delegate = {
sendWechatAuthRequest: (state) => {
// User click login with WeChat
// Implement native modules to use WeChat SDK to open
// WeChat app for authorization.
// After obtaining authorization code, call Authgear.wechatAuthCallback
// to complete the authorization.
const {WechatAuth} = NativeModules;
WechatAuth.sendWechatAuthRequest(state)
.then((result: {code: string; state: string}) => {
// Native module sending back the code after login with
// WeChat app. Call Authgear.wechatAuthCallback
return authgear.wechatAuthCallback(result.code, result.state);
})
.then(() => {
// Send WeChat callback to authgear successfully
})
.catch((err: Error) => {
// error ocurred
});
}
}
Implement the NativeModules to use WeChat SDK to open WeChat app for authorization. Here is the completed example.
Setup Authgear SDK
Follow iOS接入指南 and Android接入指南 to setup WeChat SDK. For the coding part, we will further explain in the below steps.
In iOS, after setting up the WechatOpenSDK, universal link should be enabled in your application. We will need two links for the setup. One is for the WeChat SDK used, another is for the Authgear SDK to trigger delegate function when user click "Login with WeChat" button. Here are the suggestion of the links.
IOS_WECHAT_UNIVERSAL_LINK: https://{YOUR_DOMAIN}/wechat
IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR: https://{YOUR_DOMAIN}/open_wechat_app
In android, you need to sign your app to use WeChat SDK. Obtain your application signature by running command keytool -list -v -keystore YOUR_KEYSTORE_FILE_PATH
with your keystore file. WeChat needs the certificate fingerprint in MD5, remove :
in the fingerprint. It should be string in length 32.
Login WeChat Open platform, open the application detail page, update the development information iOS and Android sections.
In iOS
Fill in "Bundle ID" field with your app bundle id.
Fill in "Universal Links" with "IOS_WECHAT_UNIVERSAL_LINK" above.
In Android
Fill in application signature.
Fill in your package name
For android, we will need to define a custom url for Authgear SDK to trigger delegate function when user click "Login with WeChat" button. Here is the example, you should update it with your own scheme.
ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR: com.myapp://host/open_wechat_app
Login Authgear portal, go to "Single-Sign On" page, then do the following:
Enable "Sign in with WeChat (Mobile/移动应用)"
Fill in "Client ID" with the WeChat "AppID".
Fill in "Client Secret" with the WeChat "AppSecret".
Fill in "原始 ID" with the WeChat "原始 ID".
Add "IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR" and "ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR" above into "WeChat redirect URIs"
Click save.
Update the code
In Android, Update application AndroidManifest.xml
.
<!-- Your application configuration. Omitted here for brevity -->
<application>
<!-- Other activities or entries -->
<!-- It should be added when setting up Authgear SDK -->
<activity android:name="com.authgear.flutter.OAuthRedirectActivity"
android:exported="true"
android:launchMode="singleTask">
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<!-- This is the redirectURI, It should be added when setting up Authgear SDK -->
<data android:scheme="com.myapp"
android:host="host"
android:pathPrefix="/path"/>
<!-- Add this for WeChat setup, this should match the WECHAT_REDIRECT_URI_FOR_AUTHGEAR defined above -->
<data android:scheme="com.myapp"
android:host="host"
android:pathPrefix="/open_wechat_app"/>
</intent-filter>
</activity>
<!-- Add this for WeChat SDK setup, replace YOUR_PACKAGE_NAME-->
<activity
android:name=".wxapi.WXEntryActivity"
android:exported="true"
android:label="@string/app_name"
android:launchMode="singleTask"
android:taskAffinity="YOUR_PACKAGE_NAME"
android:theme="@android:style/Theme.Translucent.NoTitleBar"></activity>
</application>
Provide wechatRedirectURI
.
// REPLACE IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR and ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR
var wechatRedirectURI = "";
if (Platform.isIOS) {
wechatRedirectURI = 'IOS_WECHAT_REDIRECT_URI_FOR_AUTHGEAR';
} else if (Platform.isAndroid) {
wechatRedirectURI = 'ANDROID_WECHAT_REDIRECT_URI_FOR_AUTHGEAR';
}
await authgear.authenticate(redirectURI: "REDIRECT_URI", wechatRedirectURI: wechatRedirectURI);
// For anonymous user support only
await authgear.promoteAnonymousUser(redirectURI: "REDIRECT_URI", wechatRedirectURI: wechatRedirectURI);
// Open setting page
await authgear.open(SettingsPage.settings, wechatRedirectURI: wechatRedirectURI);
Provide sendWechatAuthRequest
final authgear = Authgear(
sendWechatAuthRequest: sendWechatAuthRequest,
);
Future<void> sendWechatAuthRequest(state: String) async {
// Implement your platform specific code to use WeChat SDK to open WeChat app.
// After success, pass the code back to Authgear.
await authgear.wechatAuthCallback(state: state, code: code);
}
Implement the platform specific code to use WeChat SDK to open WeChat app for authorization. Here is the completed example.
Guides on how to integrate identity providers to Authgear
Create an Azure Active Directory (Azure AD) account here
Setup a tenant by completing Quickstart: Set up a tenant
Register an application by completing Quickstart: Register an application with the Microsoft identity platform
Choose "Supported account type", the following options are supported:
Accounts in this organizational directory only (Contoso AD (dev) only - Single tenant)
Accounts in this organizational directory (Any Azure AD directory - Multitenant)
Accounts in this organizational directory (Any Azure AD directory - Multitenant) and personal Microsoft accounts (e.g. Skype, Xbox)
"Personal Microsoft accounts only" is not supported yet. Remember the account type chosen as this affects the configuration on Authgear portal
Configure "Redirect URI" with https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/azureadv2
Follow this section to add a client secret. Remember to record the secret value when you add the client secret, as it will not be displayed again. This will be needed for configure OAuth client in Authgear.
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with Microsoft
Fill in Client ID with Application (client) ID of your just created Azure AD application.
Fill in Client Secret" with the secret you get after creating a client secret for your Azure AD application.
For Tenant field:
If single tenant (first option) is chosen, fill in the Directory (tenant) ID of your Azure AD application.
If multi tenant (second option) is chosen, fill in the string literal organizations
.
If multi tenant and personal account (third option) is chosen, fill in the string literal common
.
Save the settings.
🎉 Done! You have just added Azure Active Directory (Azure AD) Login to your apps!
Azure Active Directory automatically logs in to the same account without requiring a username and password. To prevent this behaviour, you can use the prompt=login
parameter to force Azure Active Directory to show the login page. See our guide on using the prompt=login parameter in Authgear SDKs to learn more.
Setup your own AD FS server
Create an application in your AD FS Server, obtain "Client ID", "Client Secret" and "Discovery Document Endpoint". Discovery Document Endpoint typically ends with /.well-known/openid-configuration
. Configure your application with redirect uri https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/adfs
.
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with Microsoft AD FS.
Fill in Client ID, Client Secret and Discovery Document Endpoint.
Save the settings.
🎉 Done! You have just added Microsoft AD FS Login to your apps!
Microsoft AD FS supports the prompt=login
parameter. You can include this parameter in your request when you want users to re-authenticate. See our guide on using the prompt=login parameter in Authgear SDKs to learn more.
Sign in Microsoft Azure.
Create a B2C tenant by following this tutorial.
Enable self-service sign-up for the tenant by following this doc
Go back the main page of Microsoft Azure and search for "Azure AD B2C"
Create a app registration for Authgear by following this guide.
Configure "Redirect URI" with https://<YOUR_AUTHGEAR_ENDPOINT>/sso/oauth2/callback/azureadb2c
.
Follow this guide to create a sign-up and sign-in user flow.
After creating the user flow, configure it
Open "Application Claims".
Make sure "Email Addresses" is checked.
If you have finished the above prerequisite, you should have the following information:
The Tenant Name, obtained in Step 2
The Application (Client) ID, obtained in Step 5
The Policy (User flow) Name, obtained in Step 7
Then in Authgear portal, do the following:
In the portal, go to Authentication > Social / Enterprise Login.
Enable Sign in with Microsoft Azure AD B2C.
Fill in Client ID with the Application (Client) ID above.
Fill in Client secret with the client secret you get when you create the app registration.
Fill in Tenant with the Azure AD B2C Tenant Name.
Fill in Policy with the Policy (User Flow) Name. Normally it starts with b2c_
.
Save the changes
🎉 Done! You have just added Azure AD B2C Login to your apps!
Azure AD B2C automatically logs in to the same account without requiring a username and password. To prevent this behaviour, you can use the prompt=login
parameter to force Azure AD B2C to show the login page. See our guide on using the prompt=login parameter in Authgear SDKs to learn more.
Use OIDC prompt parameter to force OAuth providers to show login screen.
The prompt="login"
parameter which is defined in the OIDC spec can prompt Social/Enterprise Login Providers to always show their login screen. As a result, you can use the prompt="login"
parameter to allow users to switch accounts when their previous authentication session on the provider is still stored.
In this post, you'll learn how to use prompt: "login"
in Authgear SDKs to force OIDC providers to always show your users their login screen. You can also use prompt: "login"
to allow users to switch accounts with a Social/Enterprise Login provider on the same device (or browser).
Authgear SDKs have a prompt
parameter that you can set in your application. The value of the prompt parameter will be passed to the Social/Enterprise Login provider. Hence, if you set prompt: "login"
in the SDK, your Social/Enterprise Login provider will receive a prompt="login"
parameter. The following code examples show how to use the prompt parameter in Authgear SDKs.
authgear
.startAuthentication({
redirectURI: "<AUTHGEAR_REDIRECT_URI>",
prompt: PromptOption.Login,
})
authgear
.authenticate({
redirectURI: 'com.reactnativeauth://host/path',
prompt: PromptOption.Login,
})
AuthenticateOptions options = new AuthenticateOptions("<AUTHGEAR_REDIRECT_URI>");
List<PromptOption> promptOptions = Arrays.asList(PromptOption.LOGIN);
options.setPrompt(promptOptions);
mAuthgear.authenticate(options, new OnAuthenticateListener() {
@Override
public void onAuthenticated(@Nullable UserInfo userInfo) {
}
@Override
public void onAuthenticationFailed(@NonNull Throwable throwable) {
Log.d(TAG, throwable.toString());
}
});
authgear?.authenticate(
redirectURI: "<AUTHGEAR_REDIRECT_URI>",
prompt: "login"
)
_authgear.authenticate(
redirectURI: "<AUTHGEAR_REDIRECT_URI>",
prompt: "login",
);