Rails 4 + Twitter Bootstrap + jquery + javascript + Ominiauth _login_form.html.erb
<div style="border-right: 1px solid #C0C0C0; margin-left: -11px; float: left; height: 252px"></div>
<h4>Sign In with</h4></br>
<a><%= link_to image_tag("web/fb_login.png", :alt => "facebook", :style => 'margin: 0 0 10% 20%'), user_omniauth_authorize_path(:facebook), :class => "popup", :"data-width" => 600, :"data-height" => 400, :onclick => "return closeloginform();" %> </a><br/><br/>
<a><%= link_to image_tag("web/google_login.png", :alt => "google", :style => 'margin: 0 0 0 20%'), user_omniauth_authorize_path(:google_oauth2), :class => "popup", :"data-width" => 600, :"data-height" => 500, :onclick => "return closeloginform();" %></a><br/><br/>
</div>
<script type="text/javascript">
function closeloginform(){
$('#popup_div').modal('hide');
}
</script>
<script type="text/javascript">
function popupCenter(url, width, height, name) {
var left = (screen.width/2)-(width/2);
var top = (screen.height/2)-(height/2);
childWindow = window.open(url, name, "menubar=no,toolbar=no,status=no,width="+width+",height="+height+",toolbar=no,left="+left+",top="+top);
return childWindow;
}
$("a.popup").click(function(e) {
popupCenter($(this).attr("href"), $(this).attr("data-width"), $(this).attr("data-height"), "authPopup");
e.stopPropagation(); return false;
});
</script>
1)在标题登录链接就在那里。
2)当我点击登录时,它会打开一个模态弹出窗口(twitter bootstrap)。
3)谷歌(图片LOGO)和脸谱(图片LOGO)将有两个选项登录。
4)当您点击任何一个(假设谷歌图片意味着使用gmail帐户登录)时,将打开一个窗口,其中包含gmail登录表单。
5)我将输入登录详细信息然后成功登录后应该发生什么子窗口应该在重新加载父窗口时关闭。 成功登录后发生的事情只有子窗口重新加载并在子窗口中成功登录。
我的问题如何从gmail / fb登录表单中了解用户已成功登录?
答案 0 :(得分:0)
其中一个oauth2流程指定您为oauth登录gmail / fb登录提供重定向路径。此重定向路径位于您的域中,成功登录后,gmail / fb会将用户重定向回此路径,并附加一个身份验证令牌。
#redirect path for fb
https://my.page.com/auth/fb/callback
#fb will redirect after form submit to url like this
https://my.page.com/auth/fb/callback?token=aasnacdsjviavianvashnvoasuh&&other=important_fb_stuff
在fb处唯一标识此用户的令牌和其他信息将在auth_hash
之内。如果这是此用户第一次登录,则您创建一个新记录,否则使用此fb_id加载用户并在会话中验证hime
修改1
在bootstrap role="dialog"
上使用.modal
,以便加载重叠div而不是打开子窗口。重定向将影响整个页面