跳到主要內容

細看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

留言

  1. 最近從前端 不寫 JSONP 的方式,好像會被檔跨域
    不知道是不是他又改了什麼,還是我寫錯

    但我透過 jQuery $.ajax 去發 POST
    如果不定義成 JSONP 寫法
    dataType:'jsonp'

    會發生錯誤敘述:
    Failed to load https://script.google.com/macros/s/A~~~~~~/exec: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin

    我也有印像以前好像不用做這個,也可以通
    但是現在變成要這樣

    不曉得是不是他們改了什麼
    方便幫忙測看看是不是現在都要走 JSONP 才能了?

    回覆刪除

張貼留言

這個網誌中的熱門文章

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>");

透過Google Apps Script結合Google Form做即時郵件通知

體驗過Google Apps Script的功能後,也發現他結合GmailApps的模組 GmailApps的應用可以用在表單填寫完成後,做發信的通知 例如您開立了一個訂購的表單,為了要在第一時間通知商家有訂單進入 就可以直接呼叫Gmail做發信的通知,讓手持Smart Phone的我們可以很快的知道生意上門了! 下面規劃三個function,其中: onCommit():為form commit時候觸發的function,需要掛載於form commit trigger上 jsonArrToTable():目的將json array解析成為一個Table getLastRowTable():目的將整個table的回傳過濾為剩下第一筆(表頭,含有Form的欄位說明)與最後一筆(原則上就是剛剛送出的那一筆表單) 完整程式碼如下: function onCommit(){   var sheet = SpreadsheetApp.getActiveSheet();   var rows = sheet.getDataRange();   var numRows = rows.getNumRows();   var values = rows.getValues();   var content = getLastRowTable(values);   var htmlBody = "Hi Admin: <br/><br/>有訂單拉,檢查一下吧! <br/><br/>" + content + '<br/><br/>Send by Google Apps';   GmailApp.sendEmail(     " your-email-address@gmail.com ",      "Order Confirm Notice",      htmlBody,      {from: ' from-email-address@gmail.com ', htmlBody:htmlBody}   );  } function getLastRowTable(arr){  

存取docker container內的檔案

Docker既然是container概念存在,就想到應該可以透過原filesystem找到對應的container內的檔案 Google了一下,在/var/lib/docker/這個目錄底下可以找到對應的container實際存在的位置... 列印一下目錄可以發現aufs/mnt下有一堆長檔名的資料夾... 透過docker ps或是進入到docker container後,可以看得到docker的instance id 範例中是:61ba7253b842 因此進入到"/var/lib/docker/aufs/mnt/"後,後面加讓instance id後,在透過tab補字可以列出該container相關資訊 其中會包含一個有"-init"跟一個純instance id的資料夾... 列表一下這兩個資料夾 其中無"-init"的目錄存放的就是container對應的磁碟位置 測試一下檔案的存取....,切到該目錄下,touch一個檔案... 結果真的可以在container內部看到對應touch出來的檔案 透過可見的目錄位置,container與host在某個層鍍上可以互通許多東西喲... 檔案傳輸也不用再透過scp或ftp方式存取,超方便的拉!