You can run custom validation before the stream launches — for example, checking a password, verifying a token, or gating access behind a form submission.
Setup
Add data-callback to the launch button with the name of your validation function:
<div class="yom-player-placeholder"
data-yom-stream-id="1"
data-game-id="my-game"
style="width: 100%; aspect-ratio: 16/9;">
</div>
<input type="text" class="yom-name-input" data-yom-stream-id="1" placeholder="Your name">
<input type="password" id="password" placeholder="Enter password">
<button class="yom-launch-button"
data-yom-stream-id="1"
data-callback="validatePassword">
Start Game
</button>
Define the Callback
Your function receives two parameters: onSuccess and onFailure. Call one of them based on your validation result.
function validatePassword(onSuccess, onFailure) {
const password = document.getElementById('password').value;
if (password === 'correct-password') {
onSuccess(); // Stream launches
} else {
onFailure(); // Launch is cancelled, button resets
}
}
The callback is invoked when the player clicks the launch button, before the iframe is created. If the function throws an error, the launch is cancelled and the error is logged.
Use Cases
- Password-gated access — Restrict streams to users with a code
- Form validation — Require fields to be filled before launch
- External auth — Call your own API to verify the user, then call
onSuccess()in the response handler - Age verification — Prompt for age confirmation before allowing play