是否可以使用 Google 脚本创建公共数据库（电子表格）搜索？

Question

我正在尝试创建一个网站，用户可以在其中查找一组资源，例如门户网站或 JSTOR 等数据库。我正在使用 Weebly；这个网站最终会交给不懂电脑的人，所以我尽量让事情简单（并且免费，只要可行）。

我的想法是使用 Google Spreadsheets/Forms 来处理每个单独资源（标题、作者、类型、主题、国家/地区等）的数据的输入和存储，然后找到一些创建可以放置在网站上的搜索功能的方法。任何用户都可以到达该站点，输入他们想要查找的任何标准，并且数据库中的任何资源都将被列出以供用户进一步调查。用户不会向电子表格添加数据；只查询它的数据。

我的第一个问题是这样的脚本/安排是可能的，它可以嵌入到网站页面中吗？我的第二个问题是最好的方法是什么？

Answer 1

是的，这当然是可能的，但可以通过多种方式实现。

您可以采用的一种方法是将电子表格中的所有数据以 JSON 格式检索，并将其作为 HTML 表格添加到 DOM。然后你可以使用一个不错的插件，比如dataTables，它有一个很好的原生搜索功能。我将在下面给出一个基本示例。

要检索数据，您可以使用Googles spreadsheet JSON API。下面是一个基本示例。

<script src="http://spreadsheets.google.com/feeds/cells/*ID*/*WS*/public/values?alt=json-in-script&amp;callback=*FN*"></script>

• 其中 ID 是电子表格的长 ID。
• 其中 WS 是工作表编号，例如1,2,3等。
• FN 是您要调用的函数。在我下面的函数中，我使用 importGSS

然后我编写了以下脚本，将数据添加到 HTML 表中。它首先将第一行添加到 <thead> 部分，然后将其余部分添加到 <tbody> 部分。

function cellEntries(json, dest) {
    var table = document.createElement('table');
    var thead = document.createElement('thead');
    var tbody = document.createElement('tbody');
    var thr;
    var tr;
    var entries = json.feed.entry;
    var cols = json.feed.gs$colCount.$t;

    for (var i=0; i <cols; i++) {
        var entry = json.feed.entry[i];
        if (entry.gs$cell.col == '1') {
            if (thr != null) {
                tbody.appendChild(thr);
            }
            thr = document.createElement('tr');
        }
        var th = document.createElement('th');
        th.appendChild(document.createTextNode(entry.content.$t));
        thr.appendChild(th);
    } 
    for (var i=cols; i < json.feed.entry.length; i++) {
        var entry = json.feed.entry[i];
        if (entry.gs$cell.col == '1') {
            if (tr != null) {
                tbody.appendChild(tr);
            }
            tr = document.createElement('tr');
        }
        var td = document.createElement('td');
        td.appendChild(document.createTextNode(entry.content.$t));
        tr.appendChild(td);
    } 
    $(thead).append(thr);
    $(tbody).append(tr);
    $(table).append(thead);
    $(table).append(tbody);
    $(dest).append(table);
    $(dest + ' table').dataTable();
}

然后您可以使用 ... 回调该函数，其中 #Destination 是您要添加 HTML 表格的 <div>。

function importGSS(json){
   cellEntries(json, '#Destination');
};

全部完成后，您会看到类似于以下屏幕截图的内容，顶部是最终结果，底部是原始电子表格。我已经编辑了一些信息。我希望这对您有所帮助。