已落地的多种项目形式
- 富文本编辑器-结合业务的输出
 - 公式编辑器
 
跨部门团队协作
- XXX-客户端,嵌入iframe
 - 报告对接
 - 中台系统-业务模块输出
 
什么时候用?怎么用?
基础点
iframe
hack
- 基于iframe的src,提供下载资源功能
通信
postMessage
 - https://developer.mozilla.org/zh-CN/docs/Web/API/Window/postMessage
 
线上问题处理
CSP
- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP
 - https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy
 - https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
 - Specifies valid parents that may embed a page using ,
 
1  | 
  | 
nginx
如果一个域名xxx.xxx.xxx /abc/ 路径下部署了前端服务
- iframe 里面嵌入 xxx.xxx.xxx/abc
 - 如果是xxx.xxx.xxx/abc 会被重定向,nginx , 这样会有问题,请求https,会被转为http
 - Nginx 内部重定向规则会被启动,例如,当 URL 指向一个目录并且在最后没有包含“/”时,Nginx 内部会自动的做一个 301 重定向
 - 需要xxx.xxx.xxx/abc/ ,这样才能匹配到,从而不被重定向
 
视频自动播放问题
https://developer.chrome.com/blog/autoplay/#iframe-delegation
如果是跨域的站点,又希望能自动播放,需要再加上这个属性