基于Google电子表格的静态网站“ CMS”



对于事件/产品/服务的故事,公司越来越多地根据任何设计师创建网站。 要么自己,要么吸引设计师而没有程序员的参与。 现代设计师可以让您建立一个凉爽,明亮,有效的网站,但它是静态的。 任何更改都必须在“编辑器中的笔”中进行,然后重新发布页面。 但是,如果数据经常变化或者您想增加一点自动化该怎么办?这就是Google表格和图表查询语言(程序员很熟悉)可以为您提供帮助的地方。

几年前,我遇到一位朋友,他需要在Tilda上收集的网站上添加价目表。 一切都会好起来的,这里有一个“表”块-填写数据并发布,但是有两个条件:

  • 价格取决于美元,几乎每天都在变化
  • 在产品组页面上需要一个共同的价格及其组成部分

因此,很多例行程序和很高的数据差异可能性。 有必要实现自动化。

而帮助来自Google Speadsheets。 我认为描述专业人士是没有意义的:通常的编辑,协作,公式。 您需要做的只是每天更改一次汇率。 剩下的就是如何从站点上的表中获取数据的问题。 然后,Google Charts API派上了用场。
它允许使用ajax请求以jsonp的形式接收数据。

该请求必须发送到地址“ docs.google.com/a/google.com/spreadsheets/d/xxxxxx/gviz/tq?tq=yyyyyy
其中:
xxxxxx-来自指向Google表格的公共链接的标识符
yyyyyy-从转换后的表中检索数据的SQL查询(不要忘记将所有字符转换为HTML实体,例如:select%20A%2C%20sum(B)%20group%20by%20A)。

另一个要点是,SQL非常熟悉,除了它被截断了(请参阅文档 ),但FROM块已被完全切掉。 因此,您需要编写如下内容:“选择A,B,其中C ='f',并且B小于B的30阶”

生成的脚本将调用google.visualization.Query.setResponse(数据)方法。
数据对象包含以下有用数据:

{ status: "ok", //    table: { cols: [ //      0: { id: "A", label: "  ", type: "string" }, 1: { id: "B", label: "  B", type: "number" }, ... ], rows: [ //    0: { c: [ //      0: { v: "" //      } 1: { v: 3.1415, //      ""  f: "3,1415" //     } ] } ] } } 

好吧,然后对数据进行所需的操作:至少将其插入表格中,至少生成svg(用于根据郊区村庄的方案生成地图,注明免费和出售的地图),至少替换文本中的占位符-幻想的旅程是无限的。

自然,此方法不适用于高负载系统,Google对每天的请求数量有限制,但是到目前为止,我无法找到自动化站点。

最后一点提示。 进行查询的表应通过引用共享。 而且,如果您突然需要公众看不见的字段,那么Google表格中有一个方便的功能。 它称为IMPORTRANGE(键,范围) 。 关键字是指向您有权访问的任何表的链接,范围是要显示的一组单元格。 即 您将创建一个封闭的表,其中包含一组完整的数据和一个公共表,仅将必要的数据范围导入其中(您仍将在网站上显示这些数据)。

Source: https://habr.com/ru/post/zh-CN432740/


All Articles