---
# System prepended metadata

title: Google App Script 開發 LINE 官方帳號-模擬訂單查詢

---

---
title: Google App Script 開發 LINE 官方帳號-模擬訂單查詢
date: 2020-12-22 20:22:46
---

# 使用 Google App Script 開發 LINE 官方帳號 - 模擬訂單查詢

## 前言 

使用 Google App Script 開發功能是非常方便的工具，使用上可能跟一般在運用 JavaScript 不太一樣，它是有一套自己的運行週期，而主要程式語法還是圍繞在 JavaScript 身上，也有封裝包好的 Google 相關套件，例如試算表抓取之類的。

## 模擬製作 Line 官方網站 訂單查詢

### Google App Script 會使用到的執行函數

```
1. onOpen(e) 當用戶打開用戶有權編輯的電子表格，文檔，演示文稿或表單時運行。

2. onInstall(e) 當用戶從 Google 文檔，表格，幻燈片或表單中安裝編輯器加載項時運行。

3. onEdit(e) 當用戶更改電子表格中的值時運行。

4. onSelectionChange(e) 當用戶更改電子表格中的選擇時運行。

5. doGet(e) 當用戶訪問網絡應用或程序將 HTTP GET 請求發送到網絡應用。

6. doPost(e) 當程序將 HTTP POST 請求發送到 Web 應用程序時運行。
```

上面各項函數是透過執行 Google App Script 主要執行窗口，想像是程式碼執行會先啟動的位置。

### 模擬製作訂單查詢

首先建立你的試算表資料，並且取得網址等等會使用到，然後在 Google App Script 創建一個新的專案，然後開啟新建指令專案碼`Code.gs`，以及網頁接收畫面 index.html，接著在`Code.gs`以及`index.html`依順序置入使用的程式碼，如下圖。

試算表

![](https://i.imgur.com/S55sqgD.png)

Code.gs

```javascript=
Code.js
/*
 * 執行出發點
 */
function doGet(e) {
  // 呼叫載入顯示 html 檔案名稱只需要前面後面的 .html 不需要寫上去
  var html = HtmlService.createTemplateFromFile('index');
  // 假設這是 Line 傳給你的使用者 id 例如 liue user id
  var userId = "abc111";
  // 呼叫 google excel 去找出你要的資料，別忘記上面的 userId 一起帶入進去
  var data = dataLoading(e,userId);
  // 將 data 的值附於給前台 .html 使用
  html.data = data;
  // 最後執行呼叫畫面 return 停止意思必須執行到這中斷概念
  return html.evaluate();
}

/*
 * 載入資料函數
 */
function dataLoading(e, userId) {
  // google excel 連結 
  var url = "https://docs.google.com/spreadsheets/d/1AivWN1oU5fU2pF3mOTZYaR7hHJ_CVcQbazHL0BkHOZE/edit#gid=0";
  // 選定要的工作表名稱
  var name = '工作表1';
  // 取得試算表資料
  var SpreadSheet  = SpreadsheetApp.openByUrl(url);// 取得試算表網址資料
  // 透過試算表取得工作表資料
  var SheetName = SpreadSheet.getSheetByName(name);// 選取工作表名稱
  // 獲取最後一列
  var lastColumn = SheetName.getLastColumn();
  // 獲取最後一行
  var lastRow = SheetName.getLastRow();
  // 透過 lastColumn/lastRow 獲取所有資料
  var data = SheetName.getSheetValues(2,1,lastRow-1,lastColumn);
  // 試著打印試算表資料
  for (var i = 0; i < data.length; i++) {
     // Logger.log(data[i]);
  }
  // 將資料轉格式
  var newList = [].concat(...data);
  // 搜尋資料 // userId=abc111 是 excel 資料表數值 想像這個欄位使用 Line 使用者 id
  var result = data.filter((element) => (element[0] == userId));
  // 打印是否你要的資料
  
  // Logger.log(result)
  
  // 最後回傳參數
  return result;
}
```

index.html

```htmlmixed=
<? for (var i = 0; i < data.length; i++) { ?>
    <h1>LINE ID:<?= data[i][1]; ?><h1>
    <h1>購買網址:<?= data[i][2]; ?><h1>
    <h1>金額:<?= data[i][3]; ?><h1><hr>
<? } ?>
```

如果都建置完成，就可以執行發布，透過部屬網頁應程式，取得最新網址後，並且嘗試呼叫可以看到使用者 id=abc123 的資料。

1. 按下確認。
    
   ![](https://i.imgur.com/yncymV5.png)

2. 更新。
    
   ![](https://i.imgur.com/8Vr9JMH.png)

3. 使用 Test web app for your latest code.，這就是能使用得網址。
    
   ![](https://i.imgur.com/HC5ro6O.png)

4. 得到網頁上的結果。
    
   ![](https://i.imgur.com/HISwBCE.png)


## 特別說明

1. `Code.gs`先定義函數內容，主要是了解基礎執行概念以及在 dataLoading() 函數如何找查 Google Excle 資料。在 Google App Script 概念就很像是 JavaScript 語法，但用法會稍微不同，但大致語法內容都能使用到。

2. index.html 上會看到`<? ?>`符號對於網頁工程師應該都不陌生，這就是樣版語法，可以直接使用 for、if 等相關程式碼語法，以範例來說就是將結果透過迴圈把裡面的值給一一抓出來。

3. 在 Google App Script 可以透過`Logger.log()`函數打印結果是否有錯誤。

4. 目前是透過`doGet`函數模擬一個請求來抓取訂單查詢情境，而真正透過 Line 官方帳號取得使用者 id 則是要使用另一個方式來實現，下一個章節會教導實現 Line 官方帳號取得使用者資料。
