使用sql.js在HTML页面中显示SQLite .db
Using sql.js to display a SQLite .db in HTML page
我试图采取一个sqlite数据库(如data.db),并显示在一个HTML页面。如果我能在表格中显示,那就太好了。但现在,我只想看看数据。到目前为止,我已经尝试了所有我能找到的方法。
我使用sql.js作为框架,下面是我的代码。
<html>
<head>
<title>Title</title>
<script type="text/javascript" src="https://raw.githubusercontent.com/kripken/sql.js/master/js/sql.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/kripken/sql.js/master/js/worker.sql.js"></script>
<script src='sql.js'></script>
<script type="text/javascript">
var xhr = new XMLHttpRequest();
xhr.open('GET', 'data.db', true);
xhr.responseType = 'arraybuffer';
xhr.onload = function(e) {
var uInt8Array = new Uint8Array(this.response);
var db = new SQL.Database(uInt8Array);
var contents = db.exec("SELECT * FROM my_table");
};
xhr.send();
</script>
</head>
<body>
<h1>Database Data</h1>
...data to display here...
希望你已经找到了答案,所以我的答案只是留给后人。我也花了一段时间才找到一个解决方案,但代码应该会引导你找到一个解决方案。
<html>
<head>
<title>Title</title>
<script type="text/javascript" src="https://raw.githubusercontent.com/kripken/sql.js/master/js/sql.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/kripken/sql.js/master/js/worker.sql.js"></script>
<!--
<script type="text/javascript" src="sql.js"></script>
<script type="text/javascript" src="worker.sql.js"></script>
-->
<script type="text/javascript">
var path = "http://alasql.org/demo/016sqlite/Chinook_Sqlite.sqlite";
//var path = "016sqlite_files/Chinook_Sqlite.sqlite"
var xhr = new XMLHttpRequest();
xhr.open('GET', path, true);
xhr.responseType = 'arraybuffer';
xhr.onload = function(e) {
var uInt8Array = new Uint8Array(this.response);
var db = new SQL.Database(uInt8Array);
//var contents = db.exec("SELECT name FROM sqlite_master where type='table'");
var contents = db.exec("SELECT * FROM Playlist");
//alert(JSON.stringify(contents));
var table_string = '<table>';
if (contents) {
table_string += '<tr>';
for (var index in contents[0].columns) {
table_string += '<th>' + contents[0].columns[index] + '</th>';
}
table_string += '</tr>';
for (var row_index in contents[0].values) {
table_string += '<tr>';
for (var col_index in contents[0].values[row_index]) {
table_string += '<td>' + contents[0].values[row_index][col_index] + '</td>';
}
table_string += '</tr>';
}
}
table_string += '</table>';
//alert(table_string);
document.getElementById("res").innerHTML = table_string;
}
xhr.send();
</script>
</head>
<body>
<h1>Database Data</h1>
<p id="res"></p>
</body>
</html>
对于一些快速的错误检查,我使用本地文件,但代码应该正常工作。这些链接可能对您有帮助:
https://github.com/kripken/sql.js/issues/207https://github.com/kripken/sql.js/blob/master/README.md
相关文章:
- 从桌面读取python文件时高亮显示代码
- 使用JS如何动态更改显示的html文件中的文本背景颜色
- PHP:显示sqlite数据库中的html格式数据,使用tinymce保存
- 以html形式显示sqlite数据库中的数据(phonegap)
- sqlite选择的数据没有显示给ng重复
- 从SQlite中提取Lat-Long并在网络视图中显示
- 显示从接口上的数据库(JavaScript/HTML/SQLite)获取的结果
- JavaScript 显示 SQLITE 参数值
- 在 HTML 中显示 SQLITE 数据库查询
- 如何使用angular js从sqlite数据库中获取和显示图像
- window.alert消息未显示Sqlite行数据
- 如何在HTML5上显示sqlite数据
- 在原生脚本应用程序中显示sqlite数据库数据有问题
- 如何显示特定的行?使用SQLite + HTML5 + Javascript
- 从sqlite数据库中获取西班牙口音时显示符号
- 显示Sqlite列数据下拉Javascript或Jquery
- 使用sql.js在HTML页面中显示SQLite .db
- 从SQLite-JavaScript中检索和显示HTML页面上的图像
- 显示 SQLite 表中的总行数
- 用于显示本地浏览器 sqlite 数据库的 Javascript 代码