我想这样做:
- 通过 Javascript 从服务器下载数据(我知道我可以做到)
- 将其存储在磁盘上(我知道我可以使用 IndexedDB 来做到这一点)
- 将该数据作为文件路径引用。 (示例:如果我下载 mp3，我希望它能够将其作为“foo.mp3”传递到 HTML5 音频标记中)
#3 可能吗？
我知道我可以使用 base64 并创建一个数据 URI，但这很慢并且(至少对于音频)似乎不适用于 Android 或 iOS(我已经使用纯 HTML5 音频标签和 SoundManager2 对此进行了测试) )。
注意:我只对跨浏览器、跨平台解决方案感兴趣。
最佳答案
表面上您应该能够执行以下操作:
- 从数据库中读回 blob
- 使用
URL.createObjectURL()构造 blob 的 URL - 将 URL 分配给
audio元素 - 可选:
URL.revokeObjectURL()在不再需要时释放 blob(例如，如果为音频元素指定了新的 URL)
例如:
<!DOCTYPE html>
<title>IndexedDB / Blob / URL Example</title>
<p>Select audio file here: <input type=file>
<p>Then play here: <audio controls></audio>
<script>
// When a file is selected...
document.querySelector('input[type="file"]').addEventListener('change', function(e) {
var file = e.target.files[0];
// Open the database connection.
var open = indexedDB.open('blob-test');
open.onupgradeneeded = function() {
// Define the database schema if necessary.
var db = open.result;
var store = db.createObjectStore('files');
};
open.onsuccess = function() {
var db = open.result;
var key = 1;
// Write file to DB
var tx = db.transaction('files', 'readwrite');
var store = tx.objectStore('files');
store.put(file, key);
// Later, read file back out of DB
var tx2 = db.transaction('files');
var store2 = tx2.objectStore('files');
var request = store2.get(key);
request.onsuccess = function(e) {
// Got the file!
var file = request.result;
// Construct a URL for it
var url = URL.createObjectURL(file);
// Update audio element with the URL
document.querySelector('audio').src = url;
};
};
});
</script>
..但您仍然想到处测试。最近修复了一些错误，例如Android 上的 Chrome 会对此产生影响(例如 https://crbug.com/227476 )
关于javascript - 是否可以通过 Javascript 下载数据，然后通过文件路径引用该数据？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32964764/