在 iOS WebView 中添加 Facebook 的 Like 按钮
Posted
技术标签:
【中文标题】在 iOS WebView 中添加 Facebook 的 Like 按钮【英文标题】:Adding Facebook's Like button inside iOS WebView 【发布时间】:2011-07-31 09:31:35 【问题描述】:我使用 UIWebView 来运行 facebook 代码。问题是 WebView 未在 facebook 中进行身份验证,因此需要登录。
我的用户已经使用本机 API(使用 Safari)登录到 facebook。
如何使用访问令牌在后台 web 视图中对用户进行身份验证,以便在显示“like”时用户已经通过身份验证?
加载下面的html代码一次并执行登录。会话信息已存储,类似按钮将正常工作。 清理您的 facebook cookie 并重新加载 html。会话是从 localStorage 加载的,但需要再次登录。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>
</head>
<body onload="onload()">
Hello Facebook, can you hear me?
<div id="fb-root" >
<fb:like href='http://www.***.com' send='true' layout='button_count' width='220' show_faces='true' font='arial' ref='dropalert'></fb:like>
</div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
function onload()
var session = null;
var sessionStr = localStorage.getItem("session");
if (sessionStr)
session = JSON.parse(sessionStr);
alert("stored session " + sessionStr);
else
alert("session not stored");
FB.init(
appId : <your-app-id>,
session : session,
cookie : true,
xfbml : true
);
FB.getLoginStatus(function(response)
alert("getLoginStatus");
if (response.status == "connected")
alert("Logged in");
parseFBML();
else
// no user session available, someone you dont know
alert("NOT Logged in");
login();
);
function login()
alert("login starting");
// Login to facebook to get an access-token
FB.login(function (response)
if (response.session)
var sessionStr = JSON.stringify(response.session)
alert("session: \n\n" + sessionStr + "\n\n\n\n");
localStorage.setItem("session", sessionStr);
else
alert("Login failed");
, scope:'publish_stream,offline_access');
function parseFBML()
FB.XFBML.parse(document.getElementById('fb-root'));
</script>
</body>
</html>
谢谢。
【问题讨论】:
【参考方案1】:我不知道这是否适合您,但是,如果您可以将会话参数传递给您的 Web 内容,您可以使用它来初始化您的 Web 内容中的 JavaScript SDK。
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init(
appId : <my-app-id>,
session : "uid":"<users facebook id>", "access_token":"<valid access token>", "expires": <expires value>, "sig":"<valid signature>",
cookie : true,
xfbml : true
);
</script>
【讨论】:
谢谢,但这似乎不起作用。我清理了 facebook cookie 并尝试使用会话值。如果我调用 FB.login,则会显示登录表单。如果我尝试激活 API,则会返回无“access_token”错误。还有什么想法吗?你如何连接一个有效的会话? 您的会话应包含有效的访问令牌。你是如何生成会话参数的? 我目前在浏览器中进行测试。我调用 FB.init,然后调用 FB.login(具有离线访问权限)。我打印出 access_token 和 session-key。我清理了 Cookie,将 session-key 设置为 FB.init 会话属性。我不调用登录并尝试访问 API。它失败。如上所述,我尝试在会话属性中设置 access_token 值 - 也失败了。 谢谢,API现在可以访问了,但是点赞仍然需要登录。我用详细信息更新了我的问题。 您使用的是XFBML 还是iFrame 版本的like 按钮?以上是关于在 iOS WebView 中添加 Facebook 的 Like 按钮的主要内容,如果未能解决你的问题,请参考以下文章
如何将推送通知添加到 WebView 应用程序(Android 和 iOS)
iOS开发:webview动态添加配置返回、关闭按钮(简单又完美)