我有一个问题,我看不到为解决方案提供资金。我的 Facebook 页面上有一个标签(其中一个静态 HTML:iFrame 应用程序)。从 PC 访问它没有问题,但是当我尝试从移动设备访问该选项卡时,它说:
“未找到您请求的页面。返回上一页”
有什么方法可以创建在移动设备上可访问的选项卡,或者只是将它们重定向到外部域?
谢谢!
为了创建具有移动访问版本的页面选项卡应用程序(直接访问的外部网站,而不是通过 Facebook iFrame)。您需要在应用开发者设置中添加和配置 3 个不同的“平台”。这些应该配置如下:
像往常一样配置它。
这是您为移动网站配置 url 的地方
这将成为您的应用程序的门户。到达此页面的移动用户将被重定向到移动网站。您可以使用 javascript 将桌面用户重定向到您的Facebook Page Tab App。
您希望在桌面浏览器上访问您的画布应用程序的人被重定向到您的页面选项卡应用程序。因为它是在 i-frame 中加载的,所以唯一的方法是使用 JavaScript。
这将是您的Canvas Url的内容(上面的http://myapp.com/canvas-redirect):
<script>top.location="http://facebook.com/page_tab_url/app_1234"</script>
注意“top.location” - 这会将父窗口重定向到页面选项卡,而不仅仅是 iframe。当用户在桌面浏览器中到达画布页面时,他们将通过 JavaScript 重定向到您的Page Tab App。移动用户将被 Facebook 重定向到您在上面指定的移动网站 URL。
如果您的应用处于沙盒模式,则只有应用的管理员、开发人员或测试人员才能看到它。特别是未登录 Facebook 或已登录 Facebook 但不是应用程序管理员或测试人员的用户将无法访问应用程序画布页面 - 他们只会看到 404 错误。为了在应用程序处于沙盒模式时测试您的移动重定向,您需要确保您是应用程序的管理员、开发人员或测试人员,并且您已在手机的网络浏览器上登录 Facebook 的移动站点- 即 iOS 上的 Safari和 Android 上的 Chrome。仅在手机上登录 Facebook 移动应用程序是不够的,您还必须使用浏览器登录。
您可以通过单击应用设置中的“角色”选项卡来配置应用用户角色。您可以添加 Facebook 用户或 Facebook 群组作为任何角色。(如果您添加一个组,该组中的所有用户都将具有应用程序中指定的角色)。为了让用户在应用程序中拥有特定角色,他们必须:
(编辑以反映更新的开发设置 UI 和可读性)
作为对此的更新,Facebook 现在会自动重定向到您的网站,而无需任何黑客攻击。
为此,请确保您已将网站平台添加到您的应用程序中,并将您的移动 URL 放在那里。
我很难弄清楚如何使用移动设备访问页面标签,感谢 Ben 在之前的评论中,我找到了一种方法。首先,您无法使用手机访问页面标签,因此您需要将其指向您的页面标签的来源。如果您使用画布,Facebook 可以为您做到这一点,但如果您使用台式计算机访问它,您将被重定向到您的画布链接,而不是您的页面选项卡。这就是我们修复它的方法:
--
1) 在设置 - 基本下进入您的应用程序(Facebook 开发人员)
2)从“页面标签”部分复制您的“页面标签 URL ” (类似于http://yourpagetab.yourdomain.com),然后将其粘贴到您的移动网站 URL中到“移动网站”部分。
3)对 Facebook 上的应用程序部分执行相同操作,但不要将其指向您的页面选项卡,您必须使用重定向文件。让我们使用http://yourpagetab.yourdomain.com/redirection.php?fb
请注意,您必须在链接末尾使用 ?fb 。它什么都不做,但 Facebook 想要它。实际上它可能是?任何东西,可能只是?
4)创建redirection.php文件(不要添加?fb)并在其中添加此代码
<script>top.location="http://facebook.com/your_fb_page/your_page_tab"</script>
您必须将 /your_fb_page/your_page_tab 替换为指向您的页面选项卡的链接。
5)保存它!
--
现在,您所要做的就是使用 Facebook 为您提供的Canvas Page url(在Facebook 上的 App下)。如果人们点击它并在桌面上,他们将被重定向到页面选项卡。如果他们在移动设备上,他们将被重定向到托管页面选项卡的网站。
如果您正在使用扇门(用户必须在访问您的页面标签之前喜欢您的页面):这将不起作用,因为移动用户将卡在您的扇门上。
解决这个问题的唯一方法是禁用扇门或使用 Mobile Detect(您可以在 Github 上搜索)并仅对使用移动设备的用户禁用它。如果您希望您的页面标签与移动用户一起使用,这是一个很小的代价。桌面用户仍然需要喜欢您的页面才能看到您的页面选项卡。
您还可以使用这样的链接来阻止 facebook 重定向手机
https://www.facebook.com/MyAppName/?sk=app_11111-APP-ID-11111&ref=ts
我是静态 HTML 的开发人员之一。实际上,我们现在在应用程序中内置了一个功能,可以生成适用于移动设备和桌面的智能、缩短的链接。如果您单击编辑器顶部的“+”图标,它将拉出一个可共享的链接。
如果您使用该链接,我们会做一些额外的魔术,以便您的标签更适合小屏幕。
编辑:我们已经放弃了特殊格式,因为它在 iOS 设备上出现故障。
这是我用于重定向的 php 代码:
// Mobile_Detect
require 'Mobile_Detect.php';
$detect = new Mobile_Detect;
if (strpos('https://' . $_SERVER['HTTP_REFERER'] . $_SERVER['REQUEST_URI'], 'facebook.com') !== false && $detect->isMobile()) {
echo '<html><head><script type="text/javascript">window.top.location.href = "https://yourappurl.com";</script></head><body></body></html>';
die();
}