Android 无法在移动浏览器上访问 Facebook 应用程序/粉丝页面选项卡

unable to access facebook app / fan page tab on mobile browser

提问by Chirag Shah

I have created an app an that can be accessed by the desktop browser by following link like "https://apps.facebook.com/APP_NAME/".

我创建了一个可以通过桌面浏览器通过以下链接访问的应用程序，例如“ https://apps.facebook.com/APP_NAME/”。

While I am running facebook on android mobile on google chrome browser going through https://m.facebook.com, I am not able to access the same app.

当我在 google chrome 浏览器上的 android 手机上运行 facebook 时https://m.facebook.com，我无法访问同一个应用程序。

Here my concern is, is it possible to access the facebook app on mobile browser and can we access the facebook fan page custom tab on mobile browser?

我担心的是，是否可以在移动浏览器上访问 facebook 应用程序，我们可以在移动浏览器上访问 facebook 粉丝页面自定义选项卡吗？

In short I want to access my facebook app page on mobile browser, and I am unable to do so.

简而言之，我想在移动浏览器上访问我的 facebook 应用程序页面，但我无法这样做。

Thanks In Advance!

提前致谢！

回答by Fabio Antunes

When you are browsing on mobile devices through https://m.facebook.comyou don't have access to Canvas Apps also known as "App on Facebook" nor Page Tabs.

当您通过移动设备浏览时，https://m.facebook.com您无法访问 Canvas 应用程序（也称为“Facebook 上的应用程序”）或页面选项卡。

To solve this you can add a platform to your existing App, imagine this case scenario where you have a app that's a Page Taband a App on Facebook(Canvas App). We are going to add a new platform, Website, to do this, just go to your existing app, then settings and at the bottom of the page there's a button that says +Add Platform, after that a pop-up will appear:

为了解决这个问题，您可以向现有应用程序添加一个平台，想象一下这种情况，您有一个应用程序，它是一个页面选项卡和一个Facebook 上的应用程序（画布应用程序）。我们将添加一个新平台Website来执行此操作，只需转到您现有的应用程序，然后进行设置，在页面底部有一个显示+Add Platform的按钮，然后会出现一个弹出窗口：

If you notice my app already has two platform the light grey ones, now I'm adding a new one the Websiteas I said before.

如果您注意到我的应用程序已经有两个平台（浅灰色的），现在我将像之前所说的那样在网站上添加一个新平台。

After you choose the website platform, two new fields will appear on your App settings, the next picture is a possible setup for all the platforms of your app:

选择网站平台后，您的应用设置中会出现两个新字段，下图是您应用所有平台的可能设置：

In this example I decided that each platform as his own url, since each platform as different behaviors, for example on page tabs you can check if the user likes your page without asking for permissions, on canvas page you need to ask permissions first to know if the user likes a page and on mobile websites you need to verify if the user is logged in on Facebook and if he already has granted permissions to your app. The thing is after you grant permission on one of this platforms you can access all the three, since they are all the same app.

在这个例子中，我决定每个平台作为他自己的 url，因为每个平台都有不同的行为，例如在页面选项卡上你可以检查用户是否喜欢你的页面而无需请求权限，在画布页面上你需要先请求权限才能知道如果用户喜欢页面和移动网站，您需要验证用户是否登录 Facebook 以及他是否已授予您的应用程序权限。问题是在您授予此平台之一的权限后，您可以访问所有三个平台，因为它们都是相同的应用程序。

Imagine that you access your page tab appon your desktop and you grant permissions to it. Now try using your mobile device and login through https://m.facebook.comthe app you created will be available on your APPS menuas bookmark and if you use facebook search on your mobile device it will also be available. This next pic is the APPS menu:

想象一下，您在桌面上访问页面选项卡应用程序并授予其权限。现在尝试使用您的移动设备并通过https://m.facebook.com您创建的应用程序登录将作为书签出现在您的应用程序菜单上，如果您在移动设备上使用 Facebook 搜索，它也将可用。下一张图片是应用程序菜单：

Note: In this pic you don't see any app, I don't have any installed it's just for clarification

注意：在这张图片中你没有看到任何应用程序，我没有安装任何应用程序只是为了澄清

I also do one thing when I'm announcing my App on my Page Tab, since people will see your posts on desktop browsers and mobile browsers I also create a gate that redirects user based on their browsers. I create a post something like this:

当我在我的页面选项卡上宣布我的应用程序时，我也会做一件事，因为人们会在桌面浏览器和移动浏览器上看到你的帖子，我还创建了一个基于浏览器重定向用户的门。我创建了一个类似这样的帖子：

Hey, do you want to be cool? Then check this awesome app http://bit.ly/best-app-evah

嘿，你想变酷吗？然后检查这个很棒的应用程序 http://bit.ly/best-app-evah

I use a bit.ly just because it's more beautiful, this bit.ly redirects the user to my url https://myapp.com/app/gatewhere I have this piece of code:

我使用 abit.ly 只是因为它更漂亮，这 bit.ly 将用户重定向到我的 url https://myapp.com/app/gate我有这段代码：

<?php
// Include and instantiate the class.
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;

// Any mobile device (phones or tablets).
//redirect the page to your Mobile or Responsive Web design website
if ( $detect->isMobile() ) {
header('Location: http://YOUR_MOBILE_WEBSITE/');
}
//redirect to our canvas page or page tab.
else { 
header('Location: http://www.facebook.com/YOUR_FACEBOOK_PAGE_NAME/app/YOUR_APP_ID_NUMBER/');
}
?>

========================================================================= NOTE: The "Mobile_Detect.php" class file required at the beginning of the above php script, you can download it from https://github.com/serbanghita/Mobile-Detectand upload it to your site for this to work. Otherwise, it won't work. =========================================================================

================================================== ====================== 注意：上述php脚本开头需要的“Mobile_Detect.php”类文件，可以从https下载： //github.com/serbanghita/Mobile-Detect并将其上传到您的站点以使其正常工作。否则，它不会工作。================================================== ========================

Oh and as Nisarg Patel said check the facebook blog post

哦，正如 Nisarg Patel 所说，查看 facebook 博客文章

回答by Igy

Page Tab apps are not supported on mobile devicesby Facebook's Platform

Facebook 平台不支持移动设备上的Page Tab 应用程序

The workaround I usually suggest is

我通常建议的解决方法是

• Link users to your mobile web site directly
• Show them the 'tab' content directly in the mobile site if they're using a mobile browser (use something like WURFL to detect),
• Redirect desktop browsers back to the Facebook Page Tab directly

• 将用户直接链接到您的移动网站
• 如果他们使用的是移动浏览器，则直接在移动站点中向他们显示“标签”内容（使用 WURFL 之类的工具进行检测），
• 将桌面浏览器直接重定向回 Facebook 页面标签