最近开发遇到一个问题,数据库某个字段里面存着整个html代码。需求是预览的时候需要可视化,将html直接展示到页面。
那么问题来了:
1、需要展示的html中的样式会与外面的页面冲突。
2、直接加载数据中的html,可能存着一些脚本错误。
首先想到的解决办法是用iframe,但是iframe是直接加载某个页面。
想到的方法是:
iframe加载一个空页面,将HTML代码直接填充到空页面,然后显示。
这种方式可以成功。然而因为某些原因html代码不能再次从数据库读取,html代码参数需要传递,然而iframe的src加载是get请求,get请求的参数大小有限制,所以只能用post.
这里需要用form表单的post请求,只需将form的target与iframe的name保持一致:
html代码:
<form id="myForm" method="post" target="myFrame"> <input type="hidden" name="datas" id="data_param" /> </form> <iframe name="myFrame" width="500px" height="200px;" ></iframe>
$("#data_param").val(dp); $("#myForm").attr("action", "/java/loadHtmlData"); $("#myForm").submit();
python代码:
def loadHtmlData(request): datas = request.POST.get('datas') return render(request, "crawler_result_iframe.html", { "datas": datas })
crawler_result_iframe.html为空白html
因此这里只需要将form的target属性的值与frame的name保持一致,即可实现iframe的post方式加载数据。