Non voglio creare un proof of concept che mostri all'utente che se caricano lo stesso video in formato .MP4 e OGG, il tag video generato (usando videojs) sarà multipiattaforma.Come posso mostrare direttamente un video caricato di recente?
Ho creato con successo un fileuploader utilizzando il designer e carica file fino a 512mb, nella cartella "file" all'interno della soluzione, ma mi piacerebbe sapere come aggiornare la pagina Web con il tag video generato.
Questo è il tag vorrei cambiare:
<video id="example_video_1" class="video-js vjs-default-skin"
controls preload="auto" width="640" height="264"
poster="http://video-js.zencoder.com/oceans-clip.png"
data-setup='{"example_option":true}'>
<source id="mp4" src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
<source id="webm" src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
<source id="ogg" src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
</video>
il mio metodo di salvataggio:
protected void btnUpload_Click(object sender, EventArgs e){
//check to make sure a file is selected
if (FileUpload1.HasFile) {
//create the path to save the file to
string fileName = Path.Combine(Server.MapPath("~/Files"), FileUpload1.FileName);
//save the file to our local path
FileUpload1.SaveAs(fileName);
}
}
EDIT:
Ho quasi la soluzione ora. in qualche modo non ha la strada giusta. La soluzione che ho creato:
<script type="text/javascript">
var _strSource = '<ASP:LITERAL runat="server" id="litSource" />';
window.onload = function()
{
if (_strSource != "") {
alert(_strSource);
var video = document.getElementById('objVideo');
var sources = video.getElementsByTagName('source');
alert(sources[0].src);
sources[0].src = _strSource;
video.load();
video.play();
}
}
</script>
E sul lato server:
protected void btnUpload_Click(object sender, EventArgs e){
//check to make sure a file is selected
if (FileUpload1.HasFile) {
//create the path to save the file to
string fileName = Path.Combine(Server.MapPath("/Files"), FileUpload1.FileName);
//save the file to our local path
FileUpload1.SaveAs(fileName);
this.litSource.Text = fileName.Replace("\\", "\\\\");
}
}
Ho anche aggiunto questo nel mio web.config:
<staticContent>
<mimeMap fileExtension=".mp4" mimeType="video/mp4" />
<mimeMap fileExtension=".ogg" mimeType="video/ogg" />
<mimeMap fileExtension=".webm" mimeType="video/webm" />
<mimeMap fileExtension=".m4v" mimeType="video/m4v" />
</staticContent>
Cambia ora il percorso (in il mio caso) C: \ Projects \ FileUploadTest \ FileUploadTest \ Files \ c4b3ae2189ea.ogg. Questo è il percorso effettivo in cui viene caricato il file, ma il browser non può raggiungere questo percorso. Qualcuno ha un'idea su come raggiungere questo obiettivo?
Penso che sia il fallback flash che viene memorizzato nella cache. Anche se imposto il browser in modo che non memorizzi nulla in cache, sembra che lo faccia ancora. Chiudere il browser e riaprirlo è una soluzione, ma qualcuno sa se posso ripristinare la cache Flash? –
Nota: funziona su Chrome (utilizzando Chrome, non si ottiene il fallback Flash) –