Google应用脚本，说明如何根据从其电子表格的html表单接收的数据创建pdf并通过电子邮件发送pdf文件 [英] Google app script on how to create a pdf from the data received from an html form of its spreadsheet and send the pdf file via email

查看：104
本文介绍了Google应用脚本，说明如何根据从其电子表格的html表单接收的数据创建pdf并通过电子邮件发送pdf文件的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

关于如何从电子表格的html表单接收的数据中创建pdf并通过电子邮件发送pdf文件的Google应用程序脚本-我想通过自定义html从工作表中记录的数据创建pdf文件表格

Google app script on how to create a pdf from the data received from an html form of your spreadsheet and send the pdf file via email - I would like to create a pdf file from the data recorded on the worksheet via a custom html form

我有一个带有电子邮件发送功能的简单html表单

I have a simple html form with email sending

这是索引html FORM文件: 

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
      function submitForm(form) {
        google.script.run
        .withSuccessHandler(function(value){
          document.getElementById('message').innerHTML = value;
          document.getElementById('name').value = '';
          document.getElementById('email').value = '';
          document.getElementById('comment').value = '';
        }) 
        .submitData(form);
      }
    </script>
    <?!= include("css");?>
  </head>
  <body>
    <h2>Feedback Form</h2>
    <div id="message"></div>

    <br /><input id="button-responder" style="display:none;" type ="button" onclick="submitResponder();" value = "Nuova iscrizione">

    <form id="my-form">
    <br /><input id="name" type="text" name="name" placeholder="Your Name">
    <br /><input id="email" type="email" name="email" placeholder="Your Email">
    <br /><textarea id="comment" rows="10" cols="40" name="comment"></textarea>
    <br /><input id="btn" type="button" value="Submit" onclick="submitForm(this.parentNode),document.getElementById('my-form').style.display='none',submitResponder('button-responder');" />
  </form>
  <?!= include("test-js");?>  
  </body>
</html>

此Google脚本的别名电子邮件:

this Google Script with alias email:

function doGet(request) {
  return HtmlService.createTemplateFromFile('index')
      .evaluate();//not all caps but it has to match the name of the file and it doesn't - Change to PAGE
}

function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename)
      .getContent();
}


function submitData(form) {
  
  var subject='New Feedback';
  var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);

  var aliases = GmailApp.getAliases()
   Logger.log(aliases); //returns the list of aliases you own
   Logger.log(aliases[0]); //returns the alias located at position 0 of the aliases array

  GmailApp.sendEmail('my-email@my-email.com','From an alias', 'A message from an alias!', {'from': aliases[0],subject: subject,htmlBody: body});

  return Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);

  
}


function userClicked(userInfo){
    var url = "https://docs.google.com/spreadsheets/x/xx-xx-xxx_-xxxxxxxxxx-xxxx/edit#gid=x";
    var ss = SpreadsheetApp.openByUrl(url);
    var ws = ss.getSheetByName("Data");
    ws.appendRow([userInfo.name, userInfo.email, userInfo.comment]);
}

这是自定义javascript文件("test-js"):

this is custom javascript file ("test-js"):

<script>

function submitResponder() {
  var x = document.getElementById("button-responder");
  var xx = document.getElementById("my-form");
  var xxx = document.getElementById("message");
  if (x.style.display === "none") {
    x.style.display = "block";
    xx.style.display = "none";
    xxx.style.display = "block";
  } else {
    x.style.display = "none";
    xx.style.display = "block";
    xxx.style.display = "none";
  }
}


document.getElementById("btn").addEventListener("click",doStuff);
  
  function doStuff(){
   var userInfo = {}
   userInfo.name = document.getElementById("name").value;
   userInfo.email = document.getElementById("email").value;
   userInfo.comment = document.getElementById("comment").value;
   
   google.script.run.userClicked(userInfo);
   document.getElementById("name").value= "";
   document.getElementById("email").value= "";
   document.getElementById("comment").value= "";   
  
}
</script>

这是一个简单的CSS样式文件("css"):

this is a simply css style file ("css"):

<style>

#message {
 color: red;
}

</style>

我正在寻找一个公式，通过获取在表单中输入的数据并通过电子邮件发送来创建pdf文件. 该文件必须在驱动器中的特定文件夹/子文件夹中创建. 文件名必须重播在表单上编辑的名称"字段.

I'm looking for a formula to create a pdf file by taking the data entered in the forms and send it by email. The file must be created in a specific folder / subfolder in drive. The name of the file must replay the "name" field edited on the form.

现在最重要的部分. 我希望pdf文件的链接仅显示在html页面上，而不显示在电子邮件中， 如下例所示:

Now the most important part. I would like the link of the pdf file to appear only on the html page and not in the email, as shown in the example below:

return Utilities.formatString ('name:% s <br /> Email:% s <br /> Comment:% s', form.name, form.email, form.comment)
link to PDF file

提前感谢您的帮助！

新问题！

关于下面描述的功能:

function submitData(form) {
  var subject='New Feedback';
  var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);

  var folderId = "my-folder-ID"; // Please set the folder ID.  // Added
  var blob = Utilities.newBlob(body, MimeType.HTML, form.name).getAs(MimeType.PDF);  // Added
  var file = DriveApp.getFolderById(folderId).createFile(blob);  // Added

  var aliases = GmailApp.getAliases()
   Logger.log(aliases); //returns the list of aliases you own
   Logger.log(aliases[0]); //returns the alias located at position 0 of the aliases array

  GmailApp.sendEmail('my-email@my-email.com','From an alias', 'A message from an alias!', {'from': aliases[0],subject: subject,htmlBody: body, attachments: [blob]});  // Modified

//  return file.getUrl();  // Modified
  return Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s<br />PDF: %s', form.name,form.email,form.comment,file.getUrl());
}

我正在寻找一种试图以以下功能返回的通用测试格式:请查看您的PDF文件"，而不是网址:

I am looking for I'm trying to return in a generic test format of the type "see your PDF file" clickable, instead of the URL address, in the function:

return Utilities.formatString ('name:% s <br /> Email:% s <br /> Comment:% s <br /> PDF:% s', form.name, form.email, form.comment, file. getUrl ());

我希望我可以使用基本文档作为模板来创建类似于以下内容的PDF文件: https://jeffreyeverhart.com /2018/09/17/auto-fill-google-doc-from-google-form-submission/ 请记住，从上方可以看到，我的应用程序是自定义html表单.

I wish I could use a basic document as a template for the style of creating the PDF file similar to this: https://jeffreyeverhart.com/2018/09/17/auto-fill-google-doc-from-google-form-submission/ Keep in mind that my application is a custom html form as you can see from the place above.

提前感谢您的帮助！

推荐答案

  • 您要将var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);转换为PDF文件.
  • 您要将创建的PDF文件放入Google云端硬盘中的特定文件夹.
  • 您要将创建的PDF文件作为附件发送.
  • 您要检索创建的PDF文件的URL，并将其返回到HTML端.
  • 您的问题与电子表格无关.

    • You want to convert var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment); as a PDF file.
    • You want to put the created PDF file to the specific folder in Google Drive.
    • You want to send the created PDF file as an attachment file.
    • You want to retrieve the URL of created PDF file and return it to HTML side.
    • Your question is unrelated to Spreadsheet.

      • 我可以像上面那样理解.如果我的理解是正确的，那么这个答案呢?请认为这只是几个可能的答案之一.

      I could understand like above. If my understanding is correct, how about this answer? Please think of this as just one of several possible answers.

      • 对于您而言，我认为可以通过在Google Apps脚本端修改submitData()来实现您的目标.
      • 按下按钮时，从var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);创建PDF数据.并创建PDF数据作为文件.
      • In your case, I think that your goal can be achieved by modifying submitData() at Google Apps Script side.
      • When the button is pushed, create a PDF data from var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);. And create the PDF data as the file.

      请如下修改submitData().请将文件夹ID设置为var folderId = "###".

      Please modify submitData() as follows. Please set the folder ID to var folderId = "###".

      function submitData(form) {
  var subject='New Feedback';
  var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);

  var folderId = "###"; // Please set the folder ID.  // Added
  var blob = Utilities.newBlob(body, MimeType.HTML, form.name).getAs(MimeType.PDF);  // Added
  var file = DriveApp.getFolderById(folderId).createFile(blob);  // Added

  var aliases = GmailApp.getAliases()
   Logger.log(aliases); //returns the list of aliases you own
   Logger.log(aliases[0]); //returns the alias located at position 0 of the aliases array

  GmailApp.sendEmail('my-email@my-email.com','From an alias', 'A message from an alias!', {'from': aliases[0],subject: subject,htmlBody: body, attachments: [blob]});  // Modified

  return file.getUrl();  // Modified
}

      注意:

      • 如果要修改PDF文件的样式，请修改var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);中的name: %s <br />Email: %s<br />Comment: %s.在这种情况下，您可以使用HTML.
      • 根据情况，可能需要共享创建的PDF文件.

        • Note:

        • If you want to modify the style of PDF file, please modify name: %s <br />Email: %s<br />Comment: %s of var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);. You can use HTML in this case.
        • By the situation, it might be required to share the created PDF file.

          • Class Utilities
          • Class DriveApp
          • getAs(contentType)

          这篇关于Google应用脚本，说明如何根据从其电子表格的html表单接收的数据创建pdf并通过电子邮件发送pdf文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆