跳到主要內容

細看Apps Script的呼叫

上篇參考Google Apps Script Doc的部分,已經可以正常呼叫該url帶出的json資源
但是Google在Serving JSONP in Web Pages片段中提到的JSONP(可參考Wiki定義的JSONP)的方式...個人不太喜歡這個作法

雖然JSONP也是個滿普遍的作法...
但是正常來說,CORS(這邊有一篇Node.js實作CORS Server Side的文章)應該是比較正確的作法吧!
而且,上一篇實際也是用了ajax來呼叫資源成功
因此這次加上一些參數來實際了解Apps Script的Header包裝了些什麼東西...

HTTP/1.1 302 Moved Temporarily
Content-Type: text/html; charset=UTF-8
Access-Control-Allow-Origin: *
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Pragma: no-cache
Expires: Fri, 01 Jan 1990 00:00:00 GMT
Date: Sat, 20 Jul 2013 02:24:13 GMT
Set-Cookie: NID=67=R7b_RUOMh-I59....L6A8QpSgyAV;Domain=.google.com;Path=/;Expires=Sun, 19-Jan-2014 02:24:13 GMT;HttpOnly
Set-Cookie: S=maestro=inVYnnByljs; Domain=.google.com; Path=/; Secure; HttpOnly
P3P: CP="This is not a P3P policy! See http://www.google.com/support/accounts/bin/answer.py?hl=en&answer=151657 for more info."
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
Server: GSE
Transfer-Encoding: chunked

HTTP/1.1 200 OK
Content-Type: application/json; charset=utf-8
Access-Control-Allow-Origin: *
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Pragma: no-cache
Expires: Fri, 01 Jan 1990 00:00:00 GMT
Date: Sat, 20 Jul 2013 02:24:14 GMT
Set-Cookie: NID=67=aJjVSxPeIV5N1p...lJnWx2tGzMayBU9HwRjID3vAid-D;Domain=.googleusercontent.com;Path=/;Expires=Sun, 19-Jan-2014 02:24:14 GMT;HttpOnly
P3P: CP="This is not a P3P policy! See http://www.google.com/support/accounts/bin/answer.py?hl=en&answer=151657 for more info."
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
Server: GSE
Transfer-Encoding: chunked

{"name":["test1234"]}


解讀上面的回傳...
透過curl -i是為了讓回傳的資訊帶出header,而header中透漏了兩件事情:
  1. Ajax輸入的網址,再第一次回傳時,是一個302的redirect動作,所以之前使用curl -L的方式來取回實際302所指到location的資源
  2. 紅色字處的"Access-Control-Allow-Origin: *",說明Apps Script已經幫我們考慮到CORS的問題(原則上是不太需要JSONP動作的)
因此,前端的使用者,可以開始大量的使用Apps Script啦!!

簡單講一下想到的應用範圍:
  • 結合Drive應用,做排成、資料顯示、互動...等
  • 結合Github Page, Cloud CMS等軟體,這些純靜態HTML的頁面也可以有動態的結合
  • 結合Mobile的應用,讓Apps Script當做Mobile的Server端,資料庫資源部分則可以使用Apps Script呼叫RDB, NDB, BigQuery...等
  • 結合Chrome Extension的應用...
感覺很多∼Startup是不是更容易啦  :D

留言

這個網誌中的熱門文章

Google指令碼基本操作介紹 - Web Server篇

Google的指令碼是什麼東西呢?!原則上他就是Google的一份靜態檔案,但是透過Google的雲端服務平台的一些能力,將靜態檔案內的scriptlet片段拉到Google的後端作運算,寫起來就像在寫JavaScript(這邊說Node.js可能比較貼切,因為同為server side language)或JSP,而在scriptlet片段中,則可以操作許多Google的API服務,甚至他提供你連接JDBC的能力、URL呼叫的能力...等,宛如就是一套完整的雲端程式語言(這樣說應該不為過拉,這真是個創新!),有並駕於App Engine的氣勢喔!
Google指令碼的範圍很廣,筆者也仍在摸索中,之前介紹過透過Sheet+指令碼做一個簡單的URL監控(這裡),而本篇簡單介紹一下指令碼如何製作一個Web Server(嚴格說起來是Web Page拉,但是具備Server端運作功能喔!)。您將可以體驗到No-Hosting Web Server的威力!
指令碼是Google Drive的一個服務,Google將指令碼(Code)以檔案方式寄存在Drive中,類似的靜態檔案服務的應用,最近滿火紅的!

首先開啟指令碼時候,選擇"作為網路應用程式的指令碼",檔案開啟後,會有愈設定程式碼片段供編輯


程式碼片段大致上如下,是一個doGet function,Web base的指令碼需要認得doGet()作為server的進入點 如果選擇到空白專案的話,只要把doGet function建上即可

作為一個Cloud IDE,Google當然也有把Code Hint擺上來,透過簡單的提示,寫啟程是來就更容易拉!

而Web部分物件的建立主要是透過HtmlService這個模組來進行操作,我們利用他來output html, load static html page, load template html page..等,範例如下:
Output HTML: // Script-as-app template.
function doGet(e) {
  return HtmlService.createHtmlOutput("<h1>HELLO!</h1>");
}
透過上HtmlService的createHtmlOutput的功能,…

透過Google指令碼,存取Google Cloud SQL

既然Cloud SQL提供了MySQL的Feature 那麼透過指令碼(Apps Script)來存取Cloud SQL應該也是OK的拉! 這邊介紹一下在指令碼中操作的方式
首先要確認一下您在Cloud SQL中申請的DB Instance名稱 而名稱可以在API Console中找到

此範例是屬於手動執行的部份,因此這邊建一個test function來收容db query的code...
function test(){
  var conn = Jdbc.getCloudSqlConnection("jdbc:google:rdbms://[db instance name]/[db name]");
  var stmt = conn.createStatement();
  stmt.setMaxRows(100);
  var start = new Date();
  var sql = "select * from member_info";
  var rs = stmt.executeQuery(sql);
  Logger.log('SQL:' + sql);
  while(rs.next()){
    Logger.log('['+new Date().toString() + ']' + rs.getString(1) + '::' + rs.getString(2) );
  }
}
Project看起來像這樣:

此時,在工具列選擇要執行的Function後,點選執行按鈕,就可以執行撈取Cloud SQL的動作了...

執行時候會發現Google會跟您要求受權,請user同意讓Script Editor來執行這部份程式,同意後才可以執行... 這部份是說,如果將來把這段程式碼放到Web Service中時候,該Web Service App也需要經過授權才能使用...

New Google Form Feature...

Google這次在Google Form上面做了一些改變...原本的Google Form背後都會連結到一個特定的表單(一個Form一個表單) 這次的修改就是針對這部份的限制做改善 目前可以透過Form編輯的頁面上"選擇回憶目的地"來選擇...



這邊是選擇的畫面,可以選擇新的試算表或是選擇現有的試算表中的新工作表...


如此一來,表單的運作將更具彈性拉!
詳細的Google說明,可以在這邊找到:https://support.google.com/drive/bin/answer.py?hl=en&answer=2917686&p=forms_response