如何设置内容安全策略

操作场景

大屏页面嵌入第三方系统时（例如以iframe形式嵌入），如果涉及跨域访问，请开启内容安全策略。设置内容安全策略的主要目的是减少和报告XSS攻击，缓解跨站脚本攻击。除限制可以加载内容的域，还可指明哪种协议允许使用，缓解数据包嗅探攻击。

操作步骤

1. 参考使用模板新建页面中操作，创建一个大屏页面。

   例如，使用交通管理模板，创建一个大屏应用，命名为A市交通管理大屏。

   图1 使用交通管理模板创建大屏
   

2. 在大屏开发页面，单击页面上方的，保存页面。
3. 保存成功后，单击页面上方的，进行页面发布设置。
4. 打开发布链接。
   图2 打开发布链接
   

5. 在访问限制中，配置内容安全策略。

   例如，将A市交通管理大屏嵌入第三方系统，如图3所示。

   图3 安全策略设置样例
   

   其中，“frame-ancestors”为固定格式，“域名”为大屏待嵌入的第三方系统的域名。除了上述场景外，还有一种典型的场景是将大屏嵌入本地的file中，如图4。

   图4 将大屏嵌入本地的file中
   

6. 登录第三方系统，在Elements中，增加“<iframe src="URL" ></iframe>”。
   图5 增加大屏访问地址
   

   其中，“URL”为待嵌入大屏的访问地址。在大屏发布页面，单击，即可获取，如图6。

   图6 获取大屏URL地址
   
   图7 大屏嵌入效果
   
   

   如果在浏览器无痕模式下预览页面，请确保“阻止第三方Cookie”已关闭（如图8），否则无法正常预览页面。

   图8 关闭阻止第三方Cookie