发布原始html时出现问题,相同的代码在其他框架中工作

vatpfxk5  于 2021-09-13  发布在  Java
关注(0)|答案(1)|浏览(370)

我在一个旧框架中有一些js,它动态地将表单数据发布到后端,然后后端将发布的html转换为pdf文档,可以内联显示或下载。这些基本上都是按钮,其元素id将数据内容属性中的内容(要转换为pdf的html) Package 起来。数据css是任何自定义css的简称,数据文件名是名称,数据处理是附件或下载,等等。

$("body").on("click", ".wkdownload", function(e) {

        dynamicPostForm ('/Utilities/getPDFfromBody', {markup: $($(this).data("content"))[0].outerHTML, extra: $(this).data("css"), filename:  $(this).data("filename"), disposition: "attachment"}, false);

});

$("body").on("click", ".wknewtab", function(e) {

        dynamicPostForm ('/Utilities/getPDFfromBody', {markup: $($(this).data("content"))[0].outerHTML, extra: $(this).data("css"), filename:  $(this).data("filename"), disposition: "inline"}, true);
});

另一个功能是在发布表单后动态创建、提交和销毁表单:

function dynamicPostForm (path, params, target) {

    method = "post";
    var form = document.createElement("form");
    form.setAttribute("method", method);
    form.setAttribute("action", path);

    if (target) {
        form.setAttribute("target", "_blank");
    }
    for(var key in params) {

        if(params.hasOwnProperty(key)) {
            var hiddenField = document.createElement("input");
            hiddenField.setAttribute("type", "hidden");
            hiddenField.setAttribute("name", key);
            hiddenField.setAttribute("value", params[key]);
            form.appendChild(hiddenField);
         }
    }

    var hiddenField = document.createElement("input");
    hiddenField.setAttribute("type", "hidden");
    hiddenField.setAttribute("name", "_token");
    hiddenField.setAttribute("value", '{{ csrf_token() }}');
    form.appendChild(hiddenField);
    document.body.appendChild(form);
    form.submit();
    $(form).remove();
}

在旧框架中,这一切似乎都是可行的,但在新框架中,“markup”输入字段由于某种原因被截断,这是一个问题。我认为它可能在后端,但根据我在控制台中记录的内容,它似乎在客户端。
在新框架中,属性为:

<input type="hidden" name="markup" value="<div id=">

而在旧框架中,它是:

<input type="hidden" name="markup" value="<div id=\"reportnoheader . . . al message.</div></div>"

但两者的代码基本相同。并不是说在第一个示例中没有转义,而是在第二个示例中转义了。
当我在控制台中查看post时,我看到了相同的,旧的:
标记为:

<div+id="reportnoheader"> . . . .</div>"

在新的环境中:

"<div+id=" (truncated).

不知道为什么,因为代码几乎完全相同。我可以尝试转义或编码,但在旧框架中效果很好。

7uzetpgm

7uzetpgm1#

可能是在回答我自己的问题,但简单地使用.value=value而不是setAttributeUTE(“value”,params[key])似乎可以解决我的问题:

for (const [key, value] of Object.entries(params)) {

    if(params.hasOwnProperty(key)) {
        var hiddenField = document.createElement("input");
        hiddenField.setAttribute("type", "hidden");
        hiddenField.setAttribute("name", key);
        hiddenField.value = value;
        form.appendChild(hiddenField);
     }
}

相关问题