使用页面模板文件新建页面
创建移动端页面操作和大屏&PC端页面相同,本章节以创建大屏&PC端页面为例进行介绍。
操作场景
使用页面模板文件,构建开发页面,减少重复开发,提高交付效率。
前提条件
已获取对应的页面模板文件,详情请参见下载当前页面。
操作步骤
- 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。
- 在项目列表中,单击已创建项目的名称,进入对应的项目页面。
- 在项目中,单击,选择本地的页面模板文件,单击“打开”。
图1 添加本地页面模板文件
- 在创建页面对话框中,输入页面标题,单击“新建”。
系统自动进入业务大屏开发页面,您可以直接使用该大屏应用,也可以根据自身业务的需求进行二次开发。
- 单击页面上方的,保存页面。
- 单击页面上方的,预览应用页面。
如果页面预览效果和预期效果不一致,可再次返回开发页面进行调整。
- 单击页面上方的,进行页面发布设置。
- 发布链接:单击发布链接后的图标,将显示页面地址,单击该地址进入发布页。
如果是新建项目,需要为发布链接设置访问限制,即“分享码访问”或“Token认证”必须设置其中一个,否则链接在运行态无法正常访问。
图2 获取发布链接(已有项目)
图3 获取发布链接(新建项目)
单击,可生成新的链接,原链接将不可访问。单击,可复制该链接。
- 版本管理:通过管理页面版本,设置发布具体哪个版本的页面或者回退到具体哪个版本的页面进行开发。更多介绍,请参见管理页面版本。
图4 版本管理
- 分享码设置:设置页面分享码和分享码有效期,设置后,只能通过分享码来访问页面,提高安全性。更多介绍,请参见如何设置分享码。
图5 分享码设置
- 分享码必须符合如下五个条件。
- 长度为8~32位,仅包含英文字母、数字、特殊字符。
- 至少包含一个英文小写字母(a-z)。
- 至少包含一个英文大写字母(A-Z)。
- 至少包含一个数字(0-9)。
- 至少包含一个特殊字符(~!@#$%^&*()_=+\|[]{};:'",<.>/?-)
- :单击该图标,可查看设置的分享码。
- 有效期设置:设置分享码的有效期。如果不设置有效期,分享码将永久有效。
- 分享码必须符合如下五个条件。
- 设置Token认证:通过设置Token认证,可对大屏交互时传递的参数进行签名鉴权,保证大屏的URL访问链接的参数不会被篡改,从而提高大屏数据及用户信息的安全性。如何设置Token认证,请参见如何设置Token认证。
图6 设置Token认证信息
- :打开Token认证开关后,AstroCanvas会生成一个Token。单击该图标,可复制Token。
- 签名地址只允许打开一次:开启后,签名地址仅允许在当前浏览器中使用。关闭浏览器后,再次访问时需要重新获取签名地址。如果不开启,不限制访问次数,但支持设置有效期。
- 有效期设置:设置Token认证有效期。如果不设置有效期,Token认证将永久有效。
- 设置内容安全策略:大屏页面嵌入第三方系统时(例如以iframe形式嵌入),如果涉及跨域访问,请开启内容安全策略。设置内容安全策略的主要目的是减少和报告XSS攻击,缓解跨站脚本攻击。除限制可以加载内容的域,还可指明哪种协议允许使用,缓解数据包嗅探攻击。如何设置内容安全策略,请参见如何设置内容安全策略。
图7 设置内容安全策略
开启“内容安全策略”时,如果在浏览器无痕模式下预览页面,请确保“阻止第三方Cookie”已关闭,否则无法正常预览页面。
图8 关闭阻止第三方Cookie
- 发布链接:单击发布链接后的图标,将显示页面地址,单击该地址进入发布页。