Question

我已经构建了一个AngularJS应用程序，它包含可以被视为不同页面的视图，但该应用程序是单页面应用程序，因为页面中没有重新加载。

我已经阅读了使用转义的片段网址将搜索引擎重定向到网页的快照。我的问题是，当我尝试在Facebook上的应用程序共享页面时，它返回404，这可以使用Facebook's open graph debug tool看到。

我的应用程序有一个Larvel后端提供给AngularJS前端，我的htaccess看起来像这样将蜘蛛和Facebook重定向到快照。据我所知，这是有效的，但我想这不是。

<IfModule mod_rewrite.c>
   <IfModule mod_negotiation.c>
      Options -MultiViews
   </IfModule>

   RewriteEngine On

   RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
   RewriteRule ^(.*)$ http://%1/$1 [R=301,L]

   RewriteCond %{QUERY_STRING} ^_escaped_fragment_=/?(.*)$
   RewriteRule ^(.*)$ /%1? [NC,PT]

   # Redirect Trailing Slashes...
   RewriteCond %{REQUEST_FILENAME} !-d
   RewriteRule ^(.*)/$ /$1 [L,R=301]

   # Handle Front Controller...
   RewriteCond %{REQUEST_FILENAME} !-d
   RewriteCond %{REQUEST_FILENAME} !-f
   RewriteRule ^ index.php [L]
</IfModule>

我的网址格式化为用户，如：domain.com/#！/ bike / id / bike + name 并且快照URL是相同的，没有哈希bang即domain.com/bike/id/bike+name

我真的很沮丧。任何建议或指示将不胜感激。

Answer 1

Facebook抓取工具不会执行任何Javascript，因此他们不会看到/不了解您的Angular路线。我在项目中所做的是我已经镜像了后端需要开放图标签的路线。

如果我的服务器收到带有og-tags的页面的请求，它将进行必要的API调用以获取数据，并将它们附加到索引模板。如果我的初始请求是没有og-tags的页面，我只渲染常规SPA索引。（我正在使用HTML5模式的网址，所以你可能会有所不同）

另请注意，我向服务器说了初始请求。这意味着您在SPA中导航时og-tags不会改变，它们只是您请求的第一页的标签。这实际上不是问题，因为Facebook会向您的服务器提出个人请求。

如果不清楚，请告诉我，我会尝试更好地解释。

Ajax生成内容和Facebook抓取

1 个答案: