1

更新：

我需要在我的 Google Drive 中将 HTML 网页另存为 pdf。我正在使用应用程序脚本。
但是，PDF 的呈现方式与 HTLM 页面不同。我需要 PDF 与 HTML 相同。从研究中我发现外部 CSS 没有正确渲染，只有内联 CSS。

我有一个 HTML 页面，我需要将外部 CSS 转换为内联 CSS。我需要使用应用程序脚本来执行此操作。

可能吗？

编辑：更多细节——这是我在 APPSCRIPT 中的功能和我的 HTML CSS 标题

    function downloadFile() {
    
    var fileURL = "https://www.....
    var folder = "primes"
    var fileName = "";
    var fileSize = "";
    
    var response = UrlFetchApp.fetch(fileURL, {
        headers: { Authorization: 'Bearer ' + ScriptApp.getOAuthToken() },
    })
    var htmlBody = response.getContentText();
    var rc = response.getResponseCode();
    
    if (rc == 200) {
    
    var blob = Utilities.newBlob(htmlBody, 
    MimeType.HTML).getAs('application/pdf').setName('Nota.pdf');
    var folder = DriveApp.getFolderById("1gBA8YCs3PH7v7CNl3nlsjNqYzhOxhjYa");
    if(folder != null){
      var file = folder.createFile(blob);
      fileName = file.getName()
      fileSize = file.getSize()
     }
    }
    var fileInfo = {'rc':rc,"filename": fileName, "fileSize":fileSize}
    
    Logger.log(fileInfo)
    
     }


    <!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Bling - </title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="https://www.bling.com.br/libs/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="https://www.bling.com.br/libs/utils-1632934481.js"></script> <link rel="stylesheet" type="text/css" href="https://www.bling.com.br/styles/danfe.css" />
    <style>
        table.grid tr td{
            /*padding:2px;*/

我得到的输出完全没有正确呈现

4

1 回答 1

1

只需将外部 css 替换为带有填充style标签的实际值即可。

脚本：

var htmlBody = response.getContentText();

// replace external css with the actual css, padded with style tags
var externalCss = `<link rel="stylesheet" type="text/css" href="https://www.bling.com.br/styles/danfe.css" />`;
htmlBody = htmlBody.replace(externalCss, `<style>${UrlFetchApp.fetch('https://www.bling.com.br/styles/danfe.css').getContentText()}</style>`)

var rc = response.getResponseCode();

如果由于验证码而这不起作用。（我不确定验证码在获取时是否会给您带来一些问题）。复制实际的 css（用标签填充），将其保存在一个文件中并将其包含在您的字符串中，然后使用以下方法转换为 blob：

HtmlService.createHtmlOutputFromFile(filename).getContent()

输出：

输出

于 2021-10-06T22:07:54.233 回答