與HTML5視頻播放器一起使用的Dropbox的mp4，不再重復

Question

我在Squarespace網站上工作，並且他們不允許視頻上傳，所以我正在使用Dropbox托管視頻。

視頻開始播放，但他沒有重復。

這是代碼：

<video id="htmlVideo" loop="loop">
    <source type="video/mp4" src="https://www.dropbox.com/s/videoID/videoplayback.mp4?dl=1">
</video>

可能是什么問題呢？

這就是我創建視頻的方式

/* 
function repeatForDropbox() {
     console.log("repeatForDropbox caled" + htmlVideo );
 } 
 */

function createVideo() {
    var video = document.createElement("video");
        video.id = "htmlVideo";
        video.loop = "loop";

    var vidSource = document.createElement("source");  
        vidSource.type = "video/mp4";
        vidSource.src = "https://www.dropbox.com/s/videoID/videoplayback.mp4?dl=1";

    video.appendChild( vidSource );

    var vidLocation = document.querySelector('#location').parentNode;
        vidLocation.appendChild( video );
    htmlVideo = document.querySelector(" #htmlVideo "); 

    // on load, play the video/mp4
    window.onload = function () {
        setTimeout(function() {
            htmlVideo.play();
            // htmlVideo.addEventListener("ended", repeatForDropbox);                                           
            // I tried here to make the video repeat, using the "ended" event listener
            // so when the video ended, the video  
            // should get another <source> element(same src)  
            // and delete the old one
            // but the event didn't fire
            // I also tried htmlVideo.onended = function() {} , but same result
        }, 500);
    }
}

Answer 1

只是一個猜測，但我懷疑這與重定向有關。 帶有？dl = 1的Dropbox共享鏈接會將您重定向到一次性使用的 URL，以下載內容。 也許當視頻播放器嘗試循環播放時，它會嘗試再次訪問重定向目標。

這可能會顯示在瀏覽器的網絡流量中，因此值得一看。 （如果您使用的是Chrome，例如，Chrome檢查器的“網絡”標簽。）

Answer 2

我想知道Squarespace是否可以讓您將視頻的二進制文件保存到文本文件中，然后使用AJAX導入並將其保存到indexedDB，然后再將其轉換為視頻。

這里是一些鏈接：

顯示來自Blob Javascript的視頻

https://simpl.info/video/offline/

Answer 3

萬一有人仍然需要該解決方案，我找到了一種使用jQuery的解決方法：

$('video').on('ended', function () {
    this.load();
    this.play();
});

但是，重復之間會稍有延遲！