Google 表单文件上传 - 如何使用表单提交的图片并将其嵌入到电子邮件中
Google Forms File upload - How to use image submitted by form and embed it in an email
我有点卡在一个项目上,需要一些帮助。
AIM:我正在尝试提交一份包含各种数据和图像的 google 表格。
然后将使用表单数据触发 HTML 电子邮件并嵌入图像。
到目前为止,除了嵌入图片,我什么都能做。
这是我目前所拥有的。
code.gs
function getData() {
var sh = SpreadsheetApp.getActive()
.getSheetByName('Form responses 1');
return sh.getRange(sh.getLastRow(), 1, 1, sh.getLastColumn())
.getValues()[0]
}
function testEmail() {
var htmlBody = HtmlService
.createTemplateFromFile('mail_template')
.evaluate()
.getContent();
var mailADdy = "myemail@email.co.uk";
MailApp.sendEmail({
to:mailADdy,
subject: 'Test Email markup - ' + new Date(),
htmlBody: htmlBody,
});
}
mail_template.html
<!DOCTYPE html>
<html>
<head>
<style>
@media only screen and (max-device-width: 480px) {
/* mobile-specific CSS styles go here */
}
</style>
</head>
<body>
<? var data = getData(); ?>
<? var first = data[2]; ?>
<? var second = data[3]; ?>
<? var third = data[4]; ?>
<? var fourth = data[5]; ?>
/* imageUpload var is the link to the image that's been uploaded, in "https://drive.google.com/open?id=ID" format"*/
<? var imageUpload = data[6]; ?>
/* Below are some things that I've tried and failed */
<? var imageID = imageUpload.replace("https://drive.google.com/open?id=","");?>
<? var imageBlob = UrlFetchApp.fetch(imageUpload).getBlob().setName("imageBlob");?>
<? var imageBlob = DriveApp.getFileById(imageID).getBlob();?>
<div class="main">
<p style="text-align: center;"><strong>This is a test HTML email.</strong></p>
<table style="margin-left: auto; margin-right: auto;">
<tbody>
<tr>
<td style="text-align: left;">First question to be put here</td>
<td style="text-align: right;"><strong><?= first ?></strong> </td>
</tr>
<tr>
<td style="text-align: left;">Second question here</td>
<td style="text-align: right;"><?= second ?></td>
</tr>
<tr>
<td style="text-align: left;">Third question here</td>
<td style="text-align: right;"><?= third ?></td>
</tr>
<tr>
<td style="text-align: left;">Image Upload test</td>
<td style="text-align: right;"><?= imageUpload ?></td>
</tr>
</tbody>
</table>
<p></p>
<p style="text-align: center;"><img src="https://imageurl.com" alt="Logo" /></p>
</div>
</body>
</html>
getData函数returns我的最后一行数据sheet(这将是最近提交的表单)
testEmail 发送电子邮件。
mail_template 包含电子邮件的 HTML。布局等
通过使用 scriplet,我可以将表单值放入电子邮件中并发送出去。
然而,无论我对图像做了什么尝试,我都无法正确处理。
当我尝试在 HTML 文件中使用以下脚本时,
<? var imageBlob = UrlFetchApp.fetch(imageUpload).getBlob().setName("imageBlob");?>
我收到以下错误。
执行失败:您没有调用 fetch 的权限
我也试过:
<? var imageBlob = DriveApp.getFileById(imageID).getBlob();?>
但还是不行。
我确实尝试遵循此 link 中的信息,
但无法将其转化为我的示例,因为他们没有使用单独的 HTML 文件
感谢任何help/pointers。
首先,您得到的错误是因为您从未授予 GAS 访问 UrlFetch 或 DriveApp 的权限。这似乎违反直觉,但如果您只查看 GAS 脚本,您会发现您从未在 GAS 端调用这些函数。因此,当您 运行 GAS 脚本时,编译器永远不会看到对 UrlFetch 或 DriveApp 的调用。因此,不征求您的同意 运行 它。但是,在 运行 时间内,评估方法尝试访问这些方法,但授权失败。
这可以通过在 GAS 端使用虚拟函数来调用此函数来解决。像这样
function dummyFunction(){
DriveApp.getRootFolder()
UrlFetchApp.fetch("www.google.com")
}
你永远不需要运行这些函数,但在编译过程中,它会要求对这些方法进行授权。因此,当你运行你的评估方法时,授权不会有问题。
其次, 如 所述引入内联图像,您不必在 HTML 端获取 imageBlob。您将需要获得一个 GAS 脚本。您只需像这样在 html 页面上包含一个 img 标签。
<tr>
<td style="text-align: left;">Image</td>
<td style="text-align: right;"><img src ="cid:imageKey"/></td>
</tr>
在 GAS 上,您将像这样修改代码:
function testEmail() {
var htmlBody = HtmlService
.createTemplateFromFile('mail_template')
.evaluate()
.getContent();
var mailADdy = "myemail@email.co.uk";
var data = getData()
var imageUpload = data[6];
var imageID = imageUpload.replace("https://drive.google.com/open?id=","")
// Use one of the below method to get the imageBloB
var imageBlob = UrlFetchApp.fetch(imageUpload).getBlob().setName("imageBlob")
//var imageBlob = DriveApp.getFileById(imageID).getBlob()
MailApp.sendEmail({
to:mailADdy,
subject: 'Test Email markup - ' + new Date(),
htmlBody: htmlBody,
inlineImages:
{
imageKey: imageBlob,
}
});
}
如果您使用此技术,则不必在 html 页面上调用 urlFetch 或 DriveApp,并且可以删除这些 scriptlet 行。
我有点卡在一个项目上,需要一些帮助。
AIM:我正在尝试提交一份包含各种数据和图像的 google 表格。 然后将使用表单数据触发 HTML 电子邮件并嵌入图像。
到目前为止,除了嵌入图片,我什么都能做。
这是我目前所拥有的。
code.gs
function getData() {
var sh = SpreadsheetApp.getActive()
.getSheetByName('Form responses 1');
return sh.getRange(sh.getLastRow(), 1, 1, sh.getLastColumn())
.getValues()[0]
}
function testEmail() {
var htmlBody = HtmlService
.createTemplateFromFile('mail_template')
.evaluate()
.getContent();
var mailADdy = "myemail@email.co.uk";
MailApp.sendEmail({
to:mailADdy,
subject: 'Test Email markup - ' + new Date(),
htmlBody: htmlBody,
});
}
mail_template.html
<!DOCTYPE html>
<html>
<head>
<style>
@media only screen and (max-device-width: 480px) {
/* mobile-specific CSS styles go here */
}
</style>
</head>
<body>
<? var data = getData(); ?>
<? var first = data[2]; ?>
<? var second = data[3]; ?>
<? var third = data[4]; ?>
<? var fourth = data[5]; ?>
/* imageUpload var is the link to the image that's been uploaded, in "https://drive.google.com/open?id=ID" format"*/
<? var imageUpload = data[6]; ?>
/* Below are some things that I've tried and failed */
<? var imageID = imageUpload.replace("https://drive.google.com/open?id=","");?>
<? var imageBlob = UrlFetchApp.fetch(imageUpload).getBlob().setName("imageBlob");?>
<? var imageBlob = DriveApp.getFileById(imageID).getBlob();?>
<div class="main">
<p style="text-align: center;"><strong>This is a test HTML email.</strong></p>
<table style="margin-left: auto; margin-right: auto;">
<tbody>
<tr>
<td style="text-align: left;">First question to be put here</td>
<td style="text-align: right;"><strong><?= first ?></strong> </td>
</tr>
<tr>
<td style="text-align: left;">Second question here</td>
<td style="text-align: right;"><?= second ?></td>
</tr>
<tr>
<td style="text-align: left;">Third question here</td>
<td style="text-align: right;"><?= third ?></td>
</tr>
<tr>
<td style="text-align: left;">Image Upload test</td>
<td style="text-align: right;"><?= imageUpload ?></td>
</tr>
</tbody>
</table>
<p></p>
<p style="text-align: center;"><img src="https://imageurl.com" alt="Logo" /></p>
</div>
</body>
</html>
getData函数returns我的最后一行数据sheet(这将是最近提交的表单) testEmail 发送电子邮件。
mail_template 包含电子邮件的 HTML。布局等
通过使用 scriplet,我可以将表单值放入电子邮件中并发送出去。
然而,无论我对图像做了什么尝试,我都无法正确处理。
当我尝试在 HTML 文件中使用以下脚本时,
<? var imageBlob = UrlFetchApp.fetch(imageUpload).getBlob().setName("imageBlob");?>
我收到以下错误。
执行失败:您没有调用 fetch 的权限
我也试过:
<? var imageBlob = DriveApp.getFileById(imageID).getBlob();?>
但还是不行。
我确实尝试遵循此 link 中的信息,
但无法将其转化为我的示例,因为他们没有使用单独的 HTML 文件
感谢任何help/pointers。
首先,您得到的错误是因为您从未授予 GAS 访问 UrlFetch 或 DriveApp 的权限。这似乎违反直觉,但如果您只查看 GAS 脚本,您会发现您从未在 GAS 端调用这些函数。因此,当您 运行 GAS 脚本时,编译器永远不会看到对 UrlFetch 或 DriveApp 的调用。因此,不征求您的同意 运行 它。但是,在 运行 时间内,评估方法尝试访问这些方法,但授权失败。
这可以通过在 GAS 端使用虚拟函数来调用此函数来解决。像这样
function dummyFunction(){
DriveApp.getRootFolder()
UrlFetchApp.fetch("www.google.com")
}
你永远不需要运行这些函数,但在编译过程中,它会要求对这些方法进行授权。因此,当你运行你的评估方法时,授权不会有问题。
其次, 如
<tr>
<td style="text-align: left;">Image</td>
<td style="text-align: right;"><img src ="cid:imageKey"/></td>
</tr>
在 GAS 上,您将像这样修改代码:
function testEmail() {
var htmlBody = HtmlService
.createTemplateFromFile('mail_template')
.evaluate()
.getContent();
var mailADdy = "myemail@email.co.uk";
var data = getData()
var imageUpload = data[6];
var imageID = imageUpload.replace("https://drive.google.com/open?id=","")
// Use one of the below method to get the imageBloB
var imageBlob = UrlFetchApp.fetch(imageUpload).getBlob().setName("imageBlob")
//var imageBlob = DriveApp.getFileById(imageID).getBlob()
MailApp.sendEmail({
to:mailADdy,
subject: 'Test Email markup - ' + new Date(),
htmlBody: htmlBody,
inlineImages:
{
imageKey: imageBlob,
}
});
}
如果您使用此技术,则不必在 html 页面上调用 urlFetch 或 DriveApp,并且可以删除这些 scriptlet 行。