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

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

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

  1. $("body").on("click", ".wkdownload", function(e) {
  2. dynamicPostForm ('/Utilities/getPDFfromBody', {markup: $($(this).data("content"))[0].outerHTML, extra: $(this).data("css"), filename: $(this).data("filename"), disposition: "attachment"}, false);
  3. });
  4. $("body").on("click", ".wknewtab", function(e) {
  5. dynamicPostForm ('/Utilities/getPDFfromBody', {markup: $($(this).data("content"))[0].outerHTML, extra: $(this).data("css"), filename: $(this).data("filename"), disposition: "inline"}, true);
  6. });

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

  1. function dynamicPostForm (path, params, target) {
  2. method = "post";
  3. var form = document.createElement("form");
  4. form.setAttribute("method", method);
  5. form.setAttribute("action", path);
  6. if (target) {
  7. form.setAttribute("target", "_blank");
  8. }
  9. for(var key in params) {
  10. if(params.hasOwnProperty(key)) {
  11. var hiddenField = document.createElement("input");
  12. hiddenField.setAttribute("type", "hidden");
  13. hiddenField.setAttribute("name", key);
  14. hiddenField.setAttribute("value", params[key]);
  15. form.appendChild(hiddenField);
  16. }
  17. }
  18. var hiddenField = document.createElement("input");
  19. hiddenField.setAttribute("type", "hidden");
  20. hiddenField.setAttribute("name", "_token");
  21. hiddenField.setAttribute("value", '{{ csrf_token() }}');
  22. form.appendChild(hiddenField);
  23. document.body.appendChild(form);
  24. form.submit();
  25. $(form).remove();
  26. }

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

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

而在旧框架中,它是:

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

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

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

在新的环境中:

  1. "<div+id=" (truncated).

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

7uzetpgm

7uzetpgm1#

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

  1. for (const [key, value] of Object.entries(params)) {
  2. if(params.hasOwnProperty(key)) {
  3. var hiddenField = document.createElement("input");
  4. hiddenField.setAttribute("type", "hidden");
  5. hiddenField.setAttribute("name", key);
  6. hiddenField.value = value;
  7. form.appendChild(hiddenField);
  8. }
  9. }

相关问题