將文章透過google api上傳至google blog

1.登入google API管理員

https://console.developers.google.com

1) 啟用google blog API

2) 申請OAuth 2.0用戶端ID 憑證

請記得設定授權的JavaScript來源 (因為是透過JavaScript)，故請設定執行的server ip / domain (PS.localhost是我為了測試用，正式需拿掉)

請記錄用戶端ID，此即後續開發會用到的client ID

3) 申請API金鑰 憑證

請記得設定接受這些HTTP參照網址(網站)發出的要求 (因為是透過JavaScript)，故請設定執行的server ip / domain (PS.localhost是我為了測試用，正式需拿掉)

請記錄API金鑰，此即後續開發會用到的API Key

2.請於初始時引用google api client javascript

 https://apis.google.com/js/client.js?onload=init

3.檢核授權狀況
1) 授權button : Ex.id用authorize-button，已授權則會隱藏，未授權則需點選並確認授權，方可上傳文章，授權頁面如下

2) 上傳文章button : Ex.id用addPostButton

上傳文章後會顯示如下訊息框

3) javascript如下

function init() {
    gapi.client.setApiKey(googleBlog.apiKey);
    window.setTimeout(googleBlog.checkAuth,1);
     
    gapi.client.load('blogger', 'v3', function() {      
        $("#addPostButton").click(googleBlog.addPost);      
    });
}       

var googleBlog = {
    blogId : '{請用您的Blog ID}',
    clientId : '{請用剛申請的Client ID}',
    apiKey : '{請用剛申請的API Key}',
    scopes : 'https://www.googleapis.com/auth/blogger',
    
    checkAuth : function () {
        gapi.auth.authorize({client_id: googleBlog.clientId, scope: googleBlog.scopes, immediate: true}, 
                googleBlog.handleAuthResult);
    },
    handleAuthResult : function (authResult) {
        var authorizeButton = document.getElementById('authorize-button');
        if (authResult && !authResult.error) {
            authorizeButton.style.visibility = 'hidden';
            //makeApiCall();
        } else {
            authorizeButton.style.visibility = '';
            authorizeButton.onclick = googleBlog.handleAuthClick;
        }
    },
    handleAuthClick : function (event) {
         // 步驟3: 通過授權以存取資料
         gapi.auth.authorize({client_id: googleBlog.clientId, scope: googleBlog.scopes, 
             immediate: false}, googleBlog.handleAuthResult);
        return false;
    },
    addPost : function(event) {
        event.preventDefault();
        
        var blogIdVal = googleBlog.blogId;              
        var blogTitle = $('input[name=blogTitle]').val();
        
        var blogContent = tinyMCE.get('blog_content').getContent({format : 'raw'});
        blogContent = blogContent.replace(/(?:\r\n|\r|\n)/g, '');
        blogContent = parseHTML(blogContent).getElementsByTagName('body')[0].innerHTML;             
        var save_data = JSON.stringify(blogContent); //以JSON字串存入
            
        var formData = {'blogId': blogIdVal, fetchBody : true, fetchImages : true,
            isDraft : true, 'title': blogTitle,'content':save_data};
        var request = gapi.client.blogger.posts.insert(formData);
        request.execute(function(response) {
            console.log(response);
            if (response.id) {
                $('#modal-body-msg').text("文章上傳至google blog完成(草稿)，文章編號:" + response.id);
                $('#messageModal').modal('show');    
            } else {
                $('#modal-body-msg').text("文章上傳至google blog失敗");
                $('#messageModal').modal('show');
            }
        });  
    }
}

上傳文章，我將其預設值用成"草稿"，須按"發佈"Button後才會對外發佈