2016-05-06 14 views
7

Negli ultimi giorni, abbiamo notato che i nostri video in streaming utilizzando smettere MediaElement.js Version 2.11.3 e Chrome Version 50.0.2661.94 (64-bit)video non è più in streaming con mediaelement.js in Chrome

Video ancora giocare in Firefox e Safari senza un problema.

L'errore che riceviamo negli strumenti di Chrome Dev è:

Uncaught (in promise) DOMException: The element has no supported sources.

La marcatura sulla pagina visualizzata si presenta così:

<video height="150" poster="https://xxxxxxxxxx.cloudfront.net/123423_1_thumb.jpg" preload="auto" width="200" src="" hidden-source="https://xxxxxxx.cloudfront.net/123423_1_wm.webm"> 
    <object data="flashmediaelement.swf" height="150" type="application/x-shockwave-flash" width="200"> 
    <param name="movie" value="flashmediaelement.swf"> 
    <param name="flashvars" value="controls=true&amp;file=http://s38zby1czkz3d7.cloudfront.net/123423_1_wm.mp4"> 
    </object> 
</video> 

Ecco alcune immagini degli errori per fare un po 'più chiaro:

enter image description here

Qui ci sono i messaggi di errore nella console:

enter image description here

+1

Stesso problema con Chrome 51.0.2704.81 su Samsung Galaxy Tab 4 – svassr

+0

Per quello che vale, ho riscontrato questo errore quando si trattava di sorgenti audio miste http/https. La mia pagina era https, ma la mia risorsa era servita http. Servendo sia la risorsa che la pagina sotto https ha corretto questo errore. Vedo che c'è un file mp4 http servito nel tuo codice, quindi questo potrebbe essere il problema? –

+0

Si tratta di un problema CORS. Vedi la mia risposta qui: http://stackoverflow.com/a/43434754/625745 –

risposta

4

Questo perché dal momento che Chrome 50 un gioco() chiamata su un <video> o un elemento <audio> restituisce una promessa. Se la riproduzione riesce, la Promessa è soddisfatta, e se la riproduzione fallisce, la Promessa viene respinta insieme a un messaggio di errore che spiega l'errore.

Potete trovare alcuni esempi e maggiori informazioni qui: https://developers.google.com/web/updates/2016/03/play-returns-promise?hl=en

+0

Informazioni interessanti. Purtroppo, non penso che sia in qualche modo rilevante per l'errore. La risposta qui sotto fornisce informazioni esatte sulla fonte del problema, che è un bug in Chromium 50 e non modifica API. – viskin

5

ho potuto replicare questo problema con cromo 51. Tuttavia sembra questo problema non si verifica più con Chrome 53.

Purtroppo non ho avuto Impossibile trovare una conferma facilmente leggibile su Internet, che questo è stato un bug confermato per Chromium/Chrome che è stato corretto, ma solo indicazioni che diverse persone hanno segnalato problemi con le versioni Chrome/Chromium. per esempio. Qui Videos no longer streaming with mediaelement.js in Chrome dove lo sviluppatore di Google Chrome cwilso punta a questa mailing list interna al cromo, ma i cui contenuti sono piuttosto criptici senza ulteriori ricerche. Sembra essere correlato a uno switch chiamato ENABLE_BROWSER_CDMS e all'implementazione EME per il supporto DRM, che non funzionava come previsto. https://groups.google.com/a/chromium.org/forum/#!topic/chromium-reviews/Qi4dLcKjcCM

+1

Deepak, questo chiaramente risponde alla domanda. In Chromium 50/51, l'elemento multimediale è rotto. A partire da Chromium 52, il problema è risolto e il codice sopra funziona. – viskin

+0

Grazie, viskin. Deepak: Ho cercato di estendere la mia risposta con suggerimenti su ciò che so sul problema in questione.Dato che non sono riuscito a trovare una conferma di bug ufficiale e facilmente comprensibile da parte del team Chromium e avevo dati piuttosto aneddotici che avrebbero supportato intuitivamente l'idea che l'elemento multimediale fosse rotto nelle versioni 50/51, ero un po 'difensivo quando formulavo la mia risposta prima qui . E, sì, avrei davvero preferito un commento invece di dover postare una risposta, ma non è colpa mia se non sono riuscito a farlo. –

+0

Ho ancora questo errore in Chrome 55. Sembra essere un errore standard, se il browser non riesce a dare un senso al file. – VectorVortec

0

Anche questo può essere un problema CORS. Impostare media.crossOrigin = 'anonymous'; e assicurarsi che la risposta del server abbia l'intestazione Access-Control-Allow-Origin: *. Oppure al posto del carattere jolly asterisco, specificare il dominio del sito Web a cui è consentito accedere al video dal server.