一、Iframe:嵌入技术
<iframe>
元素旨在将web文档嵌入到当前文档中。这很适合将第三方内容纳入您的网站。
此示例包括使用以下所需的<iframe>
基本要素:
注意:为了提高速度,在主内容完成加载后,使用JavaScript设置iframe的src属性是个好主意。这使您的页面可以更快地被使用,并减少您的官方页面加载时间(重要的SEO指标)。
二、使用HTTPS:
HTTPS是HTTP的加密版本,应尽可能使用HTTPS为网站提供服务:
- HTTPS减少了远程内容在传输过程中被篡改的机会
- HTTPS防止嵌入式内容访问您的父文档中的内容,反之亦然。
始终使用sandbox属性:
想尽可能减少攻击者在你的网站上做坏事的机会,那么你应该给嵌入的内容仅能完成自己工作的权限。当然,这也适用于你自己的内容。一个允许包含在其里的代码以适当的方式执行或者用于测试,但不能对其他代码库(意外或恶意)造成任何损害的容器称为沙盒。
未沙盒化(Unsandboxed)内容可以做得太多(执行JavaScript,提交表单,弹出窗口等)默认情况下,您应该使用没有参数的sandbox属性来强制执行所有可用的限制。
三、<embed>
和<object>
元素
<embed>
和<object>
元素的功能不同于<iframe>
—— 这些元素是用来嵌入多种类型的外部内容的通用嵌入工具,其中包括像Java小程序和Flash,PDF(可在浏览器中显示为一个PDF插件)这样的插件技术,甚至像视频,SVG和图像的内容!
四、将SVG添加到页面
快捷方式:<img>
要通过 <img>
元素嵌入SVG,你只需要按照预期的方式在 src 属性中引用它。你将需要一个height或width属性(或者如果您的SVG没有固有的宽高比)。