使用Google Apps Script Blob生成PDF时，HTTP图片无法显示的解决方案咨询

我碰到过好几个开发者遇到这个问题，其实核心原因是Google Apps Script生成PDF时的安全策略——它默认会拦截HTTP协议的外部资源，而且对跨域资源的加载也有严格限制。下面给你几个靠谱的解决方案，按优先级排序：

这个方法的思路是把外部HTTP图片下载下来，转换成Base64格式的Data URI，直接嵌入到HTML里，这样生成PDF时不需要依赖外部请求，完全规避了安全限制和跨域问题。

步骤代码示例： #

首先写一个工具函数，用来把HTTP图片转成Base64：

function getImageAsBase64(imageUrl) {
  try {
    // 用UrlFetchApp抓取图片资源
    const fetchOptions = {
      muteHttpExceptions: true,
      headers: {
        // 模拟浏览器请求，避免被目标网站拦截
        'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36'
      }
    };
    const response = UrlFetchApp.fetch(imageUrl, fetchOptions);
    
    if (response.getResponseCode() !== 200) {
      throw new Error(`Failed to fetch image: HTTP ${response.getResponseCode()}`);
    }
    
    const imageBlob = response.getBlob();
    const contentType = imageBlob.getContentType();
    const base64Data = Utilities.base64Encode(imageBlob.getBytes());
    
    // 返回Data URI格式，直接作为img的src
    return `data:${contentType};base64,${base64Data}`;
  } catch (error) {
    console.error('Error converting image to Base64:', error);
    // 可以返回一个占位图的Base64，或者空字符串
    return '';
  }
}

然后在生成PDF的主函数里，替换HTML中的HTTP图片链接：

function generatePdfWithEmbeddedImages() {
  // 你的原始HTML内容，包含HTTP图片
  let htmlContent = `
    <html>
      <body style="padding: 20px;">
        <h2>Generated PDF with Images</h2>
        <img src="http://example.com/your-image.jpg" alt="Sample Image" width="300">
      </body>
    </html>
  `;

  // 替换HTTP图片链接为Base64 Data URI
  const targetImageUrl = 'http://example.com/your-image.jpg';
  const base64Image = getImageAsBase64(targetImageUrl);
  if (base64Image) {
    htmlContent = htmlContent.replace(targetImageUrl, base64Image);
  }

  // 生成PDF Blob
  const pdfBlob = HtmlService.createHtmlOutput(htmlContent)
    .getAs('application/pdf');

  // 保存到Google Drive
  DriveApp.createFile(pdfBlob.setName('PDF_With_Embedded_Images.pdf'));
  
  Logger.log('PDF generated successfully!');
}

注意事项： #

• 注意UrlFetchApp的配额限制，每天的请求次数有限，如果需要处理大量图片，要控制频率；
• 超大图片转成Base64后会显著增加HTML的大小，可能导致性能问题，建议对图片进行压缩；
• 部分网站会拦截非浏览器的请求，所以我们在fetch选项里加了User-Agent头模拟浏览器，大部分情况能解决拦截问题。

如果你的图片所在的服务器支持HTTPS，直接把HTML里的http://改成https://就行。Google Apps Script的PDF生成器默认允许加载HTTPS的外部公开资源，这是最快的解决方法。

比如把：

<img src="http://example.com/your-image.jpg">

改成：

<img src="https://example.com/your-image.jpg">

注意事项： #

• 确保目标图片的HTTPS链接是可公开访问的，没有权限限制；
• 如果服务器不支持HTTPS，这个方法就无效了。

如果你的图片是自己的，可以上传到Google Drive，设置为任何人可查看，然后用Drive的直接访问链接作为img的src，这样也能在生成的PDF里正常显示。

步骤： #

1. 把图片上传到Google Drive；
2. 右键图片 → 分享 → 选择“任何人有查看权限”；
3. 复制图片的Drive链接（格式类似https://drive.google.com/file/d/[FILE_ID]/view）；
4. 把链接转换成直接访问格式：https://drive.google.com/uc?id=[FILE_ID]；
5. 在HTML里替换img的src为这个直接链接。

示例：

<img src="https://drive.google.com/uc?id=12345abcdefg" alt="Drive Hosted Image">

内容的提问来源于stack exchange，提问作者flxcr07