0

正如标题所暗示的，我正在使用 Ember 开发一个单页面应用程序，但非常重要的是各个页面能够指定要共享的元数据（FB、Twitter）并具有定制的 SEO 元数据。

你如何做到这一点？我们无法在页面加载后调整元数据，所以我的假设是我们需要一个服务器端组件来读取 URL 并在必要时插入正确的元数据到响应中。不幸的是，这似乎会使单页应用程序变得笨重，因为它现在必须向服务器发出请求以进行页面更改。

有没有人优雅地解决了这个问题？

4

2 回答 2

2

您不必返回服务器进行单页应用程序中的页面更改，您只需要确保您的服务器在完整页面请求发送到服务器时使用适当的元数据进行响应。

首先，您需要确保 Ember 使用的是真实 url ( 'history') 而不是哈希 url。url 的哈希部分始终保留在浏览器本地，不会传输到服务器。因此，如果您希望 URL 可以正确共享（带有适当的元数据），您必须使用真实的 url。这会打开真实的网址。

App.Router.reopen({
  location: 'history'
});

如果有人第一次点击您的应用程序，'/'那么您应该提供代表应用程序“主页”的元数据（可能还有一小部分“真实”内容）。如果有人第一次点击您的应用程序，'/posts/xyz'那么您应该提供一个包含元数据的页面，以及一些用于发布的内容xyz。无论哪种情况，一旦页面在他们的浏览器中，您就可以启动您的 Ember 应用程序并让它正常运行。当他们在应用程序中移动时，URL 将更新以反映他们的位置。这些 URL 是可共享的，应该让其他用户看到完全相同的东西。当这些 URL 被某种机器人（谷歌、Facebook 等）点击时，它们会提供真实的内容和适当的元数据（OpenGraph 标头等......）

这是我一直在开发的一个应用程序。 http://galleries.cloudhdr.com/

于 2013-09-21T04:57:40.620 回答
0

搜索引擎爬虫不运行 javascript，因此您必须使用单独的 Web 服务器为您的站点内容生成静态页面，例如 phantom.js。我相信它也可以解决您的元数据问题。

您可能想查看有关单页应用程序的 SEO的文章。

于 2013-09-16T00:32:03.967 回答