Ner*_*han 1 .htaccess web-crawler vue.js facebook-share
我用 vuejs 创建了一个 SPA 应用程序。一切都很完美,直到我想在 Facebook 上分享动态内容。
经过研究,我发现当我为 facebook 爬虫填充元标记时,我需要另一个文件(在我的例子中是 php 文件)。在 htaccess 中,我试图检测到 Facebook 代理并重定向到特定文件以填充元标记。
这是我的.htaccess:
<IfModule mod_rewrite.c>
<IfModule mod_negotiation.c>
Options -MultiViews
</IfModule>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /index.html [NC,QSA]
# Handle Authorization Header
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
# Crawler
RewriteCond %{HTTP_USER_AGENT} (facebookexternalhit/[0-9]|Facebot|Twitterbot|Pinterest|Google.*snippet)
RewriteRule cars/carDetail(.*)$ http://website.api.com/v1.0/meta-tags$1 [R=301,L]
Run Code Online (Sandbox Code Playgroud)
但不工作。当您尝试从https://developers.facebook.com/tools/debug/sharing/ url进行调试时:
http://website.com/cars/carDetail?id=48
Run Code Online (Sandbox Code Playgroud)
没有重定向到:
http://website.api.com/v1.0/meta-tags$1
Run Code Online (Sandbox Code Playgroud)
谢谢
我解决了我的问题。
重定向条件应该在 htaccess 的顶部。我还在顶部添加了“RewriteBase /”选项:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
# allow social media crawlers to work by redirecting them to a server-rendered static version on the page
RewriteCond %{HTTP_USER_AGENT} (facebookexternalhit/[0-9]|Twitterbot|Pinterest|Google.*snippet)
RewriteRule cars/carDetail(.*)$ http://website.api.com/v1.0/meta-tags$1 [R=301,L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /index.html [NC,QSA]
# Handle Authorization Header
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
</IfModule>
Run Code Online (Sandbox Code Playgroud)