捕获API响应并将其上传到云端硬盘

时间:2017-05-18 18:17:58

标签: ajax http google-apps-script google-drive-api

我有一个使用Google Apps脚本构建的网络应用,它使用外部API服务将html网页转换为整洁的PDF文件,并将其下载到用户的本地计算机上 - 没有任何问题。

现在我需要接受该响应(PDF文件)并使用驱动器文件夹ID将其上传到Drive上的特定文件夹。

我的问题是尝试捕获该API响应对象。我在一个单独的Web应用程序中使用不同的html-to-pdf API完成了这项工作,因此我知道我的大部分代码都是合理的。但我没有正确捕捉那个物体。也许有一种Google Apps脚本方法可以让这更容易,但我无法弄明白。

奇怪的是,在Google Apps脚本中运行Drive API的文档是不存在的。

请为gawd的爱,帮助编码器!

**

Code.gs

**

/**
 * Special function that handles HTTP GET requests to the published web app.
 * @return {HtmlOutput} The HTML page to be served.
 */
function doGet(e) {
    var requestedId = e.parameter.zoho_id;
    var templ = HtmlService.createTemplateFromFile('Allied-po');
    templ.data = requestRecordFromCRM(requestedId);
    return templ.evaluate()
        .setTitle('Purchase Order')
        .setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

/* Upload PDF to specified Google Drive Folder */
function doSomethingForTheLoveOfGawd(strString){
   var obj = JSON.parse(strString)
   strDataURI=obj.str.replace("data:application/pdf;base64,", ""); 

   var str = Utilities.base64Decode(strDataURI); 
   var fileBlob = Utilities.newBlob(str).setContentType('application/pdf').setName("Purchase-Order.pdf");
   var file =  DriveApp.createFile(fileBlob) 
   DriveApp.getFolderById(obj.id).createFile(fileBlob)
   //hard-coded drive id# example:
   //    DriveApp.getFolderById('1pT_92oTwT0IKJi2WhhGfLHOgb-nZdaET').createFile(fileBlob)
}

/*Fetch Drive Folder ID from Zoho CRM API*/
function requestRecordFromCRM(requestedId) {
    //var requestedId = '392848000035649133';
    var authToken = 'XXXXXXXXXX';
    var zohoRequestUrl = 'https://crm.zoho.com/crm/private/json/Potentials/getRecordById?&authtoken=' + authToken + '&scope=crmapi&id=' + requestedId;
    var response = UrlFetchApp.fetch(zohoRequestUrl);
    var sanitizedResponse = (response.getContentText());
    var output = JSON.parse(sanitizedResponse);
    Logger.log(output);
    var parsedOutput = output.response.result.Potentials.row.FL;
    var recordObj = {}

    /*Assign Drive folder id to a variable*/
    for (var i = 0; i < output.response.result.Potentials.row.FL.length; i++) {
      Logger.log(output.response.result.Potentials.row.FL[i].val+" ==== "+output.response.result.Potentials.row.FL[i].content);
      var fl=output.response.result.Potentials.row.FL[i];
      if (fl.val == 'Drive Folder ID') {recordObj.driveFolderId = fl.content;}
    }
  return (recordObj);
}

function fixinput(input) {  
  Logger.log(input);
  return input;
} 

**

Javascript.html

**

<!-- jQuery, jQuery UI, and Bootstrap js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<!-- Load Gdrive resource to save to record drive -->
<script src="https://apis.google.com/js/platform.js" async defer></script>

<script>
//API Call - Convert HTML to PDF file and stores on local machine
    function call() {
        urltoconvert = "https://pdflayer.com/documentation";
        authkey = "XXXXXX";
        html1 = document.getElementById("printPage").innerHTML;
        url = "http://api.pdflayer.com/api/convert" +
            "?access_key=" + authkey +
            "&document_name=Purchase_Order.pdf" +
            "&page_size=A4" +
            "&css_url=https://s3-us-west-2.amazonaws.com/www.fortlauderdaletech.org/postyles.css";
        paramkey = "document_html";
        submitpost(url, "post", paramkey, html1);

        doc = //the object/PDF file returned by pdflayer API;
        doc.save('allied-po-demo.pdf');
        var blob = doc.output('datauri');
        var obj = { id: driveFolderId, str:blob };
        google.script.run.doSomethingForTheLoveOfGawd(JSON.stringify(obj));
    }

    function myajax(url, success1, fail1) {
        var xhttp;
        xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                success1(this.responseText);
            } else {
                alert(this.readyState + "," + this.status);
                fail1(url);
            }
        };
        xhttp.open("GET", url, true);
        xhttp.send();
    }

    function submitpost(path, method, paramkey, htmlcontent) {
        method = method || "post";

        var form = document.createElement("form");
        form.setAttribute("method", method);
        form.setAttribute("action", path);

        var hiddenField = document.createElement("input");
        hiddenField.setAttribute("type", "hidden");
        hiddenField.setAttribute("name", paramkey);
        hiddenField.setAttribute("value", htmlcontent);

        form.appendChild(hiddenField);
        document.body.appendChild(form);
        form.submit();
    }

function ajaxposttest(success1,fail1) {

    authkey = "XXXXXX";

    html1 = document.getElementById("printPage").innerHTML;
    url = "http://api.pdflayer.com/api/convert" ;

    paramkey = "document_html";
    //  alert(html1);
    var xhttp;
    xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            //  console.log("responsetextajax="+this.responseText);
            success1(this.responseText);
        } else {
            alert("readystate="+this.readyState + ",status=" + this.status+",resptext="+this.responsetext);
            fail1(url);
        }
    };
    xhttp.open("get", url, true);

    params=encodeURI("?access_key=" + authkey +
        "?access_key=" + authkey +
        "&document_name=Purchase_Order.pdf" +
        "&page_size=A4" +
        "&css_url=https://s3-us-west-2.amazonaws.com/www.fortlauderdaletech.org/postyles.css&"+
        paramkey+"="+html1
        );

   //Send proper header info with request
   alert(params);
   xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   xhttp.send(params);
   alert("2");
}

    function myajaxpost(url, params, success1, fail1) {
        var xhttp;
        xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                success1(this.responseText);
            } else {
                alert(this.readyState + "," + this.status);
                fail1(url);
            }
        };
        xhttp.open("POST", url, true);

        //Send proper header info with request
        xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhttp.send(params);
    }

    function succ(resp) {
        var pdfWin = window.open("" + resp, '', 'height=650,width=840');
    }

    function fail(resp) {}
</script>

**

联合-po.html

**

<!DOCTYPE html>
<html>
    <head>
        <base target="_blank">
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Convert and Save to Drive</title>
        <?!= HtmlService.createHtmlOutputFromFile('Stylesheet').getContent(); ?>
    </head>
    <body>
        <div id="printPage">
            <!-- Page 1 -->
            <section class="container">
                <section class="content">
                    <section class="post">
                        <div id="page1">
                            <section class="page1">
                                <div class="row">
                                    <div class="col-md-12">
                                      <form>
                                          <h3>Allied Contact</h3>
                                          <label>Drive Id Number</label>
                                          <input value="<?= data.driveFolderId ?>">
                                      </form>
                                    </div>
                                </div>
                            </section>
                        </div>
                        <p id="page_number">- 1 -</p>
                    </section>
                </section>
            </section>
        </div>
        <div class="text-center center-block">
            <button  class="btn btn-primary shadow hide-on-pdf" id="callbtn" onclick="call()" type="button">PDF Document  &#9996;</button>
            <p>Click to save as a PDF on your computer and send a copy<br/>
                to the Google Drive folder associated with this building.
            </p>
        <div>
        <?!= HtmlService.createHtmlOutputFromFile('Javascript').getContent(); ?>
    </body>
</html>
<script>var driveFolderId="<?= data.driveFolderId ?>"</script>

1 个答案:

答案 0 :(得分:1)

所以不要从你的Javascript(客户端)调用你的Api,而是使用UrlFetch在服务器端这样做

f:validateRegex

然后,您可以使用function convert(html) { var urltoconvert = "https://pdflayer.com/documentation"; var authkey = "XXXXXX"; var url = "http://api.pdflayer.com/api/convert" + "?access_key=" + authkey + "&document_name=Purchase_Order.pdf" + "&page_size=A4" + "&css_url=https://s3-us-west-2.amazonaws.com/www.fortlauderdaletech.org/postyles.css"; var payload = { "document_html": html } var options = { "method" : "POST", payload : payload } var response = UrlFetchApp.getRequest(url,options) doSomethingForTheLoveOfGawd(response) return JSON.stringify(response) } 功能

处理对云端硬盘文件的回复

要在客户端下载文件,请将响应传递回客户端并使用doSomethingForTheLoveOfGawd处理返回的数据

注意我不确定API的响应结构,所以这是通用代码。根据需要修改

.withSuccessHandler