webid-striver-plugin v0.1.9

webid-striver-plugin

WebID Striver Plugin is a React Native plugin that enables seamless integration with the WebID identification system. It wraps WebID’s native Android and iOS SDKs, allowing React Native applications to securely perform user identification through WebID’s trusted platform.

Features

• Easy integration of WebID’s identification system into your React Native app.

• Supports both Android and iOS platforms.

• Utilizes WebID’s secure and reliable identification process.

Pre-Requisites

• Node Version: 19+ or latest

Installation

To install the package, run the following command:

npm install webid-striver-plugin

Android Basic Configuration

Ensure the following settings for your Android project:

• minSdkVersion: 24
• kotlinVersion: 1.9.24

Android Permissions(optional)

Add the required permissions manually in your AndroidManifest.xml file if they are not auto-linked:

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission
  android:name="android.permission.FOREGROUND_SERVICE"
  tools:node="remove" />
<uses-permission
  android:name="android.permission.FOREGROUND_SERVICE_MICROPHONE"
  tools:node="remove" />
<uses-permission
  android:name="android.permission.POST_NOTIFICATIONS"
  tools:node="remove" />

iOS Setup

The iOS Mobile SDK is a precompiled binary for Xcode in the form of an XCFramework. It can be added via Swift Package Manager (SPM). Follow these steps:

1. Open the Project Navigator (⌘-1).
2. In Xcode, go to File > Add Packages.
3. Use this URL in the search field (top-right corner):

   https://api.webid-solutions.de/releases/ios/spm/SwiftPackages/webid-video-ident-product-plugin-spm.git

4. Select Exact Version and choose the latest version from the changelog.
5. Ensure the POD is selected, and target the webid-striver-plugin as the library.
6. Clean the project (CMD + K) and build the project in Xcode.

Manual iOS Setup with Native Module (if errors occur)

If you encounter iOS errors after adding the SPM, follow the manual setup using native module code. Download and add the following files to your iOS root folder from (ios native module):

1. WebIdVideoViewController.swift
2. WebIdVideoStriver-Bridging-Header.h (header file to create a bridge with React Native)
3. WebIdVideoStriver.m
4. WebIdVideoStriver.m

Now, go to your React Native code file (e.g., App.tsx) and import the native module:

import { NativeModules } from 'react-native';
const { WebIdVideoStriver } = NativeModules;

Use the WebIdVideoStriver.configure method instead of:

import { configure } from 'react-native-webid-striver-plugin';

For iOS, after adding the Swift Package Module (SPM) as described above, follow these additional steps:

1. If you encounter certificate-related errors, simply drag and drop your WebID iOS certificate into your Xcode project. The certificate should be named:

test.webid-solutions.de-valid_until_2025.02.22

2. If needed, update the certificate name in ios/WebIdVideoStriver.swift.

3. Build the iOS project and run it with your actual WebID keys and Action ID.

Usage

To use the webid-striver-plugin, import and configure it as follows:

import { configure } from 'webid-striver-plugin';

// ...

const response = await configure({
  environment: 'Environment URL', // Environment URL
  username: 'your-user-name',               // Your WebID customer number
  apiKey: 'your-api-key',                   // Your WebID API key
  actionId: 'your-action-id',               // Action ID for the identification process
  shaKeys: ['sha256/your-sha-key'],         // List of SHA keys for pinning certificates
});

Arguments

Example

Here’s a complete example that sets up the WebID Mobile App SDK and starts the identification process:

import { StyleSheet, View, Alert, Button } from 'react-native';
import { configure } from 'webid-striver-plugin';

export default function App() {
  const handleConfigure = async () => {
    try {
      const response = await configure({
        environment: 'environment URL',
        username: 'your-user-name',
        apiKey: 'your-api-key',
        actionId: 'action-id',
        shaKeys: ['sha256/your-sha-key'],
      });
      Alert.alert(String(response)); // Convert response to a string
    } catch (error) {
      console.log('Error: ', error);
      if (error instanceof Error) {
        Alert.alert('Error', error.message);
      } else {
        Alert.alert('Error', 'An unknown error occurred');
      }

    }
  };

  return (
    <View style={styles.container}>
      <Button title="Configure WebID" onPress={handleConfigure} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
});

WebID Platform

This package provides a wrapper for the WebID identification system but is not an official WebID release. For official documentation, support, and inquiries, please visit WebID Solutions

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT License

Made with create-react-native-library

Key Points in the README:

1. Pre-requisites: Clear mention of the Node.js version required.
2. Installation and Setup: Both Android and iOS setups are explained, with necessary steps for repository inclusion, permissions, and iOS XCFramework configuration.
3. Usage Instructions: Detailed example of how to configure and use the WebID SDK in a React Native app.
4. Contributing and License: Included sections for contributing guidelines and the MIT License.

This README file covers all necessary steps for installation, setup, and usage, making it user-friendly for developers integrating the WebID system. Let me know if you need further adjustments!