1

Express-handlebars レンダリングから生成された pdf ファイルを生成しようとしています。ただし、一部の css ファイルが機能していないようです。

ブートストラップはまだ問題なく動作していますが、カスタム css (テーマを使用しています) は動作していません。phantomjs 構成 (--web-security=false,...) を試し、css フォルダー ディレクトリをローカルからサーバーに切り替えました。しかし、それらのどれも機能していないようです。画像は正常に動作しています。

html の生成と pdf ファイルの作成

var config = {
        format: "A4",
        orientation: "landscape",
        base: "http://127.0.0.1:3002/uploads/theme/",
        timeout: 100000, 
        phantomArgs: ["--web-security=false","--local-to-remote-url-access=true"]
    }

    var html = await hbs.render('./views/pdf.handlebars', data)
    await fs.writeFile("pdf.html", html, function(err) {
        if(err) {
            return console.log(err);
        }
    })
    var fileName = uuid.v4()
    await pdf.create(html, config).toFile(`./downloads/${fileName}.pdf`, function (err, res) {
        if (err) return console.log(err);
        response.send({ success: true, data: { downloadURL: fileName } })

css ファイルを含む:

<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/animate.min.css">

css ファイルからの呼び出しを受信するサーバー:

イムグル

期待される結果:

イムグル

実結果：

イムグル

ご覧のとおり、bootstrap と font-awesome は正常に動作していますが、"style.css" は動作していません。誰でもこの問題について何か考えがありますか? よろしくお願いします！

4

1 に答える 1

1

サーバー コードは HTML ファイルのみを読み取り、css ファイルは読み取らないため、css は実際には使用されていません 。インライン css を使用してください。また、HTML と CSS を別々に記述し、フォーム pdf にマージする方法も探しています。

于 2019-11-27T07:05:10.600 に答える