使用 Google 电子表格作为 Next.JS 网站的来源时出现问题:更改不会更新网页



我制作了这家餐厅的网站,并使用谷歌电子表格将内容输入菜单页面。选择这种方法是基于简单性和客户的专业知识。

我正在使用谷歌电子表格包从谷歌硬盘上的这份文档中获取我需要的所有信息。。。

//** ../pages/api/cardapios/index.js
import { GoogleSpreadsheet } from "google-spreadsheet";
export default async function getCardapioFromSlug(indexNumber) {
try {
const doc = new GoogleSpreadsheet(<%GOOGLE_SPREADSHEET_ID%>)

await doc.useServiceAccountAuth({
client_email: process.env.GOOGLE_SHEETS_SERVICE_ACCOUNT_EMAIL,
private_key: process.env.GOOGLE_SHEETS_PRIVATE_KEY,
});

await doc.loadInfo()

const cardapio = doc.sheetsByIndex[indexNumber]

const rows = await cardapio.getRows()

if (rows.length) {
return rows.map(({
Código,
Produto,
Unidade,
Descrição,
Valor,
Procedência,
Categoria
}) => {
return {
Código,
Produto,
Unidade,
Descrição,
Valor,
Procedência,
Categoria
}
})
}
} catch (err) {
console.log(err)
}
return [];
}

然后使用CCD_ 1函数将其馈送到页面中。一旦我把所有的东西都安排好了,它就像一个符咒。

// ../pages/unidades/[slug].js
export async function getStaticProps({ params }) {
const sanityData = await getCardapio(params.slug)
const indexNumber = sanityData[0].id
// console.log("index number", indexNumber)
const produtos = await getCardapioFromSlug(indexNumber)
const produtosStringfied = JSON.stringify(produtos)
const produtosArray = JSON.parse(produtosStringfied)
return {
props: {
cardapio: {
info: sanityData[0] || null,
items: produtosArray || null
}
},
revalidate: 1
}
}

问题是,在我们更改了源文档中某些单元格的值后,网站中的内容没有自动更新。

我尝试过重新部署它(打开和关闭构建缓存(,这样构建过程就可以再次从文档中获取内容并更新网站,但没有成功。一个想法是制作一个webhook,客户端可以在他的机器上运行一个简单的命令,并用新的信息重建页面,但这种方法似乎没有用。

我在谷歌电子表格的自定义webhook上红了一些文章(比如这篇(,但我真的不明白它会如何在我的页面上触发一些东西。不要真的认为它真的会起作用。

现在我有点纠结于该去哪里。也许我应该重写我的getStaticProps()

问题与代码本身无关,而是对API的误用。电子表格中的id是错误的,仍然使用了一个原型,该原型被用作客户最终拥有的原型的基础。更改了env-var,一切都很好。

必须通过vercel cli强制部署,忽略构建缓存。感谢所有花时间评论和思考这个问题的人。

最新更新