無法在jwplayer中添加錯誤消息的自定義消息

Question

這是我的代碼。我想在JWplayer中顯示自定義錯誤消息。目前我正在顯示圖像。如何在JWplayer中爲不同情況實現自定義錯誤消息。我想爲不同的參數顯示錯誤信息。

var videoNode = document.getElementById("videoUrlPath").value; 
    var player = jwplayer('play'); 
    var playerCall = true; 
    var seeking = false; 
    var currentPosition = 0; 
    var jw_selector = "#play"; 
    player.setup({ 
     file: videoNode, 
     width: "100%", 
     aspectratio: "16:9", 
     autostart: true, 
     /*advertising: { 
      client: 'vast', 
      schedule: { 
       adbreak1: { 
        offset: "pre", 
        tag: '/static/assets/vast.xml', 
        'skipoffset': '5' 
         } 
        } 
        }, 
     "sharing": { 
      "sites": ['facebook', 'twitter', 'email'], 
      link: '' 
     },*/ 
     skin: { 
      name: 'myskin', 
      url: 'assets/theme/js/jwplayer-7.8.6/skins/tfcskin.css' 
     }, 
    }); 
    player.play(); 
    player.onSetupError(function (error) { 
     player.setup({ 
      file: "http://content.jwplatform.com/videos/7RtXk3vl-52qL9xLP.mp4", 
      width: "100%", 
      aspectratio: "16:9", 
      image: "assets/theme/images/error-video.jpg" 
     }); 
     player.play(); 
    }); 
    player.onTime(function (callback) { 
     currentPosition = callback.position; 
     if (this.getPosition() === this.getDuration() && playerCall) { 
      playerCall = false; 
      document.getElementById("viewcountincrease").click(); 
     } 
    }) 
    player.onPlay(function (event) { 
     playerCall = true; 
    }) 
    player.onSeek(function() { 
     if (!seeking) { 
      seeking = true; 
      var _currentPosition = currentPosition; 
      /* WITH A SMALL DELAY SCROLL BACK */ 
      window.setTimeout(function() { 
       var elem = document.querySelector(jw_selector); 
       jwplayer(elem).seek(_currentPosition); 
      }, 100); 
     } else seeking = false; 
    }); 

Answer 1

如果您要顯示自定義文本錯誤消息，則可以在播放器周圍使用換行div。 https://support.jwplayer.com/customer/portal/articles/1403682-common-error-messages

這是一個codepen例如： http://codepen.io/fdambrosio/pen/vmbPEK

HTML：

<div id="wrapvideo"> 
    <div id='player'></div> 
</div> 

CSS：

使用onerror和onSetupError事件，返回錯誤信息，您可以在這個頁面發現錯誤消息列表

#wrapvideo { 
    width: 544px; 
    height: 306px; 
    display: inline-block; 
    color: white; 
    background-color: black; 
} 
#wrapvideo p { 
    text-align: center; 
} 

JS：

var playerInstance = jwplayer("player"); 
playerInstance.setup({ 
    file:'videoNode', 
    width: 544, 
    height: 306, 
}); 

playerInstance.on('error', function(evt){ 
    var element = document.getElementById("wrapvideo"); 
    if (evt.message === "Error loading player: No playable sources found") 
     { element.innerHTML = "<p>Your message</p>"; } 
    else { element.innerHTML = "<p>Another message</p>"; } 
}); 

playerInstance.on('setupError', function(evt){ 
    var element = document.getElementById("wrapvideo"); 
    if (evt.message === "No suitable players found and fallback disabled") 
     { element.innerHTML = "<p>Your message on setup error</p>"; } 
    else { element.innerHTML = "<p>Another message on setup error</p>"; } 
}); 

可以使用與圖像或視頻的每個不同的錯誤信息做同樣的事情