将 AMP 与你的应用集成
重要提示:此文档不适用于你当前选择的格式 stories!
本指南面向希望集成和链接到 AMP 页面的移动和 Web 应用开发人员。例如,考虑一个移动聊天应用,该应用加载共享 URL 的 AMP 版本,以便为用户提供更快的体验。
将链接转换为 AMP
使用 AMP,可以在你的原生或移动 Web 应用中近乎立即地呈现外部网站。 你可以通过将内容中的 URL 与其相应的 AMP URL(如果存在)进行匹配,并打开 AMP 版本而不是原始版本来实现此目的。你可以使用诸如 Google 的 AMP URL API 之类的工具来帮助你完成此操作。
例如,可以通过将所有 URL 替换为其匹配的 AMP 版本(如果存在)来转换以下消息,以提供 AMP 版本。 为了减少加载时间并保证提供有效的 AMP,你应该链接到 AMP 缓存中的缓存 AMP 页面。
原始消息
This is a message with links to an <a href="http://www.example.org/a">
article with AMP version</a> and an <a href="http://www.example.org/b"> article without AMP version</a>.
转换后的消息
This is a message with links to an <a href="https://www-example-org.cdn.ampproject.org/c/www.example.org/a">
article with AMP version</a> and an <a href="www.example.org/b"> article without AMP version</a>.
转换链接的方法
有三种以编程方式转换链接的方法
- 写入时服务器端(首选):在写入 URL 时,通过 Google 的 AMP URL API 检索 AMP URL,并在服务器端存储 AMP URL。将两个 URL 都传递到客户端,因为共享可能需要原始 URL。这是推荐的方法,因为客户端的网络请求较少。 采用这种方法时,重要的是定期(例如,每天)扫描链接的 AMP 版本,因为越来越多的网站正在采用 AMP 格式。
- 读取时服务器端(某些用途):在将内容传递到客户端之前,通过 Google 的 AMP URL API 检索 AMP URL。如上所述,将两个 URL(AMP 和非 AMP)都传递到客户端,因为共享可能需要原始 URL。此方法适用于低扇出的服务。
- 客户端(如果服务器端不可行):从客户端通过 Google 的 AMP URL API 检索 AMP URL。如果服务器端 URL 转换不可行(例如,对于使用端到端加密的消息传递应用程序),请使用此方法。确保在任何用户交互发生之前,在内容可用后立即触发 URL 转换。
Google 的 AMP URL API
Google 提供 AMP URL API 来检索给定 URL 列表的匹配 AMP HTML URL (官方文档 / 演示。这些 URL 不需要是规范版本。如果存在 AMP 版本,则响应包括原始 AMP URL 和 Google AMP 缓存中缓存的 AMP 页面的 URL。
例如,对于给定的 URL 列表
{"urls": [
"https://www.example.org/article-with-amp-version",
"http://www.example.com/no-amp-version.html"
]}
响应正文包含 JSON 格式的 AMP URL 映射
{
"ampUrls": [
{
"originalUrl": "https://www.example.org/article-with-amp-version",
"ampUrl": "https://www.example.org/article-with-amp-version/amp",
"cdnAmpUrl": "https://www-example-org.cdn.ampproject.org/c/s/www.example.org/article-with-amp-version"
}
],
"urlErrors": [
{
"errorCode": "NO_AMP_URL",
"errorMessage": "AMP URL not found.",
"originalUrl": "http://www.example.com/no-amp-version.html"
}
]
}
使用 AMP 缓存
AMP 缓存是用于传递有效 AMP 文档的基于代理的内容交付网络 (CDN)。AMP 缓存旨在
- 仅提供有效的 AMP 页面。
- 允许有效地、安全地预加载 AMP 页面。
- 对内容执行其他有益于用户的性能优化。
目前,有两个 AMP 缓存提供商
这提供了两种在应用中显示 AMP 文件的方式,通过使用以下方式之一
- 发布者托管的版本
- AMP 缓存中托管的版本
我们建议使用 AMP 缓存,原因如下
- 由于加载时间更快且延迟更低(加载时间快 1 秒以上),因此用户体验更好。
- 由于客户端相关工件(例如,根据客户端的视口大小缓存同一图像的不同版本)的额外缓存,因此提高了性能和带宽。
- 原始 AMP 文件可能不再是有效的 AMP,这可能会导致不良的用户体验。在这种情况下,AMP 缓存会提供 AMP 文件的最后一个有效版本。
- 一个不正直的发布者可能会向 AMP 缓存爬虫和你的用户提供两个不同的文档。使用 AMP 缓存可保证用户始终看到与缓存相同的 AMP 文件。
实现 AMP 查看器
AMP 运行时提供了一个查看器 API,该 API 提供了一个在 AMP 运行时和查看器之间发送和接收消息的协议。这使得可以控制 AMP 文档的预渲染、在文章之间滑动以及 AMP 运行时检测。你可以在将 AMP 查看器与 AMP 页面连接指南中了解有关 AMP 查看器 API 的更多信息。适用于 Web 和 iOS 的查看器实现在 GitHub 上提供。Android 查看器尚不可用,请参阅 Stack Overflow 上关于如何最好地配置 WebView 以显示 AMP 页面的此答案。
以下是实现 AMP 查看器的一些通用最佳实践
- 从 AMP 缓存提供 AMP 页面(加载时间快 1 秒以上)。
- 显示文章的发布者来源(例如,在可折叠的页眉中)。
- 提供共享操作(另请参阅下面的“分享 AMP 内容”部分)。
- 在基于 webView 的查看器中,启用第三方 Cookie。
- 为你的平台/应用设置引荐来源网址。
分享 AMP 内容
从平台的 AMP 查看器中分享 AMP 文档时,平台应在技术可行的情况下分享规范 URL。例如,如果平台提供共享按钮,则此按钮应共享规范 URL。
AMP 项目的理念是,平台应该选择向用户展示哪个版本的文档。因此,在分享到其他平台时,分享规范版本(而不是 AMP 版本)最有意义,然后期望目标平台做出正确的选择。