# Installation & Basic Authentication
This page demonstrates how to install the Passport ClearKey Web SDK and verify that authentication with the Key Server works correctly.
# Installation Steps
# Step 1: Add the Script Tag
Add the <script> tag inside the <body> tag at the bottom of the page to load the SDK.
<script src="https://byteark-sdk.cdn.byteark.com/passport-clearkey/web-sdk/v0/passport-web-sdk.js"></script>
1
# Step 2: Verify the SDK is Loaded
After adding the Script Tag, you can check whether the SDK is ready via window.PassportWebSDK.
<script>
if (window.PassportWebSDK) {
console.log('SDK is ready');
} else {
console.error('PassportWebSDK not found — check script tag');
}
</script>
1
2
3
4
5
6
7
2
3
4
5
6
7
# Step 3: Call initAuth
Call initAuth() with a JWT Token and Key Server URL to start a session for video decryption.
<script>
var sdk = window.PassportWebSDK;
sdk.initAuth('YOUR_JWT_TOKEN', 'https://YOUR_KEY_SERVER_URL')
.then(function(result) {
console.log('Authentication successful:', result.message);
})
.catch(function(err) {
console.error('Error:', err.message);
});
</script>
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
Once initAuth() succeeds, the SDK will manage the Session Cookie and schedule automatic session renewal.
# Full Source Code Example
A complete HTML example demonstrating how to load the SDK and authenticate with the Key Server.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>ClearKey SDK — Minimal Setup</title>
</head>
<body>
<h1>Passport ClearKey Web SDK</h1>
<button id="initBtn">Authenticate</button>
<button id="destroyBtn" disabled>Destroy Session</button>
<pre id="log">Waiting…</pre>
<!-- Load SDK -->
<script src="https://byteark-sdk.cdn.byteark.com/passport-clearkey/web-sdk/v0/passport-web-sdk.js"></script>
<script>
var sdk = window.PassportWebSDK;
var logEl = document.getElementById('log');
function log(msg) {
logEl.textContent += '\n' + msg;
}
if (!sdk) {
log('✖ PassportWebSDK not found');
} else {
log('✔ SDK loaded');
}
// ── Authenticate ──
document.getElementById('initBtn').addEventListener('click', function() {
var jwt = 'YOUR_JWT_TOKEN';
var keyServerUrl = 'https://YOUR_KEY_SERVER_URL';
log('Calling initAuth()…');
sdk.initAuth(jwt, keyServerUrl, { logEnabled: true })
.then(function(result) {
log('Success: ' + JSON.stringify(result));
document.getElementById('destroyBtn').disabled = false;
})
.catch(function(err) {
log('✖ Error: ' + err.message);
});
});
// ── Destroy Session ──
document.getElementById('destroyBtn').addEventListener('click', function() {
sdk.destroy();
log('SDK destroyed');
document.getElementById('destroyBtn').disabled = true;
});
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54