显然,“在移动设备上不受支持”确实意味着它无法在移动设备上运行。
因此,如果您不需要在移动端实现“发送”API,那么您可以嗅探 User-Agent 以检查它是否是桌面。
您可能想阅读Browser detection using the user agent。
你可以试试这样的:
if (navigator.userAgent.indexOf("Mobi") > -1){
//do your thing here
}
我创建了以下示例来确认它是否有效。为了测试 facebook API 是否使用尺寸来“区分”移动设备,我在全屏和宽度和高度尺寸方面都尝试了 Chrome 和 Firefox。为了测试移动设备,我使用Red Hat JBoss Developer Studio 中的 Bowser SIM 功能针对以下设备(垂直和水平方向):三星 Galaxy S3、三星 Galaxy Note 10.1、iPhone 4 和 5 以及 iPad 4 Retina。
结论是嗅探 UA 有效!
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<script type="text/javascript">
$( document ).ready( function() {
$("#button-1").click(function(event) {
if (navigator.userAgent.indexOf("Mobi") > -1){
window.location.assign("#page-2");
} else {
window.location.replace("https://www.facebook.com/dialog/send?" +
"app_id=123050457758183" +
"&link=http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html" +
"&redirect_uri=https://www.bancsabadell.com/cs/Satellite/SabAtl/"
);
}
});
})
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : '123050457758183', // App ID from the app dashboard
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK asynchronously
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div data-role="page" id="page-1" data-theme="b">
<div data-role="header" data-theme="b">
<h1>Try to Send.</h1>
</div>
<div data-role="content">
<a href="#" id="button-1" data-role="button" data-theme="b">Send</a>
</div>
</div>
<div data-role="page" id="page-2" data-theme="b">
<div data-role="header" data-theme="b">
<h1>Share</h1>
</div>
<div data-role="content">
<div class="fb-share-button" data-href="http://developers.facebook.com/docs/plugins/" data-type="button_count"></div>
</div>
</div>
</body>
</html>
以下是我在移动环境中使用“发送”API 的尝试。
Facebook SDK 不是开源的,但 FacebookJS 代码是开源的。最初在查看FacebookJS source 和文档后,我认为“移动设备不支持它”这句话并不意味着它在移动设备上被阻止。这仅意味着他们没有像“共享”那样构建一个漂亮漂亮的移动版本。
这让我想到,您可以在提交“发送”的 HTML5/jQuery Mobile 表单中使用 URL 重定向选项。至少那是我会尝试的。 ;)
但是
在尝试实现上述想法后,我发现无法在任何移动设备上显示“发送”对话框,因为 facebook API 读取用户代理并将您从“www.facebook”站点重定向到“ m.facebook”。
Facebook 上有几张关于这件事的票。
Send dialog is not working on mobile device
Send Dialog Doesn't Work on Mobile Web
Send dialog broken for mobile devices
您可以使用来自Send API 的 URL 重定向示例 URL 并在手机浏览器中输入它来测试这一点。
https://www.facebook.com/dialog/send?app_id=123050457758183&link=http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html&redirect_uri=https://www.bancsabadell.com/cs/Satellite/SabAtl/
虽然我不建议这样做,但有可能从服务器端更改用户代理并在此之后重定向 URL。请注意,您必须从服务器端执行此操作,因为出于安全原因,您无法从浏览器中更改此设置。正如我所说,这是你应该只作为最后手段尝试的技巧。有几篇与此相关的帖子:
Want to load desktop version in my webview using uastring
Force webview to display desktop sites
Setting WebView to view Desktop Site and Not Mobile Site