UNPKG

rauth-client

Version:

A lightweight, framework-agnostic JavaScript/TypeScript library for adding reverse authentication via WhatsApp on the client side.

45 lines 1.76 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Rauth Client Vanilla JS Demo</title> <script src="../dist/rauth-client.min.js"></script> <style> body { font-family: Arial, sans-serif; margin: 2rem; } .container { max-width: 400px; margin: auto; } input, button { width: 100%; padding: 0.5rem; margin: 0.5rem 0; } .response { background: #f9f9f9; padding: 1rem; margin-top: 1rem; border-radius: 5px; } .error { color: red; } </style> </head> <body> <div class="container"> <h2>Rauth Client Demo (Vanilla JS)</h2> <label for="phone">Phone Number:</label> <input type="text" id="phone" placeholder="Enter phone number" /> <button id="submit">Start Session</button> <div class="response" id="serverResponse"></div> <div class="error" id="error"></div> </div> <script> document.getElementById('submit').onclick = async function() { document.getElementById('error').textContent = ''; document.getElementById('serverResponse').textContent = ''; const phone = document.getElementById('phone').value.trim(); if (!phone) { document.getElementById('error').textContent = 'Please enter a phone number.'; return; } // Get device info (but do not print in UI) // Call rauth.init try { const res = await rauth.init({ appId: '4ee3575a-7176-495f-bc49-b84de37c1fde', phone }); document.getElementById('serverResponse').textContent = JSON.stringify(res, null, 2); } catch (e) { document.getElementById('error').textContent = e.message; } }; </script> </body> </html>