.file-list li padding: 10px; border-bottom: 1px solid #e2e8f0; font-size: 14px;
// Get POST data $input = json_decode(file_get_contents('php://input'), true);
echo json_encode([ 'export_date' => date('Y-m-d H:i:s'), 'total_fingerprints' => count($fingerprints), 'fingerprints' => $fingerprints ], JSON_PRETTY_PRINT); ?> * margin: 0; padding: 0; box-sizing: border-box;
// Save to backend const saveResponse = await fetch('save_fingerprint.php', method: 'POST', headers: 'Content-Type': 'application/json' , body: JSON.stringify(fingerprintData) ); fingerprint sdk sample with php javascript download
// Write data foreach ($fingerprints as $fp) fputcsv($output, [ $fp['visitorId'] ?? '', $fp['timestamp'] ?? '', $fp['ip_address'] ?? '', $fp['userAgent'] ?? '', $fp['language'] ?? '', $fp['platform'] ?? '' ]);
// Read all fingerprint data $fingerprints = []; foreach ($files as $file) $content = file_get_contents($file); $data = json_decode($content, true); if ($data) $fingerprints[] = $data;
.btn.secondary background: #48bb78; color: white; '', $fp['userAgent']
.card background: white; border-radius: 10px; padding: 25px; margin-bottom: 20px; box-shadow: 0 10px 40px rgba(0,0,0,0.1);
// Handle listing files (for UI) if (isset($_GET['action']) && $_GET['action'] === 'list') header('Content-Type: application/json');
This example uses the library (open-source, browser fingerprinting) and stores/downloads the data via PHP. Project Structure fingerprint-sample/ ├── index.html (Frontend UI) ├── fingerprint.js (Frontend logic) ├── style.css (Styling) ├── save_fingerprint.php (Save fingerprint to file) ├── download.php (Download stored fingerprints) └── fingerprints/ (Folder where data is stored - create this) 1. Frontend - HTML (index.html) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Fingerprint SDK Sample - Download Feature</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <h1>🔐 Browser Fingerprint SDK</h1> <div class="card"> <button id="captureBtn" class="btn primary">📸 Capture Fingerprint</button> <div id="result" class="result hidden"></div> </div> '' ]); // Read all fingerprint data $fingerprints
// Event Listeners document.getElementById('captureBtn').addEventListener('click', captureFingerprint); document.getElementById('downloadBtn').addEventListener('click', downloadAsJSON); document.getElementById('downloadCsvBtn').addEventListener('click', downloadAsCSV);
.container max-width: 900px; margin: 0 auto;
// Capture fingerprint async function captureFingerprint() const resultDiv = document.getElementById('result'); resultDiv.innerHTML = '<div class="spinner"></div> Capturing fingerprint...'; resultDiv.classList.remove('hidden');
<div class="card"> <h3>📜 Saved Fingerprints</h3> <div id="savedList" class="saved-list"> <p class="loading">Loading saved fingerprints...</p> </div> </div> </div>