sunuid-sdk 1.0.51 → 1.0.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +429 -193
- package/dist/sunuid-sdk.esm.js +5 -5
- package/dist/sunuid-sdk.esm.js.map +1 -1
- package/dist/sunuid-sdk.js +5 -5
- package/dist/sunuid-sdk.js.map +1 -1
- package/dist/sunuid-sdk.min.js +1 -1
- package/dist/sunuid-sdk.min.js.map +1 -1
- package/docs/INTEGRATION_GUIDE.md +334 -0
- package/docs/SECURITY_GUIDE.md +369 -0
- package/examples/.htaccess.example +190 -0
- package/examples/README.md +192 -0
- package/examples/auto-code.js +234 -0
- package/examples/auto-integration.html +337 -0
- package/examples/callback-example.html +232 -0
- package/examples/config-example.js +41 -0
- package/examples/demo.html +323 -0
- package/examples/env.example +83 -0
- package/examples/minimal-code.js +147 -0
- package/examples/minimal-integration.html +157 -0
- package/examples/no-loop-example.html +250 -0
- package/examples/partner-name-config.js +123 -0
- package/examples/production-config.js +60 -0
- package/examples/secure-init.php +154 -0
- package/examples/secure-integration-example.js +186 -0
- package/examples/secure-integration.html +410 -0
- package/examples/simple-kyc.html +95 -0
- package/examples/simple-login.html +96 -0
- package/examples/test-partner-name.html +251 -0
- package/examples/test-production.html +200 -0
- package/examples/universal-kyc.html +199 -0
- package/examples/universal-login.html +148 -0
- package/package.json +24 -10
|
@@ -0,0 +1,323 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="fr">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>SunuID SDK - Démonstration</title>
|
|
7
|
+
<link rel="stylesheet" href="css/sunuid-sdk.css">
|
|
8
|
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
|
9
|
+
<style>
|
|
10
|
+
body {
|
|
11
|
+
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
12
|
+
margin: 0;
|
|
13
|
+
padding: 20px;
|
|
14
|
+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
15
|
+
min-height: 100vh;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.demo-container {
|
|
19
|
+
max-width: 1200px;
|
|
20
|
+
margin: 0 auto;
|
|
21
|
+
background: white;
|
|
22
|
+
border-radius: 20px;
|
|
23
|
+
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
|
|
24
|
+
overflow: hidden;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.demo-header {
|
|
28
|
+
background: linear-gradient(135deg, #4caf50, #66bb6a);
|
|
29
|
+
color: white;
|
|
30
|
+
padding: 40px;
|
|
31
|
+
text-align: center;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.demo-header h1 {
|
|
35
|
+
margin: 0 0 10px 0;
|
|
36
|
+
font-size: 2.5rem;
|
|
37
|
+
font-weight: 700;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.demo-header p {
|
|
41
|
+
margin: 0;
|
|
42
|
+
font-size: 1.1rem;
|
|
43
|
+
opacity: 0.9;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.demo-content {
|
|
47
|
+
padding: 40px;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.demo-section {
|
|
51
|
+
margin-bottom: 40px;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.demo-section h2 {
|
|
55
|
+
color: #2d3748;
|
|
56
|
+
margin-bottom: 20px;
|
|
57
|
+
font-size: 1.8rem;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.demo-grid {
|
|
61
|
+
display: grid;
|
|
62
|
+
grid-template-columns: 1fr 1fr;
|
|
63
|
+
gap: 30px;
|
|
64
|
+
margin-bottom: 30px;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.demo-card {
|
|
68
|
+
background: #f7fafc;
|
|
69
|
+
border-radius: 12px;
|
|
70
|
+
padding: 24px;
|
|
71
|
+
border: 1px solid #e2e8f0;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
.demo-card h3 {
|
|
75
|
+
color: #4caf50;
|
|
76
|
+
margin-bottom: 16px;
|
|
77
|
+
font-size: 1.3rem;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.theme-toggle {
|
|
81
|
+
display: flex;
|
|
82
|
+
gap: 10px;
|
|
83
|
+
margin-bottom: 20px;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.theme-btn {
|
|
87
|
+
padding: 8px 16px;
|
|
88
|
+
border: 2px solid #4caf50;
|
|
89
|
+
background: white;
|
|
90
|
+
color: #4caf50;
|
|
91
|
+
border-radius: 8px;
|
|
92
|
+
cursor: pointer;
|
|
93
|
+
transition: all 0.3s ease;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.theme-btn.active {
|
|
97
|
+
background: #4caf50;
|
|
98
|
+
color: white;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.theme-btn:hover {
|
|
102
|
+
transform: translateY(-2px);
|
|
103
|
+
box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.demo-info {
|
|
107
|
+
background: #e8f5e8;
|
|
108
|
+
border: 1px solid #4caf50;
|
|
109
|
+
border-radius: 8px;
|
|
110
|
+
padding: 16px;
|
|
111
|
+
margin-top: 20px;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
.demo-info h4 {
|
|
115
|
+
color: #2d3748;
|
|
116
|
+
margin: 0 0 10px 0;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
.demo-info ul {
|
|
120
|
+
margin: 0;
|
|
121
|
+
padding-left: 20px;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.demo-info li {
|
|
125
|
+
margin-bottom: 5px;
|
|
126
|
+
color: #4a5568;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.code-example {
|
|
130
|
+
background: #2d3748;
|
|
131
|
+
color: #e2e8f0;
|
|
132
|
+
padding: 20px;
|
|
133
|
+
border-radius: 8px;
|
|
134
|
+
font-family: 'Monaco', 'Menlo', monospace;
|
|
135
|
+
font-size: 0.9rem;
|
|
136
|
+
overflow-x: auto;
|
|
137
|
+
margin-top: 20px;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
@media (max-width: 768px) {
|
|
141
|
+
.demo-grid {
|
|
142
|
+
grid-template-columns: 1fr;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.demo-header h1 {
|
|
146
|
+
font-size: 2rem;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
.demo-content {
|
|
150
|
+
padding: 20px;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
</style>
|
|
154
|
+
</head>
|
|
155
|
+
<body>
|
|
156
|
+
<div class="demo-container">
|
|
157
|
+
<div class="demo-header">
|
|
158
|
+
<h1>🔐 SunuID SDK</h1>
|
|
159
|
+
<p>Démonstration d'intégration des QR codes d'authentification et KYC</p>
|
|
160
|
+
</div>
|
|
161
|
+
|
|
162
|
+
<div class="demo-content">
|
|
163
|
+
<!-- Section Authentification -->
|
|
164
|
+
<div class="demo-section">
|
|
165
|
+
<h2>🔐 Authentification</h2>
|
|
166
|
+
<div class="demo-grid">
|
|
167
|
+
<div class="demo-card">
|
|
168
|
+
<h3>QR Code d'Authentification</h3>
|
|
169
|
+
<div class="theme-toggle">
|
|
170
|
+
<button class="theme-btn active" onclick="switchTheme('auth', 'light')">Thème Clair</button>
|
|
171
|
+
<button class="theme-btn" onclick="switchTheme('auth', 'dark')">Thème Sombre</button>
|
|
172
|
+
</div>
|
|
173
|
+
<div id="auth-qr-container"></div>
|
|
174
|
+
<div class="demo-info">
|
|
175
|
+
<h4>Fonctionnalités :</h4>
|
|
176
|
+
<ul>
|
|
177
|
+
<li>Connexion sécurisée avec SunuID</li>
|
|
178
|
+
<li>Actualisation automatique</li>
|
|
179
|
+
<li>Compte à rebours</li>
|
|
180
|
+
<li>Thèmes personnalisables</li>
|
|
181
|
+
</ul>
|
|
182
|
+
</div>
|
|
183
|
+
</div>
|
|
184
|
+
|
|
185
|
+
<div class="demo-card">
|
|
186
|
+
<h3>Code d'Intégration</h3>
|
|
187
|
+
<div class="code-example">
|
|
188
|
+
// Initialisation
|
|
189
|
+
const sunuid = initSunuID({
|
|
190
|
+
apiUrl: 'https://api.sunuid.fayma.sn',
|
|
191
|
+
clientId: 'VOTRE_CLIENT_ID',
|
|
192
|
+
secretId: 'VOTRE_SECRET_ID',
|
|
193
|
+
theme: 'light'
|
|
194
|
+
});
|
|
195
|
+
|
|
196
|
+
// Générer QR code
|
|
197
|
+
sunuid.generateAuthQR('auth-qr-container', {
|
|
198
|
+
theme: 'light',
|
|
199
|
+
redirectUrl: 'https://votre-site.com/dashboard'
|
|
200
|
+
});
|
|
201
|
+
</div>
|
|
202
|
+
</div>
|
|
203
|
+
</div>
|
|
204
|
+
</div>
|
|
205
|
+
|
|
206
|
+
<!-- Section KYC -->
|
|
207
|
+
<div class="demo-section">
|
|
208
|
+
<h2>📋 Vérification KYC</h2>
|
|
209
|
+
<div class="demo-grid">
|
|
210
|
+
<div class="demo-card">
|
|
211
|
+
<h3>QR Code KYC</h3>
|
|
212
|
+
<div class="theme-toggle">
|
|
213
|
+
<button class="theme-btn" onclick="switchTheme('kyc', 'light')">Thème Clair</button>
|
|
214
|
+
<button class="theme-btn active" onclick="switchTheme('kyc', 'dark')">Thème Sombre</button>
|
|
215
|
+
</div>
|
|
216
|
+
<div id="kyc-qr-container"></div>
|
|
217
|
+
<div class="demo-info">
|
|
218
|
+
<h4>Fonctionnalités :</h4>
|
|
219
|
+
<ul>
|
|
220
|
+
<li>Vérification d'identité</li>
|
|
221
|
+
<li>Collecte de documents</li>
|
|
222
|
+
<li>Validation automatique</li>
|
|
223
|
+
<li>Suivi en temps réel</li>
|
|
224
|
+
</ul>
|
|
225
|
+
</div>
|
|
226
|
+
</div>
|
|
227
|
+
|
|
228
|
+
<div class="demo-card">
|
|
229
|
+
<h3>Code d'Intégration</h3>
|
|
230
|
+
<div class="code-example">
|
|
231
|
+
// Générer QR code KYC
|
|
232
|
+
sunuid.generateKYCQR('kyc-qr-container', {
|
|
233
|
+
theme: 'dark',
|
|
234
|
+
kycType: 'full',
|
|
235
|
+
requiredFields: ['identity', 'address', 'phone'],
|
|
236
|
+
redirectUrl: 'https://votre-site.com/kyc-complete'
|
|
237
|
+
});
|
|
238
|
+
</div>
|
|
239
|
+
</div>
|
|
240
|
+
</div>
|
|
241
|
+
</div>
|
|
242
|
+
|
|
243
|
+
<!-- Section Configuration -->
|
|
244
|
+
<div class="demo-section">
|
|
245
|
+
<h2>⚙️ Configuration</h2>
|
|
246
|
+
<div class="demo-card">
|
|
247
|
+
<h3>Options Avancées</h3>
|
|
248
|
+
<div class="code-example">
|
|
249
|
+
const config = {
|
|
250
|
+
apiUrl: 'https://api.sunuid.fayma.sn',
|
|
251
|
+
clientId: 'VOTRE_CLIENT_ID',
|
|
252
|
+
secretId: 'VOTRE_SECRET_ID',
|
|
253
|
+
theme: 'light', // 'light' ou 'dark'
|
|
254
|
+
language: 'fr', // 'fr', 'en', 'ar'
|
|
255
|
+
autoRefresh: true, // Actualisation automatique
|
|
256
|
+
refreshInterval: 30000, // 30 secondes
|
|
257
|
+
onSuccess: function(data) {
|
|
258
|
+
console.log('Succès:', data);
|
|
259
|
+
window.location.href = '/dashboard';
|
|
260
|
+
},
|
|
261
|
+
onError: function(error) {
|
|
262
|
+
console.error('Erreur:', error);
|
|
263
|
+
},
|
|
264
|
+
onExpired: function() {
|
|
265
|
+
console.log('QR expiré');
|
|
266
|
+
}
|
|
267
|
+
};
|
|
268
|
+
</div>
|
|
269
|
+
</div>
|
|
270
|
+
</div>
|
|
271
|
+
</div>
|
|
272
|
+
</div>
|
|
273
|
+
|
|
274
|
+
<!-- Scripts -->
|
|
275
|
+
<script src="js/sunuid-sdk.js"></script>
|
|
276
|
+
<script>
|
|
277
|
+
// Configuration de démonstration
|
|
278
|
+
const sunuid = initSunuID({
|
|
279
|
+
apiUrl: 'https://api.sunuid.fayma.sn',
|
|
280
|
+
clientId: 'test_client_123',
|
|
281
|
+
secretId: 'test_secret_456',
|
|
282
|
+
theme: 'light',
|
|
283
|
+
autoRefresh: true,
|
|
284
|
+
refreshInterval: 30000,
|
|
285
|
+
onSuccess: function(data) {
|
|
286
|
+
console.log('Authentification réussie:', data);
|
|
287
|
+
alert('Authentification réussie !');
|
|
288
|
+
},
|
|
289
|
+
onError: function(error) {
|
|
290
|
+
console.error('Erreur:', error);
|
|
291
|
+
alert('Erreur: ' + error.message);
|
|
292
|
+
},
|
|
293
|
+
onExpired: function() {
|
|
294
|
+
console.log('QR code expiré');
|
|
295
|
+
alert('QR code expiré, actualisation...');
|
|
296
|
+
}
|
|
297
|
+
});
|
|
298
|
+
|
|
299
|
+
// Générer les QR codes initiaux
|
|
300
|
+
sunuid.generateAuthQR('auth-qr-container', { theme: 'light' });
|
|
301
|
+
sunuid.generateKYCQR('kyc-qr-container', { theme: 'dark' });
|
|
302
|
+
|
|
303
|
+
// Fonction pour changer de thème
|
|
304
|
+
function switchTheme(type, theme) {
|
|
305
|
+
// Mettre à jour les boutons
|
|
306
|
+
const buttons = document.querySelectorAll(`[onclick*="${type}"]`);
|
|
307
|
+
buttons.forEach(btn => {
|
|
308
|
+
btn.classList.remove('active');
|
|
309
|
+
if (btn.textContent.includes(theme === 'light' ? 'Clair' : 'Sombre')) {
|
|
310
|
+
btn.classList.add('active');
|
|
311
|
+
}
|
|
312
|
+
});
|
|
313
|
+
|
|
314
|
+
// Régénérer le QR code avec le nouveau thème
|
|
315
|
+
if (type === 'auth') {
|
|
316
|
+
sunuid.generateAuthQR('auth-qr-container', { theme: theme });
|
|
317
|
+
} else {
|
|
318
|
+
sunuid.generateKYCQR('kyc-qr-container', { theme: theme });
|
|
319
|
+
}
|
|
320
|
+
}
|
|
321
|
+
</script>
|
|
322
|
+
</body>
|
|
323
|
+
</html>
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
# ========================================
|
|
2
|
+
# CONFIGURATION SÉCURISÉE SUNUID SDK
|
|
3
|
+
# ========================================
|
|
4
|
+
# Copiez ce fichier vers .env et configurez vos credentials
|
|
5
|
+
|
|
6
|
+
# Credentials SunuID (OBLIGATOIRE)
|
|
7
|
+
SUNUID_CLIENT_ID=1754166754_221A57B46843D755
|
|
8
|
+
SUNUID_SECRET_ID=56d40fe70507228b27f2640ae65894177c2fedbf246e2b30978fde1fc43953c5
|
|
9
|
+
|
|
10
|
+
# URL de l'API SunuID
|
|
11
|
+
SUNUID_API_URL=https://api.sunuid.fayma.sn
|
|
12
|
+
|
|
13
|
+
# Configuration des tokens sécurisés
|
|
14
|
+
SUNUID_TOKEN_EXPIRY=3600
|
|
15
|
+
SUNUID_MAX_REQUESTS=100
|
|
16
|
+
|
|
17
|
+
# Configuration de sécurité
|
|
18
|
+
SUNUID_ENABLE_LOGS=true
|
|
19
|
+
SUNUID_LOG_LEVEL=info
|
|
20
|
+
SUNUID_RATE_LIMIT=10
|
|
21
|
+
SUNUID_RATE_LIMIT_WINDOW=3600
|
|
22
|
+
|
|
23
|
+
# Configuration CORS (optionnel)
|
|
24
|
+
SUNUID_ALLOWED_ORIGINS=*
|
|
25
|
+
SUNUID_ALLOWED_METHODS=POST,GET,OPTIONS
|
|
26
|
+
|
|
27
|
+
# Configuration de l'environnement
|
|
28
|
+
ENVIRONMENT=production
|
|
29
|
+
DEBUG=false
|
|
30
|
+
|
|
31
|
+
# ========================================
|
|
32
|
+
# INSTRUCTIONS D'UTILISATION
|
|
33
|
+
# ========================================
|
|
34
|
+
|
|
35
|
+
# 1. Copiez ce fichier vers .env
|
|
36
|
+
# cp env.example .env
|
|
37
|
+
|
|
38
|
+
# 2. Remplacez les valeurs par vos vrais credentials
|
|
39
|
+
# SUNUID_CLIENT_ID=votre_client_id
|
|
40
|
+
# SUNUID_SECRET_ID=votre_secret_id
|
|
41
|
+
|
|
42
|
+
# 3. Ajustez les paramètres selon vos besoins
|
|
43
|
+
# - SUNUID_TOKEN_EXPIRY: Durée de vie des tokens (en secondes)
|
|
44
|
+
# - SUNUID_MAX_REQUESTS: Nombre max de requêtes par token
|
|
45
|
+
# - SUNUID_RATE_LIMIT: Limite de requêtes par IP par heure
|
|
46
|
+
|
|
47
|
+
# 4. Protégez le fichier .env
|
|
48
|
+
# - Ajoutez .env à votre .gitignore
|
|
49
|
+
# - Configurez les permissions appropriées (600)
|
|
50
|
+
# - Utilisez des variables d'environnement sur votre serveur
|
|
51
|
+
|
|
52
|
+
# ========================================
|
|
53
|
+
# SÉCURITÉ
|
|
54
|
+
# ========================================
|
|
55
|
+
|
|
56
|
+
# ⚠️ IMPORTANT : Ne jamais commiter ce fichier avec de vrais credentials
|
|
57
|
+
# ⚠️ IMPORTANT : Utilisez des credentials différents pour chaque environnement
|
|
58
|
+
# ⚠️ IMPORTANT : Changez régulièrement vos credentials
|
|
59
|
+
# ⚠️ IMPORTANT : Surveillez les logs de sécurité
|
|
60
|
+
|
|
61
|
+
# ========================================
|
|
62
|
+
# EXEMPLES PAR ENVIRONNEMENT
|
|
63
|
+
# ========================================
|
|
64
|
+
|
|
65
|
+
# Développement
|
|
66
|
+
# ENVIRONMENT=development
|
|
67
|
+
# DEBUG=true
|
|
68
|
+
# SUNUID_TOKEN_EXPIRY=1800
|
|
69
|
+
# SUNUID_MAX_REQUESTS=50
|
|
70
|
+
|
|
71
|
+
# Staging
|
|
72
|
+
# ENVIRONMENT=staging
|
|
73
|
+
# DEBUG=false
|
|
74
|
+
# SUNUID_TOKEN_EXPIRY=3600
|
|
75
|
+
# SUNUID_MAX_REQUESTS=100
|
|
76
|
+
|
|
77
|
+
# Production
|
|
78
|
+
# ENVIRONMENT=production
|
|
79
|
+
# DEBUG=false
|
|
80
|
+
# SUNUID_TOKEN_EXPIRY=3600
|
|
81
|
+
# SUNUID_MAX_REQUESTS=100
|
|
82
|
+
# SUNUID_RATE_LIMIT=5
|
|
83
|
+
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
// ========================================
|
|
2
|
+
// INTÉGRATION MINIMALE SUNUID SDK
|
|
3
|
+
// ========================================
|
|
4
|
+
|
|
5
|
+
// 1. INCLUSION DES SCRIPTS (dans le HTML)
|
|
6
|
+
/*
|
|
7
|
+
<script src="https://cdn.socket.io/4.7.4/socket.io.min.js"></script>
|
|
8
|
+
<script src="https://unpkg.com/sunuid-sdk@1.0.34/dist/sunuid-sdk.min.js"></script>
|
|
9
|
+
*/
|
|
10
|
+
|
|
11
|
+
// 2. CONFIGURATION MINIMALE
|
|
12
|
+
const config = {
|
|
13
|
+
clientId: '1754166754_221A57B46843D755',
|
|
14
|
+
secretId: '56d40fe70507228b27f2640ae65894177c2fedbf246e2b30978fde1fc43953c5',
|
|
15
|
+
type: 2, // 1=KYC, 2=AUTH, 3=SIGNATURE
|
|
16
|
+
autoRefresh: false // Désactivé pour éviter les appels répétitifs
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
// 3. CODE D'INTÉGRATION MINIMAL
|
|
20
|
+
async function initSunuID() {
|
|
21
|
+
try {
|
|
22
|
+
// Créer l'instance SDK
|
|
23
|
+
const sunuid = new SunuID(config);
|
|
24
|
+
|
|
25
|
+
// Initialiser
|
|
26
|
+
await sunuid.init();
|
|
27
|
+
|
|
28
|
+
// Générer le QR code
|
|
29
|
+
const result = await sunuid.generateQR('qr-container');
|
|
30
|
+
|
|
31
|
+
console.log('✅ QR Code généré:', result.qrCodeUrl);
|
|
32
|
+
return result;
|
|
33
|
+
|
|
34
|
+
} catch (error) {
|
|
35
|
+
console.error('❌ Erreur:', error.message);
|
|
36
|
+
throw error;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
// 4. UTILISATION SIMPLE
|
|
41
|
+
// initSunuID().then(result => console.log('Succès:', result));
|
|
42
|
+
|
|
43
|
+
// ========================================
|
|
44
|
+
// EXEMPLE AVEC GESTION D'ÉVÉNEMENTS
|
|
45
|
+
// ========================================
|
|
46
|
+
|
|
47
|
+
async function initSunuIDWithEvents() {
|
|
48
|
+
const sunuid = new SunuID({
|
|
49
|
+
...config,
|
|
50
|
+
onSuccess: (data) => console.log('🎉 Succès:', data),
|
|
51
|
+
onError: (error) => console.error('💥 Erreur:', error),
|
|
52
|
+
onStatusUpdate: (status) => console.log('📊 Statut:', status)
|
|
53
|
+
});
|
|
54
|
+
|
|
55
|
+
await sunuid.init();
|
|
56
|
+
return await sunuid.generateQR('qr-container');
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
// ========================================
|
|
60
|
+
// EXEMPLE AVEC DIFFÉRENTS TYPES
|
|
61
|
+
// ========================================
|
|
62
|
+
|
|
63
|
+
// Authentification (défaut)
|
|
64
|
+
const authConfig = { ...config, type: 2 };
|
|
65
|
+
|
|
66
|
+
// KYC (Vérification d'identité)
|
|
67
|
+
const kycConfig = { ...config, type: 1 };
|
|
68
|
+
|
|
69
|
+
// Signature électronique
|
|
70
|
+
const signatureConfig = { ...config, type: 3 };
|
|
71
|
+
|
|
72
|
+
// ========================================
|
|
73
|
+
// EXEMPLE AVEC RAFRAÎCHISSEMENT
|
|
74
|
+
// ========================================
|
|
75
|
+
|
|
76
|
+
async function initSunuIDWithRefresh() {
|
|
77
|
+
const sunuid = new SunuID({
|
|
78
|
+
...config,
|
|
79
|
+
autoRefresh: true, // Activer le rafraîchissement
|
|
80
|
+
refreshInterval: 30000 // 30 secondes
|
|
81
|
+
});
|
|
82
|
+
|
|
83
|
+
await sunuid.init();
|
|
84
|
+
const result = await sunuid.generateQR('qr-container');
|
|
85
|
+
|
|
86
|
+
// Arrêter le rafraîchissement après 2 minutes
|
|
87
|
+
setTimeout(() => {
|
|
88
|
+
sunuid.stopAutoRefresh();
|
|
89
|
+
console.log('🔄 Rafraîchissement arrêté');
|
|
90
|
+
}, 120000);
|
|
91
|
+
|
|
92
|
+
return result;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
// ========================================
|
|
96
|
+
// EXEMPLE COMPLET AVEC HTML
|
|
97
|
+
// ========================================
|
|
98
|
+
|
|
99
|
+
/*
|
|
100
|
+
HTML minimal requis :
|
|
101
|
+
|
|
102
|
+
<div id="qr-container">
|
|
103
|
+
<!-- Le QR code sera affiché ici -->
|
|
104
|
+
</div>
|
|
105
|
+
|
|
106
|
+
<button onclick="initSunuID()">Générer QR Code</button>
|
|
107
|
+
*/
|
|
108
|
+
|
|
109
|
+
// ========================================
|
|
110
|
+
// EXEMPLE AVEC GESTION D'ÉTAT
|
|
111
|
+
// ========================================
|
|
112
|
+
|
|
113
|
+
let sunuidInstance = null;
|
|
114
|
+
|
|
115
|
+
async function initSDK() {
|
|
116
|
+
if (sunuidInstance) {
|
|
117
|
+
console.log('SDK déjà initialisé');
|
|
118
|
+
return sunuidInstance;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
sunuidInstance = new SunuID(config);
|
|
122
|
+
await sunuidInstance.init();
|
|
123
|
+
return sunuidInstance;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
async function generateQRCode(containerId = 'qr-container') {
|
|
127
|
+
if (!sunuidInstance) {
|
|
128
|
+
await initSDK();
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
return await sunuidInstance.generateQR(containerId);
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
// ========================================
|
|
135
|
+
// EXPORT POUR UTILISATION MODULE
|
|
136
|
+
// ========================================
|
|
137
|
+
|
|
138
|
+
if (typeof module !== 'undefined' && module.exports) {
|
|
139
|
+
module.exports = {
|
|
140
|
+
initSunuID,
|
|
141
|
+
initSunuIDWithEvents,
|
|
142
|
+
initSunuIDWithRefresh,
|
|
143
|
+
initSDK,
|
|
144
|
+
generateQRCode,
|
|
145
|
+
config
|
|
146
|
+
};
|
|
147
|
+
}
|
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="fr">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Intégration Minimale SunuID SDK</title>
|
|
7
|
+
|
|
8
|
+
<!-- Socket.IO (requis) -->
|
|
9
|
+
<script src="https://cdn.socket.io/4.7.4/socket.io.min.js"></script>
|
|
10
|
+
|
|
11
|
+
<!-- SunuID SDK -->
|
|
12
|
+
<script src="https://unpkg.com/sunuid-sdk@1.0.34/dist/sunuid-sdk.min.js"></script>
|
|
13
|
+
|
|
14
|
+
<style>
|
|
15
|
+
body {
|
|
16
|
+
font-family: Arial, sans-serif;
|
|
17
|
+
max-width: 600px;
|
|
18
|
+
margin: 50px auto;
|
|
19
|
+
padding: 20px;
|
|
20
|
+
text-align: center;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.qr-container {
|
|
24
|
+
margin: 30px 0;
|
|
25
|
+
padding: 20px;
|
|
26
|
+
border: 2px dashed #ddd;
|
|
27
|
+
border-radius: 10px;
|
|
28
|
+
min-height: 300px;
|
|
29
|
+
display: flex;
|
|
30
|
+
align-items: center;
|
|
31
|
+
justify-content: center;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.qr-container img {
|
|
35
|
+
max-width: 250px;
|
|
36
|
+
border: 1px solid #ddd;
|
|
37
|
+
border-radius: 5px;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
button {
|
|
41
|
+
background: #007bff;
|
|
42
|
+
color: white;
|
|
43
|
+
border: none;
|
|
44
|
+
padding: 12px 24px;
|
|
45
|
+
border-radius: 5px;
|
|
46
|
+
cursor: pointer;
|
|
47
|
+
font-size: 16px;
|
|
48
|
+
margin: 10px;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
button:hover {
|
|
52
|
+
background: #0056b3;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
button:disabled {
|
|
56
|
+
background: #6c757d;
|
|
57
|
+
cursor: not-allowed;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.status {
|
|
61
|
+
margin: 20px 0;
|
|
62
|
+
padding: 10px;
|
|
63
|
+
border-radius: 5px;
|
|
64
|
+
font-weight: bold;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.status.success {
|
|
68
|
+
background: #d4edda;
|
|
69
|
+
color: #155724;
|
|
70
|
+
border: 1px solid #c3e6cb;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.status.error {
|
|
74
|
+
background: #f8d7da;
|
|
75
|
+
color: #721c24;
|
|
76
|
+
border: 1px solid #f5c6cb;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.status.info {
|
|
80
|
+
background: #d1ecf1;
|
|
81
|
+
color: #0c5460;
|
|
82
|
+
border: 1px solid #bee5eb;
|
|
83
|
+
}
|
|
84
|
+
</style>
|
|
85
|
+
</head>
|
|
86
|
+
<body>
|
|
87
|
+
<h1>🔐 Intégration Minimale SunuID</h1>
|
|
88
|
+
<p>Exemple d'intégration simple du SDK SunuID</p>
|
|
89
|
+
|
|
90
|
+
<div id="status" class="status info">
|
|
91
|
+
Prêt à initialiser le SDK
|
|
92
|
+
</div>
|
|
93
|
+
|
|
94
|
+
<button onclick="initSDK()" id="initBtn">🚀 Initialiser SDK</button>
|
|
95
|
+
<button onclick="generateQR()" id="qrBtn" disabled>📱 Générer QR Code</button>
|
|
96
|
+
|
|
97
|
+
<div id="qr-container" class="qr-container">
|
|
98
|
+
<p>Cliquez sur "Initialiser SDK" pour commencer</p>
|
|
99
|
+
</div>
|
|
100
|
+
|
|
101
|
+
<script>
|
|
102
|
+
let sunuid = null;
|
|
103
|
+
|
|
104
|
+
// Configuration minimale
|
|
105
|
+
const config = {
|
|
106
|
+
clientId: '1754166754_221A57B46843D755',
|
|
107
|
+
secretId: '56d40fe70507228b27f2640ae65894177c2fedbf246e2b30978fde1fc43953c5',
|
|
108
|
+
type: 2, // 2 = Authentification
|
|
109
|
+
autoRefresh: false // Désactivé pour éviter les appels répétitifs
|
|
110
|
+
};
|
|
111
|
+
|
|
112
|
+
function updateStatus(message, type = 'info') {
|
|
113
|
+
const statusDiv = document.getElementById('status');
|
|
114
|
+
statusDiv.textContent = message;
|
|
115
|
+
statusDiv.className = `status ${type}`;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
async function initSDK() {
|
|
119
|
+
try {
|
|
120
|
+
updateStatus('🔄 Initialisation du SDK...', 'info');
|
|
121
|
+
|
|
122
|
+
// Créer l'instance SDK
|
|
123
|
+
sunuid = new SunuID(config);
|
|
124
|
+
|
|
125
|
+
// Initialiser
|
|
126
|
+
await sunuid.init();
|
|
127
|
+
|
|
128
|
+
updateStatus('✅ SDK initialisé avec succès !', 'success');
|
|
129
|
+
|
|
130
|
+
// Activer le bouton de génération QR
|
|
131
|
+
document.getElementById('qrBtn').disabled = false;
|
|
132
|
+
document.getElementById('initBtn').disabled = true;
|
|
133
|
+
|
|
134
|
+
} catch (error) {
|
|
135
|
+
updateStatus(`❌ Erreur d'initialisation: ${error.message}`, 'error');
|
|
136
|
+
console.error('Erreur:', error);
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
async function generateQR() {
|
|
141
|
+
try {
|
|
142
|
+
updateStatus('🔄 Génération du QR code...', 'info');
|
|
143
|
+
|
|
144
|
+
// Générer le QR code
|
|
145
|
+
const result = await sunuid.generateQR('qr-container');
|
|
146
|
+
|
|
147
|
+
updateStatus('✅ QR code généré avec succès !', 'success');
|
|
148
|
+
console.log('QR Code généré:', result);
|
|
149
|
+
|
|
150
|
+
} catch (error) {
|
|
151
|
+
updateStatus(`❌ Erreur de génération: ${error.message}`, 'error');
|
|
152
|
+
console.error('Erreur:', error);
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
</script>
|
|
156
|
+
</body>
|
|
157
|
+
</html>
|