Login/Register
Download a created Google Doc from a deployed web app
Asked Answered
Solved google-apps-scriptweb-applicationsdownloadgoogle-docsexport-to-pdf
P

1

0

I've created a script that, when deployed as a web app, asks the user for some input, and creates and writes to a Google document.

Apparently, downloading the Google document from the script is not possible, and the next best thing seems to convert the doc and save it in My Drive.

I have tried this very simple approach, inspired by Convert Google Doc to PDF using Google Script Editior

Project is deployed as a web app

Code.gs:

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index');
}

function editDoc(data) {
  let doc = DocumentApp.create("Title");
  let body = doc.getBody();
  body.setText(data);
  
  docblob = doc.getAs('application/pdf');

  docblob.setName(doc.getName() + ".pdf");
  let file = DriveApp.createFile(docblob);
}

Index.html:

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <form onsubmit="edit()">
      <input type="text" id="input">
      <input type="submit" id="sub" value="Submit">
    </form>
    <script>
      function edit() {
        google.script.run.editDoc(document.getElementById("input").value);
      }
    </script>
  </body>
</html>

As a result, this adds a pdf to my google drive, which should be the pdf form of the created google doc, however it is blank.

Papule answered 9/11, 2020 at 21:4 Comment(3)
About your question of I've created a script that, when deployed as a web app, asks the user for some input, and creates and writes to a google doc. I want to download this created doc from the web app. Is this possible, if so, how?, unfortunately, in the current stage, Google Document cannot be directly downloaded. It seems that this is the current specification at Google side. If you want to download the Google Document, it is required to convert to DOCX format and PDF format. I apologize for this. – Fuji
Welcome to Stack Overflow. Your question should be a bit more specific. As Tanaike explained in the previous comment Google documents are online only files but they can be converted in order to be downloaded. If you need further help, please add a brief description of your search/research efforts as is suggested in How to Ask. – Mistake
Please add a minimal reproducible example. Also edit your question to improve it's readability. Note: You don't have to label yours edits (i.e. prepending EDIT or something like that) as the questions and answers have a revision history and a last edited indicator. – Mistake
F
1

I believe your goal as follows.

  • You want to create new Google Document including the value from the input tag.
  • And, you want to export the Google Document as a PDF file.
  • You want to achieve this using Google Apps Script.

Modification points:

  • I think that the reason of however it is blank is that the Document is not saved.
  • In order to download the PDF file, I would like to propose to convert the PDF data to the base64 data and set it as the data URL, and then, download it.

When above points are reflected to your script, it becomes as follows.

Modified script:

Google Apps Script side: Code.gs 
function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index');
}

function editDoc(data) {
  let doc = DocumentApp.create("Title");
  let body = doc.getBody();
  body.setText(data);
  doc.saveAndClose();
  return {
    data: "data:application/pdf;base64," + Utilities.base64Encode(doc.getBlob().getBytes()),
    filename: doc.getName() + ".pdf"
  };
}
HTML & Javascript side: Index.html 
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <form onsubmit="event.preventDefault(); edit();">
      <input type="text" id="input">
      <input type="submit" id="sub" value="Submit">
    </form>
    <script>
      function edit() {
        google.script.run.withSuccessHandler(({data, filename}) => {
          const a = document.createElement("a");
          document.body.appendChild(a);
          a.download = filename;
          a.href = data;
          a.click();
        }).editDoc(document.getElementById("input").value);
      }
    </script>
  </body>
</html>
  • I thought that in this case, a simple button can be also used instead of the submit button.
  • In the case of Google Docs, when a blog is retrieved, in the current stage, the blob is the PDF format.
  • In this modified script, when a text is inputted and a button is clicked, a PDF file is downloaded to the local PC.

Note:

  • In your script, it seems that Web Apps is used. In this case, when the script of Web Apps is modified, please redeploy the Web Apps as new version. By this, the latest script is reflected to the Web Apps. Please be careful this.

References:

Fuji answered 10/11, 2020 at 2:17 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.