这是我在stackoverflow上的第一个问题。我在这里和谷歌尝试搜索：
将文件转换为 blob，将其保存在 WebSQL 中，然后从数据库中选择它并显示为 window.URL.createObjectURL
所以...几乎所有事情都完成了我已经将 XMLHttpRequest 转换为 blob，并将 XMLHttpRequest 保存到 WebSQL 中（我选择 WebSQL 用于移动用途）但我不知道如何将二进制文本重新转换为 blob 和使用 window.URL.createObjectURL 打开。我已经尝试了几种方法来做到这一点，包括使用 Blob 构建器，它写入 URL 但什么都没有（404 错误）
下面是我的代码，评论是葡萄牙语，但有任何问题，只要问。我将查询设置为 ID=1 和 result[0] 只是为了测试。
<script>
window.URL = window.URL || window.webkitURL; //Instancia o window.URL
var xhr = new XMLHttpRequest(); //Instancia o XHMLHttpRequest
window.onload = function(){
var status = document.getElementById("status");
status.innerHTML = "Aplicação Carregada";
potti.webdb.open();//Abre o Banco
potti.webdb.createTable();//Cria a tabela
getBinary("http://www.belenosonline.com/Blob/1.pdf");//Pega o arquivo
}//Fim onload
function getBinary(url){
if(xhr != null){//Se ele conseguir criar o HMLHttpRequest
xhr.open("GET", url, true);//Abre a conexão GET para o arquivo de forma assincrona (true)
xhr.responseType = "text";
xhr.onreadystatechange = xhrHandler;//State Handler
xhr.send(null);//Não envia nada
}
else{
alert("Seu navegador não é suportado, por favor, atualize-o");
}
}
xhrHandler = function(){
if(xhr.readyState == 3){
status.innerHTML = "Carregando Arquivo";
}
else if(xhr.readyState == 4){
if(xhr.status == 200){
status.innerHTML = "Arquivo Carregado com Sucesso";
var conteudo = xhr.responseText;
potti.webdb.insert("Mozilla",conteudo);
}
else{
status.innerHTML = "Houve um erro no processamento do arquivo";
}
}
else{
status.innerHTML = "Houve um erro no processamento do arquivo";
}
}
//Encapsula o Banco de dados
var potti = {};
potti.webdb = {};
potti.webdb.db = null;
//Abre o BD
potti.webdb.open = function() {
var dbSize = 50 * 1024 * 1024; // 50MB
potti.webdb.db = openDatabase("TestBD", "1.0", "Teste", dbSize);
}
//Cria a tabela no banco
potti.webdb.createTable = function() {
var db = potti.webdb.db;
db.transaction(function(tx) {
tx.executeSql("CREATE TABLE IF NOT EXISTS TestTable(ID INTEGER PRIMARY KEY ASC, nome TEXT ,conteudo TEXT)", []);
});
}
//Insere dados no Banco
potti.webdb.insert = function(nome,conteudo){
var db = potti.webdb.db;
db.transaction(function(tx){
status.innerHTML = "Gravando no Banco";
tx.executeSql("INSERT INTO TestTable(nome, conteudo) VALUES (?,?)",
[nome, conteudo],
potti.webdb.onSuccess,
potti.webdb.onError);
});
}
//Carrega dos dados
potti.webdb.loadData = function() {
var db = potti.webdb.db;
var result = [];
db.transaction(function (tx) {
tx.executeSql("Select * TestTable WHERE ID = 1", [], function(tx, rs){
for(var i=0; i<rs.rows.length; i++) {
var row = rs.rows.item(i);
result[i] = {
"Id" : row["ID"],
"Nome" : row["nome"],
"Conteudo" : row["conteudo"],
};
}
var blob = new Blob([result[0].Conteudo], { type: 'application/pdf' });
console.log(window.URL.createObjectURL(blob));
}, potti.webdb.onError);
});
}
//Erro no Banco de Dados
potti.webdb.onError = function(tx, e) {
console.log("Houve um erro " + e.message);
}
//Sucesso no Banco de Dados
potti.webdb.onSuccess = function(tx, r) {
document.getElementById("status").innerHTML = "Salvo no Banco";
potti.webdb.loadData();
}
</script>