एचटीएमएल <video loop> - कई बार डाउनलोड किया गया

Question

मैं एक पृष्ठ में एक पृष्ठभूमि के रूप में एक वीडियो स्थापित करने की कोशिश कर रहा हूँ। बात यह है कि मेरे पास एक वीडियो है और वीडियो के लिए 1 डाउनलोड ट्रिगर करता है, फिर जब यह फिर से समाप्त होता है तो वीडियो फिर से खेलना शुरू कर देता है, लेकिन यह फिर से डाउनलोड करता है।

जैसे कि यह एक छोटी सी चीज थी, पांचवें पुनरावृत्ति के बाद, यह सिर्फ वीडियो बजाना बंद कर देता है।

मैं क्रोम 30.0.1599.14 देव उपयोग कर रहा हूँ अभी उबंटू 13,04

---

यहाँ और स्क्रीनशॉट

कैसे इस व्यवहार को रोकने के लिए पर कोई सुझाव पर?

Answer 1

इस समस्या को हल करने का एकमात्र तरीका फ़ाइल को स्थानीय संग्रहण या किसी चीज़ में लोड करना है। उदाहरण

Answer 2

<style type="text/css"> 
body { background: url(demo.jpg) center; 
background-size: 300%; 
width:100%; 
height:150px;} 
video { display: block; } 
video#bgvid { 
position: fixed; 
top: 50%; 
left: 50%; 
min-width: 100%; 
min-height: 100%; 
width: auto; 
height: auto; 
z-index: -100000; 
-webkit-transform: translateX(-50%) translateY(-50%); 
transform: translateX(-50%) translateY(-50%); 

} 
@media screen and (max-device-width: 800px) { 
body { background: url(demo.jpg) #000 no-repeat center center fixed; } 
#bgvid { display: none; } 
} 
</style> 
<script type="text/javascript"> 
//if it is not already in local storage 
if (localStorage.getItem("demo") === null){ 
//make request for file 
var oReq = new XMLHttpRequest(); 
oReq.open("POST", "http://LINK_TO_demo.mp4", true); 
// arraybuffer needed for binary file 
oReq.responseType = "arraybuffer"; 
// once loaded 
oReq.onload = function(oEvent) { 
// Convert to Blob Object 
var blob = new Blob([oReq.response], {type: "video/mp4"}); 
var reader = new FileReader(); 
reader.readAsDataURL(blob); 
reader.onload = function(e) { 
var dataURL = reader.result; 
localStorage.setItem("demo", dataURL); 
// reload or add document ready function. 
location.reload(); 
} 
oReq.send();}} 
var videlem = document.createElement("video"); 
videlem.autoplay = true; 
videlem.loop = true; 
videlem.poster = "demo.jpg"; 
videlem.id = "bgvid"; 
var sourceMP4 = document.createElement("source"); 
sourceMP4.type = "video/mp4"; 
sourceMP4.src = localStorage.getItem("demo"); 
sourceMP4.autoPlay = true; 
videlem.appendChild(sourceMP4); 
document.body.appendChild(videlem);  
</script> 

इससे यह तेजी से खेल सकेगा और वीडियो को स्थानीय संग्रहण में संग्रहीत कर देगा ताकि सर्वर पर कोई और अनुरोध नहीं किया जा सके।

Answer 3

मुझे एक ही समस्या है और समाधान के लिए इंटरनेट की खोज की है। मुझे पता है कि यह एक 3 साल पुरानी पोस्ट है, लेकिन यह इस समस्या में भाग लेने वाले लोगों की मदद कर सकती है। मेरे मामले में हमारे पास लूप में + - 24 एमबी .mp4 फ़ाइल थी, क्रोम ने प्रत्येक लूप पर वीडियो को फिर से लोड किया। मैंने वीडियो को थोड़ा संकुचित किया और वीडियो को .webm में परिवर्तित कर दिया। फ़ाइल का आकार 4.5 एमबी तक घटा दिया गया था और समस्या गायब हो गई थी।

संपादित करें: ऐसा लगता है जैसे फ़ाइल आकार के साथ कुछ करना है। समस्या 4.5 एमबी .mp4 के साथ भी नहीं होती है।