Google シーツの統合

Google-sheets-integration Veloパッケージを使用して、Google シートで電話帳データを管理する。

中級

出版された：

March 9, 2021

によって

アンカー 1

開発者を雇う

説明例

In this example, we used the Google Sheets integration Velo package to interact with a Google spreadsheet. Using input elements on the site, you can add a name and phone number to a spreadsheet or get and display the phone number associated with a name listed in the sheet.

For more information about this Velo Package, please see the Readme in the package folder located in the Code Files section of your site.

コード例

タブ1

タブ2

タブ3

このコードによる解決は複雑になる可能性がある。

信頼できるベロ開発者を雇う

どのように構築したか

We installed the Velo package on our site, and followed the steps described in the Setup section of the package’s readme file.

ページ要素

私たちはサイトに以下の要素を追加した：

2 text inputs for entering the name and phone number to add to the sheet.
Button to trigger the addition.
Text element to enter the name whose phone number you want to get.
Button to trigger the get.
Text element for displaying the retrieved phone number and validation messages.

コード

We added the following code to a web module (.jsw file) on the backend of our site:

Import the wix-secrets-backend module to work with secrets from the Secrets Manager .
Import the getValues() and appendValues() functions from the Velo package.
Define the range of the Google spreadsheet.
Add a function to get a phone number from the sheet: Validate the name passed to the function, get the Google Sheet ID from the Secrets Manager, use the getValues() package function to loop through the names in the sheet, and if the name exists in the sheet return the phone number associated with the name.
Add a function to append a phone entry to the sheet: Validate the input values, get the Google Sheet ID from the Secrets Manager, and use the appendValues() package function to add the new name and phone number to the sheet.

We added the following to our page code:

Import the wrapper functions from the web module.
When a site visitor enters a name and phone number and clicks the Add button, collapse the message text, call the backend function to append the data to the sheet, clear the input values, and show a success or error message.
When a site visitor enters a name and clicks the Get button, collapse the message text, call the backend function to get the associated phone number, and display the retrieved number or an error message.