发布页面

如何发布页面


xxxxxxxxxx
我们使用布局器开发完成页面后，需要将页面脱离布局器单独运行，
此时最快的方式就参考我们软件包提供的publish.html写法即可明白如何发布


xxxxxxxxxx
图1 展示发布页面需要的资源依赖

方式一:模板引擎的方式

1 客户端


xxxxxxxxxx
新建一个页面的，引入上图的head的内容 也可以参考iframe-xxx.html的head内容 注意有些文件是不需要的
body里 把布局器保存的html和javascript css canvasStyle放到对应位置即可
<html>
    <head>
    {{css}}
    </head>
    <body style='{{canvasStyle自己拼装一下}}'>
        {{html}}
        <script>
        {{javascript}}
        </script>
    </body>
</html>

2 服务端


xxxxxxxxxx
如果您懂java 请打开我们的magicaldemo项目找到
java:
@Controller
public class DeployerPageController{
    //预览页面
    @RequestMapping(value = "page/{pageId}")
    public String api(@PathVariable Long pageId, ModelMap modelMap, HttpServletRequest request){
        Map<String,Object> query = new HashMap<>();
        query.put("id",pageId);
        Page page = deployerMapper.getPageById(query);
        String html = "<div id=\"magicalDragScene\"><template>"+page.getPageHtml()+"</template></div>";
        String js = "<script>"+page.getPageJs()+"</script>";
        modelMap.addAttribute("html",html+js);
        return "debug";
    }
}
请注意：这个页面您可以做成模板或者其他方式 如果有问题可以咨询我们
如果出现浏览器提示一些xss之类的可以考虑采用此方式转义 str.replaceAll("&lt;","<");或者str.replaceAll("<","&lt;");

方式二: 纯前端实现 (推荐此方法可以前后的分离)


xxxxxxxxxx
请参考 布局器中publish.html写法

发布页面

如何发布页面

方式一:模板引擎的方式

方式二: 纯前端实现 (推荐此方法 可以前后的分离)

方式二: 纯前端实现 (推荐此方法可以前后的分离)