Stop HLS - React Native

Stopping HLS refers to the process of halting the ongoing HLS stream transmission, indicating that the stream is no longer accessible to viewers.

note

This page uses the following asynchronous methods. Refer to their API reference for the errors each Promise may reject with, and handle these rejections appropriately based on your use case.

• stopHLS()

Stopping HLS

The stopHLS() method, accessible from the useRoom hook, is used to stop the interactive livestream of a room.

Example

import { useRoom } from "@videosdk.live/react-native-sdk";
import { TouchableOpacity, Text } from "react-native";

const RoomView = () => {
  const { stopHLS } = useRoom();

  const handleStopHls = async () => {
    // Stop Hls
    try {
      await stopHLS();
    } catch (err) {
      console.error("stopHLS failed:", err);
    }
  };

  return (
    <>
      <TouchableOpacity
        onPress={() => {
          handleStopHls();
        }}
      >
        <Text>Stop Hls</Text>
      </TouchableOpacity>
    </>
  );
};

Event associated with HLS

• onHlsStateChanged - The onHlsStateChanged() event is triggered whenever the state of room HLS changes.

• You will get the HLS_STOPPING and HLS_STOPPED states on calling stopHLS().

import { Constants, useRoom } from "@videosdk.live/react-native-sdk";

function onHlsStateChanged(data) {
  const { state } = data;

  if (state === Constants.hlsEvents.HLS_STOPPING) {
    console.log("Room Hls is stopping");
  } else if (state === Constants.hlsEvents.HLS_STOPPED) {
    console.log("Room Hls is stopped");
  }
}

const { roomId } = useRoom({
  onHlsStateChanged,
});

API Reference

The API references for all the methods utilized in this guide are provided below.

• stopHLS
• onHlsStateChanged