# การติดตั้งและยืนยันตัวตนเบื้องต้น
หน้านี้แสดงขั้นตอนการติดตั้ง Passport ClearKey Web SDK และตรวจสอบว่าการยืนยันตัวตนกับ Key Server ทำงานได้อย่างถูกต้อง
# ขั้นตอนการติดตั้ง
# ขั้นตอนที่ 1: เพิ่ม Script Tag
เพิ่มแท็ก <script> ภายในแท็ก <body> ในส่วนท้ายของหน้า เพื่อโหลด SDK
<script src="https://byteark-sdk.cdn.byteark.com/passport-clearkey/web-sdk/v0/passport-web-sdk.js"></script>
1
# ขั้นตอนที่ 2: ตรวจสอบว่า SDK โหลดสำเร็จ
หลังจากเพิ่ม Script Tag แล้ว สามารถตรวจสอบได้ว่า SDK พร้อมใช้งานหรือไม่ ผ่านตัวแปร 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
# ขั้นตอนที่ 3: เรียกใช้งาน initAuth
เรียกฟังก์ชัน initAuth() โดยส่ง JWT Token และ Key Server URL เพื่อเริ่ม Session สำหรับการถอดรหัสวิดีโอ
<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
เมื่อ initAuth() สำเร็จ SDK จะจัดการ Session Cookie และตั้งเวลาต่ออายุ Session อัตโนมัติให้ทั้งหมด
# ตัวอย่างซอร์สโค้ด
ตัวอย่าง HTML ที่สมบูรณ์ แสดงการโหลด SDK และยืนยันตัวตนกับ 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