Accept MitID, NemID, Swedish BankID, Norwegian BankID and more logins in your Expo (React-Native) app with @criipto/verify-expo.
@criipto/verify-expo
supports app switching for Swedish BankID and Danish MitID.
Switchback from the Danish MitID mobile application will only work if you are using a universal link / app link as your redirect_uri.
Enable switchback on android by adding the following to your app.json
:
"plugins": [
["@criipto/verify-expo", {
"androidAppLinks": [
"https://..."
]
}]
]
Danish MitID on Android will not work with Expo Go due to the use of createTask: false
. You must use a build to test, for instance with npx expo run:android
Using npm
npm install @criipto/verify-expo
Setup the Criipto Verify SDK by wrapping your application in CriiptoVerifyProvider
:
// src/App.jsx
import { StyleSheet, Text, View, Button } from 'react-native';
import {CriiptoVerifyProvider, useCriiptoVerify} from '@criipto/verify-expo';
import LoginButton from './LoginButton.jsx';
export default function App() {
return (
<CriiptoVerifyProvider
domain="{YOUR_CRIIPTO_DOMAIN}"
clientID="{YOUR_CRIIPTO_APPLICATION_CLIENT_ID}"
>
<View>
<LoginButton />
</View>
</CriiptoVerifyProvider>
);
}
// src/LoginButton.jsx
export default function LoginButton() {
const {login, claims, error} = useCriiptoVerify();
const handlePress = async (acrValues) => {
// The generated redirectUri must be registered as an allowed URL on your application via the Criipto Dashboard.
// Use a https:// universal/app link if you wish to support appswitch with Danish MitID
const redirectUri = Linking.createURL('/auth/criipto');
const result = await login(acrValues, redirectUri);
};
return (
<>
<Button onPress={() => handlePress('urn:grn:authn:dk:mitid:substantial')} title="Login with Danish MitID" />
<Button onPress={() => handlePress('urn:grn:authn:se:bankid:same-device')} title="Login with Swedish BankID" />
<Button onPress={() => handlePress('urn:grn:authn:fi:bank-id')} title="Login with Finnish BankID" />
<Button onPress={() => handlePress('urn:grn:authn:no:bankid:substantial')} title="Login with Norwegian BankID" />
{error ? (
<Text>An error occurred: {error.toString()}</Text>
) : null}
{claims ? (
<Text>{JSON.stringify(claims, null, 2)}</Text>
) : null}
</>
)
}
#in root
npm run build && npm run pack
#in example
npm install ../criipto-verify-expo-2.0.0.tgz
npm start
Learn more about Criipto and sign up for your free developer account at criipto.com.