直播播放器中的自定义错误消息

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 prop 来捕获所有“媒体”错误。可以使用 onSetupError 属性捕获设置错误。 （P.S. 在较新版本的库中，您应该能够使用 onError 来捕获两种错误类型）这是一个有效的 example 如何使用代码 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"
    }

见documentation

Answer 2

不知何故使用其他国家的VPN解决了这个问题。