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

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');
};

一旦完成所有内容，您将看到类似下面的屏幕截图，最终结果的顶部和原始电子表格的底部。我已经删除了一些信息。我希望这有所帮助。