我嘗試使用 base64 來獲取影像資料：
function previewFile() {
const preview = document.getElementById('video1');
const file = document.querySelector('input[type=file]').files[0];
const reader = new FileReader();
reader.addEventListener("load", function() {
// convert to base64
preview.src = reader.result;
}, false);
if (file) {
reader.readAsDataURL(file);
}
}<input type="file" onchange="previewFile()"><br>
<video width="320" height="240" id="video1" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>這個腳本讓你上傳一個 mp4 檔案，然后它會顯示它。
問題是 base64 太長了。有沒有其他方法可以獲取檔案資料但更短？
uj5u.com熱心網友回復：
您想將Bloburl 用于較短的 src。
將 Base64 轉換為 Blob 更改：
reader.result
到：
window.URL.createObjectURL(file)
function previewFile() {
const preview = document.getElementById('video1');
const file = document.querySelector('input[type=file]').files[0];
const reader = new FileReader();
reader.addEventListener("load", function() {
// convert to base64
preview.src = window.URL.createObjectURL(file);
}, false);
if (file) {
reader.readAsDataURL(file);
}
}<input type="file" onchange="previewFile()"><br>
<video width="320" height="240" id="video1" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/361219.html
標籤：javascript html
上一篇：將cssunicode轉換為js