Web
這一頁還沒有中文版,以下顯示英文原文。
Show live video from a pi-webrtc device in a web page.
1. Install
npm install @mazupo/client2. Create the page
This is a complete page. Open it, and the video appears when the device answers.
<!DOCTYPE html>
<html lang="en">
<body>
<video id="videoElement" autoplay playsinline controls></video>
<script type="module">
import { PiCamera } from '@mazupo/client';
const videoRef = document.getElementById('videoElement');
const camera = new PiCamera({
uid: 'your-custom-uid',
mqttHost: 'your.mqtt.cloud',
mqttPath: '/mqtt',
mqttPort: 8084,
mqttUsername: 'hakunamatata',
mqttPassword: 'Wonderful',
stunUrls: ['stun:stun1.l.google.com:19302'],
});
camera.onStream = (stream) => {
videoRef.srcObject = stream ?? null;
};
camera.connect();
</script>
</body>
</html>uidmust match the--uidof the device.- The MQTT settings are for the broker that the device uses.
mqttPortis the broker's WebSocket port, not the8883port of the device.

