Imports

Toutes ces méthodes exposent un constructeur avec la même interface SealdSDK constructeur.

En règle générale, importer le SDK et les plugins directement devrait fonctionner dans la majorité des situations.

front-end

import SealdSDK from '@seald-io/sdk'
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password'
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr'

const seald = SealdSDK({ appId, apiURL, plugins: [SealdSDKPluginSSKSPassword(keyStorageURL), SealdSDKPluginSSKS2MR(keyStorageURL)] })

Vous pouvez cependant vouloir plus de contrôle sur quelle version du SDK est utilisée, sur les polyfills inclus, etc. Ce guide vous explique toutes les options possibles et leurs différences.

WARNING

Quelle que soit la plateforme ou la manière de l'importer, il est fortement déconseillé d'utiliser le Hot-Reload, Hot-Restart, ou toute fonctionnalité similaire, lors du développement avec le SDK Seald, en particulier lors de l'utilisation d'une base de donnée persistante.

Ces techniques lancent une autre instance du code, sans proprement terminer la précédente, ce qui peut entrainer des problèmes de corruption de la base locale.

Navigateur

Il y a 3 manières d'utiliser le Seald-SDK dans votre navigateur, selon vos besoins et l'architecture de votre application web.

Bibliothèque polyfillée

champ 'browser'

import SealdSDK from '@seald-io/sdk' // si votre bundler supporte le champ "browser" du package.json (supporté par Webpack 5)

const seald = SealdSDK({ appId, apiURL })

entry-point personnalisé

import SealdSDK from '@seald-io/sdk/browser' // si votre bundler supporte les entry-points personnalisés (supportés par Webpack 5)

const seald = SealdSDK({ appId, apiURL })

import explicite

import SealdSDK from '@seald-io/sdk/browser/seald-sdk.polyfilled.js' // import explicite

const seald = SealdSDK({ appId, apiURL })

De la même manière, vous pouvez importer les fichiers suivants pour les plugins :

champ 'browser'

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password' // si votre bundler supporte le champ "browser" du package.json (supporté par Webpack 5)

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr' // si votre bundler supporte le champ "browser" du package.json (supporté par Webpack 5)

entry-point personnalisé

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/browser' // si votre bundler supporte les entry-points personnalisés (supportés par Webpack 5)

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/browser' // si votre bundler supporte les entry-points personnalisés (supportés par Webpack 5)

import explicite

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/browser/seald-sdk-plugin-ssks-password.polyfilled.js' // import explicite

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/browser/seald-sdk-plugin-ssks-2mr.polyfilled.js' // import explicite

Cette version est déjà empaquetée, transpilée et minifiée pour l'utilisation dans un navigateur web. Elle inclut toutes les bibliothèques, dépendances et polyfills nécessaires à son fonctionnement.

Utilisez cette méthode si vous utilisez un bundler comme webpack, mais que vous ne voulez pas configurer ce bundler pour inclure les polyfills nécessaires.

Bibliothèque

entry-point personnalisé

import SealdSDK from '@seald-io/sdk/browser-library' // si votre bundler supporte les entry-points personnalisés (supportés par Webpack 5)

const seald = SealdSDK({ appId, apiURL })

import explicite

import SealdSDK from '@seald-io/sdk/browser/seald-sdk.js' // import explicite

const seald = SealdSDK({ appId, apiURL })

Ceci importe @seald-io/sdk/browser/seald-sdk.js, qui est la version pour le navigateur.

De la même manière, vous pouvez importer les fichiers suivants pour les plugins :

entry-point personnalisé

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/library' // si votre bundler supporte les entry-points personnalisés (supportés par Webpack 5)

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/library' // si votre bundler supporte les entry-points personnalisés (supportés par Webpack 5)

import explicite

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/lib/main.js' // import explicite

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/lib/main.js' // import explicite

Utilisez cette méthode si vous utilisez un bundler comme webpack. Pour cela, referez-vous à la section Empaquetage personnalisé et transpilation.

Cette méthode est recommandée, puisqu'elle permet de diminuer la duplication des dépendances et polyfills, et donc minimiser la taille finale de votre application.

Bundle

Copiez le fichier @seald-io/sdk/browser/seald-sdk.browser.js dans votre projet et importez-le via une balise <script>.

De la même manière, vous pouvez copier les fichiers suivants pour les plugins :

• @seald-io/sdk-plugin-ssks-password/browser/seald-sdk-plugin-ssks-password.browser.js
• @seald-io/sdk-plugin-ssks-2mr/browser/seald-sdk-plugin-ssks-2mr.browser.js

Par exemple, pour importer le SDK et le plugin SSKS-Password :

front-end

<html>
<head>
...
<script src="/libraries/seald-sdk.browser.js"></script>
<script src="/libraries/seald-sdk-plugin-ssks-password.browser.js"></script>
<script>
var seald = window.SealdSDK({ appId, apiURL, plugins: [ window.SealdSDKPluginSSKSPassword(keyStorageURL) ] })
</script>
...
</head>
</html>

Cette version est déjà empaquetée, transpilée et minifiée pour l'utilisation dans un navigateur web. Elle inclut toutes les bibliothèques, dépendances et polyfills nécessaires à son fonctionnement.

Elle expose le constructeur Seald SDK dans la variable globale window.SealdSDK.

Les plugins sont exposés dans les variables globales :

• window.SealdSDKPluginSSKSPassword
• window.SealdSDKPluginSSKS2MR

Node.js / Electron

import SealdSDK from '@seald-io/sdk'

const seald = SealdSDK({ appId, apiURL })

Cela importe la version empaquetée pour les projets Node.js.

Elle peut être utilisée pour un serveur NodeJS, une application de bureau en Electron, des tests unitaires, etc.

React-Native

Installation

Le Seald SDK pour react-native a des "peer dependencies" qui doivent être installées séparément :

• @react-native-async-storage/async-storage (pour les versions 0.11.X et antérieures, il s'agissait du paquet @react-native-community/async-storage)
• @seald-io/react-native-scrypt (pour les versions 0.23.X et antérieures, il s'agissait du paquet react-native-scrypt)
• react-native-quick-crypto
• @craftzdog/react-native-buffer
• react-native-quick-base64

Vous pouvez les installer avec la commande:

npm i -S @react-native-async-storage/async-storage @seald-io/react-native-scrypt react-native-quick-crypto @craftzdog/react-native-buffer react-native-quick-base64

L'usage de react-native-quick-crypto et de notre SDK impose de définir un polyfill de Buffer spécifique en global. Le plus tôt possible dans votre application, il faut rajouter les lignes suivantes :

import { Buffer } from '@craftzdog/react-native-buffer'
global.Buffer = Buffer

Bundle

La librairie exposée par défaut est une version empaquetée, transpilée et minifiée. Elle est utilisable telle quelle.

champ 'react-native'

import SealdSDK from '@seald-io/sdk' // si votre bundler supporte le champ "react-native" du package.json (supporté par Metro)

const seald = SealdSDK({ appId, apiURL })

entry-point personnalisé

import SealdSDK from '@seald-io/sdk/react-native' // si votre bundler supporte les entry-points personnalisés (non supporté par Metro)

const seald = SealdSDK({ appId, apiURL })

import explicite

import SealdSDK from '@seald-io/sdk/react-native/seald-sdk-react-native.bundle.js' // import explicite

const seald = SealdSDK({ appId, apiURL })

De la même manière, vous pouvez importer les fichiers suivants pour les plugins :

champ 'react-native'

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password' // si votre bundler supporte le champ "react-native" du package.json (supporté par Metro)

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr' // si votre bundler supporte le champ "react-native" du package.json (supporté par Metro)

entry-point personnalisé

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/react-native' // si votre bundler supporte les entry-points personnalisés (non supporté par Metro)

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/react-native' // si votre bundler supporte les entry-points personnalisés (non supporté par Metro)

import explicite

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/react-native/seald-sdk-plugin-ssks-password.bundle.js' // import explicite

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/react-native/seald-sdk-plugin-ssks-2mr.bundle.js' // import explicite

Bibliothèque

Si votre application est elle-même transpilée, vous pouvez importer la librairie source. Cela vous permettra alors d'optimiser la taille de votre application.

entry-point personnalisé

import SealdSDK from '@seald-io/sdk/react-native-library' // si votre bundler supporte les entry-points personnalisés (non supporté par Metro)

const seald = SealdSDK({ appId, apiURL })

import explicite

import SealdSDK from '@seald-io/sdk/react-native/react-native/seald-sdk-react-native.js' // import explicite

const seald = SealdSDK({ appId, apiURL })

Cette bibliothèque devra être transpilée pour être utilisée. Pour cela, referez-vous à la section Empaquetage personnalisé et transpilation.

De la même manière, vous pouvez importer les fichiers suivants pour les plugins :

entry-point personnalisé

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/library' // si votre bundler supporte les entry-points personnalisés (non supporté par Metro)

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/library' // si votre bundler supporte les entry-points personnalisés (non supporté par Metro)

import explicite

// plugin-ssks-password
import SealdSDKPluginSSKSPassword from '@seald-io/sdk-plugin-ssks-password/lib/main.js' // import explicite

// plugin-ssks-2mr
import SealdSDKPluginSSKS2MR from '@seald-io/sdk-plugin-ssks-2mr/lib/main.js' // import explicite

Empaquetage personnalisé et transpilation

Pour transpiler le SDK, vous aurez besoin d'activer les polyfills des modules internes de NodeJS.

Voici un example de configuration pour le bundler Webpack 5 :

module.exports = {
  // ... ,
  node: {
    global: true
  },
  resolve: {
    fallback: {
      assert: require.resolve('assert/'),
      fs: false,
      path: require.resolve('path-browserify'),
      events: require.resolve('events/'),
      constants: require.resolve('constants-browserify'),
      os: require.resolve('os-browserify/browser'),
      util: require.resolve('util/'),
      stream: require.resolve('readable-stream'),
      crypto: false
    }
  },
  plugins: [
    new webpack.ProvidePlugin({
      process: 'process/browser',
      Buffer: ['buffer', 'Buffer'],
      setImmediate: ['timers-browserify', 'setImmediate'],
      clearImmediate: ['timers-browserify', 'clearImmediate']
    })
  ]
  // ...
}

Vous pourrez avoir besoin d'installer en devDependencies les paquets assert path-browserify events constants-browserify os-browserify util stream-browserify process buffer timers-browserify.

Pour plus de détails, voir la documentation de webpack.

React-Native

Certaines dépendances du SDK ont des implémentations spécifiques pour React-Native déclarées comme alias dans le champ "react-native" de leur package.json. Ce champ est automatiquement utilisé par metro.

Si vous utilisez un bundler intermédiaire avant d'utiliser metro (comme webpack), vous devrez le spécifier. Vous devrez également considérer comme externes les dépendances natives de React-Native. Dans webpack, il faut ajouter les options suivantes :

module.exports = {
  externals: [
    '@craftzdog/react-native-buffer',
    'react-native-quick-crypto',
    'react-native-quick-base64',
    'buffer',
    'crypto',
    'react-native',
    '@seald-io/react-native-scrypt',
    '@react-native-async-storage/async-storage'
  ],
  resolve: {
    aliasFields: ['react-native', 'browser', 'main'],
    fallback: {
      assert: require.resolve('assert/'),
      buffer: '@craftzdog/react-native-buffer',
      fs: false,
      path: require.resolve('path-browserify'),
      events: require.resolve('events/'),
      constants: require.resolve('constants-browserify'),
      os: require.resolve('os-browserify/browser'),
      util: require.resolve('util/'),
      url: require.resolve('url/'),
      stream: require.resolve('stream-browserify')
    }
  }
}