Blogger 也可以有免費資料庫永久無限量存取功能 - 非Cookie (Google Blogger API V3)

大部分人都喜歡用痞客邦、或自己架 Wordpress 來撰寫部落格，其實 Blogger 也是很好的選擇。它的優點是可以自訂或載入外部 css, html, javascript 都沒問題，SEO也幫你優化，幾乎你想要的功能與視覺都能呈現出來；但如果你是網站工程師且熟悉 Blogger，那你一定很了解它唯一缺憾，是沒有像資料庫一樣存取功能來讓網站開發更多互動功能。可能很多人不知道 Google 針對 Blogger 部分也開放 API，讓軟體開發者透過 Blogger API 與 Blogger 互動，做到在網站、手機、其他應用程式可以針對指定文章或網頁新增、修改、刪除等動作。如果你的感覺很敏銳，那你應該知道，我們是否可以透過此功能，在文章或網頁進行修改存取時，放入使用者資訊，變成隨時可以存取的資料庫。用 blogger 開發 Web APP 絕對辦得到～要跳槽嗎？～哈！

官方資源
★Blogger API 官方基礎指南
★Blogger API 官方範例的javascript客戶端程式開發指南
★Blogger API 查詢

官方資源有看沒有懂沒關係，照著作者步驟來做：(本網誌左上角login按鈕就是存取實作範例)
1.Google Developers Console建立新專案
2.啟用 Blogger API v3
3.申請 API 金鑰，應該長這樣 AIzaSxBCWs3ks1DccyRmhvomBjWNFj6ONgVQIV0 (範例碼)
4.申請 OAuth 用戶端 ID，應該長這樣 800215999663-b4n3loctoaetx7gtnavvm5m7io3rgh4a.apps.googleusercontent.com (範例碼)
5.新增 Blogger 網頁並進入編輯模式，請把網址列 blogID 跟 postID 記錄下來，blogID 應為 1243191245343241160(範例碼)，postID 應為 6160462135247944473(範例碼)。我們將針對此網頁進行程式資料存取，也就是我們的小型資料庫。
6.撰寫程式碼

  <!--增加一個應用程式授權按鈕-->
  <button id="authorize-button" style="visibility: hidden">Authorize</button>
  <script>
  
  //blogger api 小型資料庫存取實作
  var clientId = '800215999663-b4n3loctoaetx7gtnavvm5m7io3rgh4a.apps.googleusercontent.com';
  var apiKey = 'AIzaSxBCWs3ks1DccyRmhvomBjWNFj6ONgVQIV0';
  var scopes = 'https://www.googleapis.com/auth/blogger';
  var blogID = '1243191245343241160';
  var postID = '6160462135247944473';

  function handleClientLoad() {
    // 步驟2: 設定 API 金鑰
    gapi.client.setApiKey(apiKey);
    window.setTimeout(checkAuth,1);
  }

  function checkAuth() {
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult);
  }

  function handleAuthResult(authResult) {
    var authorizeButton = document.getElementById('authorize-button');
    if (authResult && !authResult.error) {
      authorizeButton.style.visibility = 'hidden';
      makeApiCall();
    } else {
      authorizeButton.style.visibility = '';
      authorizeButton.onclick = handleAuthClick;
    }
  }

  function handleAuthClick(event) {
    // 步驟3: 通過授權以存取資料
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult);
    return false;
  }

  function makeApiCall() {
    // 步驟4: 讀取 Google blogger API 並執行存取動作
    var request;
    gapi.client.load('blogger', 'v3', function() {
      request = gapi.client.blogger.pages.get({'blogId':blogID,'pageId':postID});
      // 執行讀取
      request.execute(function(response) {
          console.log(response);
          // 執行寫入
          var save_data = {user_name:"test",user_password:"test2"};
          save_data = JSON.stringify(save_data); //以JSON字串存入
          request = gapi.client.blogger.pages.update({'blogId':blogID,'pageId':postID,'content':save_data});
          request.execute(function(response) {
            console.log(response);
          });
      });
    });
  }


  </script>
  <!-- 步驟1: 讀取 JavaScript client library -->
  <script src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script>