React Native (v2)

​

Before you begin

• Follow Create a session on your server: your backend creates an embed session with your API key and returns its clientSecret.
• Pick the origin your app presents itself as, such as https://app.example.com. Add it to your organization’s embed domains. The web view loads nothing from it; sajn only checks it.

​

Install the package

npm install @sajn/[email protected] react-native-webview

​

Show the signing page

import { SigningEmbed } from "@sajn/embed-react-native";

export function SignScreen({ documentId, partyId }: { documentId: string; partyId: string }) {
  return (
    <SigningEmbed
      origin="https://app.example.com"
      fetchClientSecret={async () => {
        const response = await fetch("https://api.example.com/sajn/embed-session", {
          method: "POST",
          headers: { "content-type": "application/json" },
          body: JSON.stringify({ documentId, partyId }),
        });
        if (!response.ok) throw new Error("Signing isn't available right now.");
        return (await response.json()).clientSecret;
      }}
      appearance={{ colorScheme: "system" }}
      onSigned={() => {
        // Confirm the signature on your server with the document.party.signed webhook.
      }}
      onError={({ code, message }) => console.warn(code, message)}
    />
  );
}

​

Props

​

eIDs in a native app

• Swedish BankID on the same phone: the frame hands the BankID link to openUrl, and the BankID app opens. Set the session’s bankIdReturnUrl to your app’s URL scheme, such as myapp://signed, so BankID brings the party back to your app.
• MitID, FTN, Norwegian BankID and other eIDs that refuse frames: the frame hands the eID page to openUrl. The party identifies in the browser, which ends on a page in your session’s colors and language, and returns to your app. The frame picks up the signature on its next status check, and onSigned fires.

​

Use a web view without React Native

• iOS (WKWebView): load your page with loadHTMLString(_:baseURL:), with your embed origin as baseURL. Forward openUrl calls through a WKScriptMessageHandler and open them with UIApplication.shared.open. In webView(_:decidePolicyFor:decisionHandler:), allow subframe navigations, and send top-level navigations away from your page to UIApplication.shared.open.
• Android (WebView): load your page with loadDataWithBaseURL, with your embed origin as the base URL. Forward openUrl calls through a @JavascriptInterface and open them with an Intent.ACTION_VIEW.