直播播放器中的自定義錯誤消息

Question

我有一個如下所示的反應代碼，它呈現播放器。 在下面的代碼中，如果條件為真，則調用 ReactJWPlayer 的代碼。

const player = ()=> {
    if(condition) {
        return (
            <ReactJWPlayer
                onPlaylist={[props.playlist]}
                onPlay={() => onPlay()}
                autoPlay={props.autoplay}
                isMuted={false}
            />
        )
    }
}

問題陳述：

我想要實現的是，如果直播突然結束，我想顯示一條custom error message 。 現在，我看到：

This video file cannot be played 

(Error Code: 232011)

我想知道我需要在上面的代碼中進行哪些更改，以便我可以用以下錯誤消息替換上面的錯誤消息：

Video will be available soon 。

Answer 1

您可以使用onError道具來捕獲所有“媒體”錯誤。 可以使用onSetupError捕獲設置錯誤。 （PS 在較新版本的庫中，您應該能夠使用onError來捕獲兩種錯誤類型）這是一個如何處理代碼為102404錯誤的工作示例：

import ReactJWPlayer from "react-jw-player";

export default function App() {
  
  const setupErrorHandler= (error) => {
    console.log("Setup error");
    console.log(error);
    if (error && error.code === 102404) {
      window.alert(error.message);
    }
    //here you write similar if condition to check if error has error 
      code 232404
    if(error && error.code === 232404){
        //do something..
    }
  };

 const mediaErrorHandler= (error) => {
    console.log("Media error");
    console.log(error);
    //handle error
  };

  return (
    <div className="App">
      <div
        className="jw-video-container"
        data-mediaid="TAITbudl"
        style={{ height: "100%", width: "100%" }}
      >
        <ReactJWPlayer
          playerId="TAITbudl"
          playerScript="https://content.jwplatform.com/libraries/j9BLvpMc.js"
          playlist="https://cdn.jwplayer.com/v2/playlists/vXggtmeu"
         
          onError={(event) => mediaErrorHandler(event)}
          onSetupError={(event) => setupErrorHandler(event)}
        />
      </div>
    </div>
  );
}

注意：所有jwplayer錯誤都具有以下形式：

 {
      "code": 104153,
      "message": "Sorry, the video player failed to load.",
      "sourceError": { Error object | null },
      "type": "setupError"
    }

查看文檔

Answer 2

以某種方式使用其他國家的 VPN 解決了​​這個問題。