利用 Google 試算表當小型資料庫 (2)讀取、儲存資料庫__更新

A+

(Pic from: veryicon.com)
由於本文為更新版的內容,主要是修正舊文的參數,關於重要的原理、Json 資料格式、使用要點等內容便不再重複,請直接參考舊文「利用 Google 問卷(試算表)當小型資料庫__(二)讀取、儲存資料庫」,以下直接利用「上一篇」 取得的參數來進行資料庫的讀取與寫入。


2014.1.1 公告

由於 Google 產品常常改版,每隔一陣子就會有些許變動,或許本文的操作畫面會跟實際畫面稍許不同,不過只要理解文章所要闡述的原理,相信可以自行對照一下、並找出正確的執行方法。因此本文的操作內容不再隨 Google 改版而更新,因為只要了解原理,那麼要實現利用 Google 試算表當小型資料庫是沒問題的。


二、讀取資料庫

1. 轉換為 Json 格式:

根據「上一篇」→「一、製作資料庫」→ 第 14 個步驟,我們得到「https://spreadsheets.google.com/feeds/list/0AikclfTTti-0dGFNMHRKdFVIaG12eE9wbUdkS1NYYXc/od6/public/basic?alt=rss」這樣的字串。

將這一行改為以下字串:

https://spreadsheets.google.com/feeds/list/0AikclfTTti-0dGFNMHRKdFVIaG12eE9wbUdkS1NYYXc/od6/public/values?alt=json-in-script

2. 分析 Json 內容:

將改過的字串貼到網址列,從瀏覽器顯示的 Json 格式資料,依照「舊版的方法」,問卷問題的資料將儲存在以下的位置:

json.feed.entry[0].gsx$問題標題.$t
在「上一篇」中我們設定了兩個問題標題 "Q1" 及 "Q2",因此這兩個問題的資料將分別儲存在:

json.feed.entry[0].gsx$q1.$t
json.feed.entry[0].gsx$q2.$t

請注意標題 "Q1" 及 "Q2" 都被自動轉換成小寫 "q1" 及 "q2" 了,因此之後使用 javascript 讀取資料時也必須用小寫的參數。



3. 印出資料庫內容:

接下來使用以下簡單的 javascript 就能呼叫試算表資料轉換的 Json 格式,呈現在自己的網頁:


B:設定處理 Json 的函數名為「test」,括弧內的參數建議設定為 json。

C:變數「a」抓出資料庫內儲存的資料組數。

E~F:設定變數「b、c」抓出每筆資料的儲存欄位

G:印出每筆資料

K:最重要的一行,綠色字串就是步驟 1 我們更改後的字串;紅色字串代表把抓出來的 Json 格式資料傳送給要執行的函數;藍色字串必須填上處理 Json 資料的函數,就是 B 行的 test 函數。

可以開一篇文章貼上程式碼看看跑出來的結果。



三、寫入資料庫

1. 利用網址傳送資料:我們在「上一篇」→ 第 7 個步驟得到的字串「https://docs.google.com/forms/d/1iVpKF_oArILEsQmjar5Ds4Zd7IRiurx6osjuiSTltbA/formResponse

再配合第 8 個步驟得到的字串──

第一筆資料:entry.146652736
第二筆資料:entry.2142316379


假設我們第一筆資料填入 "WFU BLOG",第二筆資料填入 "http://wayne-fu.blogspot.com",那麼可組合成以下字串──

https://docs.google.com/forms/d/1iVpKF_oArILEsQmjar5Ds4Zd7IRiurx6osjuiSTltbA/formResponse?entry.146652736=WFU BLOG&entry.2142316379=http://wayne-fu.blogspot.com&submit=Submit
注意以上綠字的各種符號,網址填入參數必須以「?」問號開始,每筆參數、資料以「&」符號隔開,參數與資料之間使用「=」等號,最後填入「&submit=Submit」結束;

將以上字串貼到網址列按下 Enter,再回到試算表一看:



兩筆資料均順利寫入試算表!


2. 寫入資料注意事項:

  • 第 1 點的舉例只傳送兩筆資料,如果問卷有多個問題,依照以上格式將所有問題依序塞入字串即可。
  • 當使用 javascript 傳送資料時,為了避免某些字元在網址列被辨識錯誤,字串最好經過 escape 轉換,確保能成功存入試算表。


3. 動態傳送資料:用 js 寫這段程式碼稍微冗長一點,不過相信會看這篇文章的讀者,至少有一定的 js 程度,那就假設都對 jQuery 很熟悉好了。以下使用 jQuery 舉例,使用 getScript 即可傳送資料寫入表單:

<script>
$.getScript("傳送網址");
</script>

是不是很簡單?一行就解決了。("傳送網址" 的字串請見前面「1. 利用網址傳送資料」的範例)



四、資料庫應用舉例

舊版文章提供了「推文系統」 當作應用的舉例,目前而言比較近期的作品「部落格即時留言板 WYBOARD」會是較好的例子。

只是這兩個當作應用範例的話,程式仍是過於龐大,不是那麼淺顯易懂。將來有機會的話會弄個簡易範例,易於資料庫讀取、寫入的實際運用說明。



用 Google Apps Script 操作試算表系列文章:

18 則留言:

  1. 版主您好,當我在使用javaScript印出資料庫內容時:
    在已登入 或 已登出 google帳戶時完全沒有問題。
    問題在有時候會完全無法印出資料庫內容,網頁一片空白!
    手動鍵入Json 格式網址後發現,將自動轉到google登入頁面。
    處於半登入狀態(已登入帳戶,但需重新輸入密碼),所以我的網頁才會完全無法印出資料。
    各位有遇到類似的問題嗎?非常感謝~

    回覆刪除
  2. <3597098176913657301>(以上內容請勿刪除,從括號之後開始留言)不太瞭解你的情形是什麼狀況,json 能否讀取與是否登入無關,只與你是否有將試算表發佈到網路上有關。

    回覆刪除
  3. 版主你好,想請問有沒有更新的教學,新版拿到的連結已經不是rss結尾,沒辦法照文章做讀入的動作,新版的連結長這樣:https://docs.google.com/spreadsheets/d/1KwVwMoqsxAnofA5x46nXEdzaDfdIn7tMxv5lDBIDq1Y/pubhtml

    跪求,謝謝版主大大

    回覆刪除
  4. <2969991462990806325>(以上內容請勿刪除,從括號之後開始留言)請看文章開頭的公告,我不會再更新新版試算表,新版的作法也不會公開,如果你需要舊版檔案,可以使用留言分頁的 "悄悄話" 留下你的 email,再寄給你。

    回覆刪除
  5. 您好:
    剛好在研究這個動作,看到您的網頁。
    可以向您索取舊版資料以做參考嗎?
    謝謝:)

    不知道如何用悄悄話耶@@
    yingjen.android@gmail.com

    回覆刪除
  6. <7523022208169533541>(以上內容請勿刪除,從括號之後開始留言)Google 試算表最近強迫升級為新版,所以舊版檔案也無效,要嘛得自行研究,不然就是把你的案子發給我了。

    回覆刪除
  7. 請問 我想寫一個用以上教學用好的網址上傳資料的方法 但我並不想要有後面GOOGLE表單轉到的畫面,可以避開或是在跳轉嗎?

    回覆刪除
  8. <3548193337317754375>(以上內容請勿刪除,從括號之後開始留言)訪客不可能看到 "GOOGLE表單轉到的畫面" 的啊?執行方式如同文章所提,$.getScript("傳送網址") → 你看不到畫面的

    回覆刪除
  9. <6432114052741457489>(以上內容請勿刪除,從括號之後開始留言)http://imgur.com/7eVW3yB.png 這個是我寫的

    回覆刪除
  10. <6838230930047053181>(以上內容請勿刪除,從括號之後開始留言)可惜我還是看不出什麼情況下會出現這樣的畫面

    回覆刪除
  11. <3093486257462618578>(以上內容請勿刪除,從括號之後開始留言)這一個是我用的,我只是單存開啟網頁,因欸我不知道怎麼用javascript的部分..,對了,有辦法分行嗎?不然船的訊息都擠在一行...
    https://docs.google.com/forms/d/1nAgkEwGx0dP2vQy266vhPaKtah_yOOD42y141DJ8Phc/formResponse?entry.2000608003=tesy

    回覆刪除
  12. <7398726003820510079>(以上內容請勿刪除,從括號之後開始留言)js 的使用方法本文已經有舉例了,建議先學習 js 再來研究這個主題。

    回覆刪除
  13. 請問照教學
    是不是應該是這種用法?

    $.getScript("https://docs.google.com/forms/d/e/1FAIpQLSdrX5zdy4YKIGVp9axctQb5YYUhiuEcGBjOsEvcTSDez96ehw/formResponse?entry.2046751420=WFU BLOG&submit=Submit");

    但我會收到錯誤訊息
    Refused to execute script from 'https://docs.google.com/forms/d/e/1FAIpQLSdrX5zdy4YKIGVp9axctQb5YYUhiuEcGBj…ehw/formResponse?entry.2046751420=WFU%20BLOG&submit=Submit&_=1485278199998' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

    以前這用法可行是不是他不會用 HTML 呈現接到參數的畫面?
    還是我哪裡寫錯了嗎?


    我只是想問一下究竟是我的寫法寫錯,還是現行版本無法用這種方式?

    回覆刪除
    回覆
    1. google 試算表很久以前就改版了,會有這個狀況,但不會影響寫入試算表。

      刪除
  14. 補充一下
    我剛查證是監視 JavaScript Console log 會出現 Error log
    但我去 Excel 看他確實會存進去

    不過很納悶為什麼會這樣有錯誤訊息,卻功能又正常傳送。

    回覆刪除
    回覆
    1. 不喜歡看到錯誤訊息的話,可以使用另外一種作法,參考 http://www.wfublog.com/2017/01/google-apps-script-spreadsheet-write-data.html

      刪除
    2. 感謝!期待後續系列文章!

      刪除
    3. 不會,可以訂閱本站最新文章,因為後續系列文,要一段時間後才會全部發佈~

      刪除

張貼留言注意事項:

◎ 勾選「通知我」可收到後續回覆的mail!
◎ 請在相關文章留言,與文章無關的主題請至「Blogger 中文論壇」。
◎ 提問若無法提供足夠的資訊供判斷,可能會被無視。建議先參考這篇「Blogger 提問技巧及注意事項」。
◎ CSS 相關問題非免費諮詢,建議使用「Chrome 開發人員工具」尋找答案。
◎ 手機版相關問題請參考「Blogger 行動版範本的特質」→「三、行動版範本不一定能執行網頁版工具」。
◎ 非官方範本問題、或貴站為商業網站 ,請參考「本站諮詢頁面」→「1. 諮詢服務」
◎ 若留言要輸入語法,"<"、">"這兩個符號請用其他符號代替,否則語法會消失!
◎ 為了過濾垃圾留言,所有留言不會即時發佈,請稍待片刻。
◎ 本站「已關閉自刪留言功能」。

TOP