Html 从WEB表单将图像上载到Google电子表格

所以基本上 它从谷歌表单自动生成的脚本。我找不到一个链接或任何可以帮助我调整它的东西，这样我就可以从我的网站上传一张图片。它只发送图像名称，而不发送实际图像。 如果有人能告诉我如何调整它，这样它就能发送真实的图像，我会非常高兴

<input type="text" id="email" name="email:" placeholder="">
 <input type="file" id="myFile" name="filename">
                    
 <button>
   Send
</button>

//如果要在服务器端（隐藏）存储电子邮件，请取消对下一行的注释
var TO_ADDRESS=“***@gmail.com”；
//以HTML格式将表单中的所有键/值吐出以发送电子邮件
//使用键数组（如果提供）或对象来确定字段顺序
函数formatMailBody（对象、订单）{
var结果=”；
如果（！订单）{
顺序=对象键（obj）；
}
//循环遍历有序表单数据中的所有键
对于（顺序中的变量idx）{
var key=订单[idx]；
结果+=“”+key+“”+sanitizeInput（obj[key]）+“”；
//对于每个键，连接键名及其值的`/``对，
//并将其附加到开头创建的'result'字符串中。
}
return result；//循环完成后，`result`将是一个长字符串，放在电子邮件正文中
}
//清理来自用户的内容-不信任任何人
//参考：https://developers.google.com/apps-script/reference/html/html-output#appendUntrusted（字符串）
函数sanitizeInput（rawInput）{
var placeholder=HtmlService.createHtmlOutput（“”）；
占位符.appendUntrusted（rawInput）；
返回占位符.getContent（）；
}
函数doPost（e）{
试一试{
Logger.log（e）；//console.log的Google脚本版本请参阅：Class Logger
记录数据（e）；
//表单数据的较短名称
var mailData=e.parameters；
//表单元素的名称和顺序（如果已设置）
var orderParameter=e.parameters.formDataNameOrder；
var数据顺序；
if（orderParameter）{
dataOrder=JSON.parse（orderParameter）；
}
//确定电子邮件的接收日期
//如果你的邮件上面没有注释，它会使用“收件人”地址`
//否则，它默认为表单的数据属性提供的电子邮件
var sendmailto=（typeof TO_ADDRESS！=“未定义”）？TO_ADDRESS:mailData.formgooglesendmail；
//如果设置了收件人地址，则发送电子邮件
如果（发送电子邮件至）{
MailApp.sendmail({
收件人：字符串（sendEmailTo），
主题：“已提交联系表”，
//replyTo:String（mailData.email），//这是可选的，依赖于您的表单实际收集的名为`email'的字段`
htmlBody:formatMailBody（mailData、dataOrder）
});
}
return ContentService//return json成功结果
.createTextOutput(
stringify（{“result”：“success”，
“数据”：JSON.stringify（e.parameters）}）
.setMimeType（ContentService.MimeType.JSON）；
}catch（error）{//if error返回此
Logger.log（错误）；
返回内容服务
.createTextOutput（JSON.stringify（{“结果”：“错误”，“错误”：错误}））
.setMimeType（ContentService.MimeType.JSON）；
}
}
/**
*record_data插入从html表单提交中接收的数据
*e是从邮局收到的数据
*/
功能记录\u数据（e）{
var lock=LockService.getDocumentLock（）；
lock.waitLock（30000）；//延迟30秒以避免并发写入
试一试{
Logger.log（JSON.stringify（e））；//记录POST数据，以防我们需要调试它
//默认情况下，选择“响应”表
var doc=SpreadsheetApp.getActiveSpreadsheet（）；
var sheetName=e.parameters.formGoogleSheetName | |“响应”；
var sheet=doc.getSheetByName（sheetName）；
var oldHeader=sheet.getRange（1,1,1，sheet.getLastColumn（））.getValues（）[0]；
var newHeader=oldHeader.slice（）；
var fieldsFromForm=getDataColumns（例如参数）；
var row=[new Date（）]；//行中的第一个元素应始终是时间戳
//循环浏览标题列
对于（var i=1；i-1）{
字段形式拼接（formIndex，1）；
}
}
//在表单中设置任何新字段
对于（变量i=0；ioldHeader.length）{
sheet.getRange（1,1,1，newHeader.length）.setValues（[newHeader]）；
}
}
捕获（错误）{
Logger.log（错误）；
}
最后{
锁。释放锁（）；
返回；
}
}
函数getDataColumns（数据）{
返回对象.键（数据）.过滤器（函数（列）{
return！（column==='formDataNameOrder'| | column=='formGoogleSheetName'| | | column=='formGoogleSendEmail'| | column=='='honeypot'）；
});
}
函数getFieldFromData（字段，数据）{
var值=数据[字段]| |“”；
var output=values.join？values.join（'，'）：值；
返回输出；
}```

在应用程序脚本web应用程序中，为了将文件输入数据从HTML表单发送到服务器，建议通过调用服务器端函数。在这种情况下，您不会依赖于

doPost

函数（当对web应用程序URL发出POST请求时调用），而是依赖于通过

google.script.run

调用的服务器端函数（在下面的示例中名为

processForm

）

以这种方式调用服务器端函数时，如果将HTML表单元素作为参数传递

Out put
Email: Someone@gmail.com
FileName: Untitled-1.jpg

// if you want to store your email server-side (hidden), uncomment the next line
 var TO_ADDRESS = "***@gmail.com";

// spit out all the keys/values from the form in HTML for email
// uses an array of keys if provided or the object to determine field order
function formatMailBody(obj, order) {
  var result = "";
  if (!order) {
    order = Object.keys(obj);
  }
  
 
  
  // loop over all keys in the ordered form data
  for (var idx in order) {
    var key = order[idx];
    result += "<h4 style='text-transform: capitalize; margin-bottom: 0'>" + key + "</h4><div>" + sanitizeInput(obj[key]) + "</div>";
    // for every key, concatenate an `<h4 />`/`<div />` pairing of the key name and its value, 
    // and append it to the `result` string created at the start.
  }
  return result; // once the looping is done, `result` will be one long string to put in the email body
}

// sanitize content from the user - trust no one 
// ref: https://developers.google.com/apps-script/reference/html/html-output#appendUntrusted(String)
function sanitizeInput(rawInput) {
   var placeholder = HtmlService.createHtmlOutput(" ");
   placeholder.appendUntrusted(rawInput);
  
   return placeholder.getContent();
 }

function doPost(e) {

  try {
    Logger.log(e); // the Google Script version of console.log see: Class Logger
    record_data(e);
    
    // shorter name for form data
    var mailData = e.parameters;

    // names and order of form elements (if set)
    var orderParameter = e.parameters.formDataNameOrder;
    var dataOrder;
    if (orderParameter) {
      dataOrder = JSON.parse(orderParameter);
    }
    
    // determine recepient of the email
    // if you have your email uncommented above, it uses that `TO_ADDRESS`
    // otherwise, it defaults to the email provided by the form's data attribute
    var sendEmailTo = (typeof TO_ADDRESS !== "undefined") ? TO_ADDRESS : mailData.formGoogleSendEmail;
    
    // send email if to address is set
    if (sendEmailTo) {
      MailApp.sendEmail({
        to: String(sendEmailTo),
        subject: "Contact form submitted",
        // replyTo: String(mailData.email), // This is optional and reliant on your form actually collecting a field named `email`
        htmlBody: formatMailBody(mailData, dataOrder)
      });
    }

    return ContentService    // return json success results
          .createTextOutput(
            JSON.stringify({"result":"success",
                            "data": JSON.stringify(e.parameters) }))
          .setMimeType(ContentService.MimeType.JSON);
  } catch(error) { // if error return this
    Logger.log(error);
    return ContentService
          .createTextOutput(JSON.stringify({"result":"error", "error": error}))
          .setMimeType(ContentService.MimeType.JSON);
  }
}


/**
 * record_data inserts the data received from the html form submission
 * e is the data received from the POST
 */
function record_data(e) {
  var lock = LockService.getDocumentLock();
  lock.waitLock(30000); // hold off up to 30 sec to avoid concurrent writing
  
  try {
    Logger.log(JSON.stringify(e)); // log the POST data in case we need to debug it
    
    // select the 'responses' sheet by default
    var doc = SpreadsheetApp.getActiveSpreadsheet();
    var sheetName = e.parameters.formGoogleSheetName || "responses";
    var sheet = doc.getSheetByName(sheetName);
    
    var oldHeader = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0];
    var newHeader = oldHeader.slice();
    var fieldsFromForm = getDataColumns(e.parameters);
    var row = [new Date()]; // first element in the row should always be a timestamp
    
    // loop through the header columns
    for (var i = 1; i < oldHeader.length; i++) { // start at 1 to avoid Timestamp column
      var field = oldHeader[i];
      var output = getFieldFromData(field, e.parameters);
      row.push(output);
      
      // mark as stored by removing from form fields
      var formIndex = fieldsFromForm.indexOf(field);
      if (formIndex > -1) {
        fieldsFromForm.splice(formIndex, 1);
      }
    }
    
    // set any new fields in our form
    for (var i = 0; i < fieldsFromForm.length; i++) {
      var field = fieldsFromForm[i];
      var output = getFieldFromData(field, e.parameters);
      row.push(output);
      newHeader.push(field);
    }
    
    // more efficient to set values as [][] array than individually
    var nextRow = sheet.getLastRow() + 1; // get next row
    sheet.getRange(nextRow, 1, 1, row.length).setValues([row]);

    // update header row with any new data
    if (newHeader.length > oldHeader.length) {
      sheet.getRange(1, 1, 1, newHeader.length).setValues([newHeader]);
    }
  }
  catch(error) {
    Logger.log(error);
  }
  finally {
    lock.releaseLock();
    return;
  }

}

function getDataColumns(data) {
  return Object.keys(data).filter(function(column) {
    return !(column === 'formDataNameOrder' || column === 'formGoogleSheetName' || column === 'formGoogleSendEmail' || column === 'honeypot');
  });
}

function getFieldFromData(field, data) {
  var values = data[field] || '';
  var output = values.join ? values.join(', ') : values;
  return output;
}```

<html>
  <body>
    <form>
      <input type="text" id="email" name="email:" placeholder="">
      <input type="file" id="myFile" name="filename">      
      <input type="button" value="Send" onclick="google.script.run.processForm(this.parentNode)">
    </form>
  </body>
</html>

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

function processForm(e) {
  var contentType = 'image/jpeg'; // Could also be 'image/bmp', 'image/gif', or 'image/png'
  var image = e.filename;
  var image = image.getAs(contentType);
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getSheetByName("Sheet1"); // Change sheet name if necessary
  sheet.insertImage(image, 1, 1); // Top-left corner of image is top-left corner of A1 (image not in A1, but "over cells")
}

function processForm(e) {
  var contentType = 'image/jpeg';
  var image = e.filename;
  var image = image.getAs(contentType);
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getSheetByName("Sheet1"); // Change sheet name if necessary
  var file = DriveApp.createFile(image); // Add image to Drive
  file.setSharing(DriveApp.Access.ANYONE, DriveApp.Permission.VIEW); // Share image with Anyone
  sheet.getRange("A1").setFormula("=IMAGE(\"https://drive.google.com/uc?export=view&id=" + file.getId() + "\")");
}