我的目标是为3大(Fb,LinkedIn,Twitter)实现社交登录按钮,并使用从社交(电子邮件,名字,姓氏)中捕获的数据来预填填着陆页面内的表单 .
我已使用以下代码实现了“使用LinkedIn登录”按钮:
<script type="text/javascript" src="http://platform.linkedin.com/in.js">
api_key: {my api_key}
onLoad: onLinkedInLoad
authorize: true
</script>
<script type="text/javascript">
function onLinkedInLoad() {
IN.Event.on(IN, "auth", function() {onLinkedInLogin();});
IN.Event.on(IN, "logout", function() {onLinkedInLogout();});
}
function onLinkedInLogout() {
setLoginBadge(false);
}
function onLinkedInLogin() {
// we pass field selectors as a single parameter (array of strings)
IN.API.Profile("me")
.fields("firstName", "lastName", "industry", "location:(name)", "picture-url", "headline", "summary", "num-connections", "public-profile-url", "distance", "positions", "email-address", "educations", "date-of-birth")
.result(function(result) {
setLoginBadge(result.values[0]);
})
.error(function(err) {
alert(err);
});
}
function setLoginBadge(profile) {
if (!profile) {
profHTML = "<p>You are not logged in</p>";
}
else {
var pictureUrl = profile.pictureUrl || "http://static02.linkedin.com/scds/common/u/img/icon/icon_no_photo_80x80.png";
alert( profile.firstName);
alert( profile.lastName);
alert(profile.emailAddress);
$("#field0").val(profile.firstName);
$("#field1").val(profile.lastName);
$("#field2").val(profile.emailAddress);
$("#field3").val(profile.emailAddress);
profHTML = "<p><a href=\"" + profile.publicProfileUrl + "\">";
profHTML = profHTML + "<img align=\"baseline\" src=\"" + pictureUrl + "\"></a>";
profHTML = profHTML + " Welcome <a href=\"" + profile.publicProfileUrl + "\">";
profHTML = profHTML + profile.firstName + " " + profile.lastName + "</a>! <a href=\"#\" onclick=\"IN.User.logout(); return false;\">logout</a></p>";
}
document.getElementById("loginbadge").innerHTML = profHTML;
}
</script>
//LinkedIn Button
<script type="IN/Login">
<input type="hidden" id="fnameLinkedIn" name="linkedin-id" value="<?js= firstName ?>" />
<input type="hidden" id="lnameLinkedIn" name="linkedin-id" value="<?js= lastName ?>" />
</script>
代码有效,但当我使用LinkedIN登录时,“使用LinkedIn登录”按钮消失 . 登录后我会保留LinkedIn按钮 .
如何避免LinkedIn按钮的消失?
谢谢你的支持 .
亚历克斯
1 回答
您正在使用JS API,其中登录按钮在登录后会自动消失 . 这就是API的工作方式,以及它应该如何工作 .
使用JS API,只要用户登录linkedin.com,用户就会自动登录到您的站点 . 如果用户已登录,您可以抓取任何数据并立即在表单中使用它 .