Hosted JavaScript SDK · v1.0.0
Sign in with HereKey. One script.
Include the hosted SDK and call login(). It handles the desktop QR, mobile authorization button, return checks and logout monitoring. Masked sessions are the default: your browser receives a session token instead of the customer’s member ID.
Try the JavaScript SDK
Loading the HereKey authentication SDK…
1. Include the script and invoke login
<button id="login">Sign in with HereKey</button>
<script src="https://herekey.app/sdk/herekey-auth.js"></script>
<script>
const auth = HereKeyAuth.create({
endpoint: "/herekey-login.php", // Your same-origin backend bridge.
onLogin(session) {
// UI callback: masked session reference, never a raw member ID.
// session.sessionToken is the masked reference for this login.
document.querySelector("#login").textContent = "Signed in";
// Navigate to your own protected page after server verification.
},
onLogout() {
// Session was revoked, expired, disappeared, or locally signed out.
// sessionToken is now null; reset your signed-in UI.
},
onError(error) {
// Status could not be verified. An outage does not mean logout.
console.warn(error.message);
}
});
document.querySelector("#login").onclick = () => {
auth.login().catch(error => console.warn(error.message));
};
auth.watchSession(); // Restore/check the website session; resume on app return.
</script>You can also use await HereKeyAuth.login({ endpoint: '/herekey-login.php' }) for a single login. The instance API above is recommended when using callbacks and session monitoring. Authorization opens from an explicit user tap. Both desktop and mobile use the same request with auto_close=true.
2. Add the small backend bridge
For PHP sites, upload HereKeyAuth.php from the starter kit and add this endpoint. The library implements request creation, proof-bound code exchange, secure browser sessions, CSRF validation, status checks and masked responses. You do not need to build those API handlers yourself. PHP 7.4+ with cURL and HTTPS is required.
<?php
// Download both files from the PHP starter kit and put them on YOUR server.
require_once __DIR__.'/HereKeyAuth.php';
(new HereKeyAuth('your-website'))->handle();
// Save this file as /herekey-login.php. Use HTTPS.Download PHP authentication bridgeUse a unique application identifier in the constructor. It identifies your integration; it is not a secret. The script must call your own same-origin endpoint. HereKey’s demonstration endpoint is only for this demo. Other backend stacks can implement the same bridge protocol; the PHP library is the ready-to-use backend in this release.
A masked token that tracks the active session
{
"status": "authenticated",
"loggedIn": true,
"sessionToken": "hks_<opaque random reference>",
"expiresAt": "<session expiry>",
"identityMode": "masked_session"
}The bridge requests member_code_only=true with an S256 challenge. The one-time mc_… code is exchanged on the server. The verified member record is discarded by the bridge, and only an hks_… reference is returned to the browser. Responses containing a raw member identity instead of a masked code are rejected. Your app must support the member-code authorization flow.
The one-time member code is not a login-status token. The masked SDK reference maps privately to the active HereKey relay session. getSession() and watchSession() check that session. When HereKey Access revokes it, it expires, or the relay confirms it is missing, loggedIn becomes false and sessionToken becomes null.
This reference belongs to a particular browser, application and login session; it is not a permanent customer identifier. An API timeout or server error triggers onError and does not impersonate a logout. Protected routes should refuse access when verification is unavailable. Logging out of this website clears its local reference; it does not log the customer out of every HereKey app.
Connect your application’s callbacks
Browser callbacks update your UI. Use verified server callbacks to establish or clear application login state. Both receive only the masked session reference; no physical member ID is exposed.
<?php
require_once __DIR__.'/HereKeyAuth.php';
$auth = new HereKeyAuth('your-website', null,
function (array $session) {
// Server callback: approval and active relay session are verified.
// Bind your application session to this masked reference.
$_SESSION['signed_in_herekey'] = $session['sessionToken'];
},
function (array $session) {
// Remove local login state after confirmed revocation or local logout.
unset($_SESSION['signed_in_herekey']);
}
);
$auth->handle();Check protected server routes too
<?php
// Also verify from protected backend routes, not just a browser callback.
require_once __DIR__.'/HereKeyAuth.php';
session_start(); // Use your framework's secure session configuration.
$auth = new HereKeyAuth('your-website');
try {
$session = $auth->getSession($_SESSION);
if (!$session['loggedIn']) { http_response_code(401); exit; }
// Authorized for this active website session. Apply your own permissions.
// Compare a supplied masked reference using getSession($_SESSION, $token).
} catch (Throwable $error) {
http_response_code(503); exit; // Unable to verify; do not grant new access.
}A HereKey identity confirmation does not grant your application’s roles or account permissions. Map the verified login to your own authorization rules. Session status is cached for at most five seconds by the PHP bridge; the browser watcher checks every 30 seconds by default and immediately when the page becomes active.
JavaScript methods
| Method | Behavior |
|---|---|
| HereKeyAuth.create(options) | Create a client with endpoint, optional clientId, onLogin, onLogout and onError. |
| auth.login() | Show QR or mobile authorization and resolve with a verified masked session. Repeated calls share one pending request. |
| auth.getSession() | Check the current session. Resolves with loggedIn and sessionToken, or rejects when verification is unavailable. |
| auth.watchSession() | Start automatic status checks; returns a function to stop watching. Login enables watching by default. |
| auth.logout() | Clear this website’s session reference and invoke onLogout. |
| auth.destroy() | Cancel pending UI and stop timers and event listeners. |
Keep credentials, proof verifiers and one-time codes on your server. Do not store masked session references in URLs, public logs or analytics. The hosted authorization page is opened at top level; embed the SDK controls, rather than placing that page inside an iframe.
Advanced relay API examples