实际中遇到需要Facebook和Google+等第三方授权登录自己的Web应用(可能还有Android和IOS的手机应用),本质上都是JS SDK的官方应用。这时候不得不去他们官方查看文档。

注:一下所有连接如果无法打开,请自行翻Q..........

参考文档:

1、facebook:https://developers.facebook.com/docs/facebook-login/web

2、google:https://developers.google.com/identity/sign-in/web/sign-in#add_a_google_sign-in_button

一、准备工作

---facebook

1、facebook登录必须有appid,该appid自己在https://developers.facebook.com/apps/创建的应用编号,先去https://developers.facebook.com/apps/注册自己的应用

2、创建好应用安装官方填写好设置(必须是https不然无法正常连接),登录按钮可以使用官方默认或者自定义

---google

1、clientid(Oauth2.0客户端ID)也是授权登录的必须参数,官方说法是应用凭据对应的客户端ID,需要去这里https://console.developers.google.com/apis/credentials创建 应用凭据

2、创建好应用凭据之后去https://console.developers.google.com/apis/library把对应的API服务启用,这里是Web端(对应的是社交>G+和Google People API,都在自己创建的应用凭据内启用)

二、根据官方文档api拿到用户信息去操作(登录或者注册)

三、下面是一个在线DEMO(所有需要的参数都是自己个人注册用来测试,这里是明文,实际中需要处理)

https://wjf444128852.github.io/demo01/login/

四、遇到的问题

经过测试只有谷歌登录在chrome((32 位))上会出现这个错误,:{error: "popup_closed_by_user"},64位chrome也是可以正常。其他所有浏览器都是正常的。

官方也有对应的issues:https://github.com/google/google-api-javascript-client/issues/405

等待解决。。。

已经解决:原因戳这里

关于Facebook和Google+授权登录的更多相关文章

  1. 第三方OAuth授权登录,QQ、微信(WeChat)、微博、GitHub、码云(Gitee)、淘宝(天猫)、微软(Microsoft )、钉钉、谷歌(Google)、支付宝(AliPay)、StackOverflow

    Netnr.Login 第三方OAuth授权登录 支持第三方登录 三方 参考文档 参考文档 参考文档 参考文档 参考文档 参考文档 参考文档 参考文档 参考文档 参考文档 参考文档 参考文档 安装 ( ...

  2. 分享前端Facebook及Twitter第三方登录

    最近公司要求做海外的第三方登录:目前只做了Facebook和Twitter;国内百度到的信息太少VPN FQ百度+Google了很久终于弄好了.但是做第三方登录基本上都有个特点就是引入必须的js,设置 ...

  3. 【转】【Android应用开发详解】第01期:第三方授权认证(一)实现第三方授权登录、分享以及获取用户资料

    转载请注明出处:http://blog.csdn.net/yangyu20121224/article/details/9057257 由于公司项目的需要,要实现在项目中使用第三方授权登录以及分享文字 ...

  4. 网站如何集成Facebook和Twitter第三方登录

    最近公司要求做海外的第三方登录:目前只做了Facebook和Twitter;国内百度到的信息太少VPN FQ百度+Google了很久终于弄好了.但是做第三方登录基本上都有个特点就是引入必须的js,设置 ...

  5. 【Android应用开发详解】实现第三方授权登录、分享以及获取用户资料

      由于公司项目的需要,要实现在项目中使用第三方授权登录以及分享文字和图片等这样的效果,几经波折,查阅了一番资料,做了一个Demo.实现起来的效果还是不错的,不敢独享,决定写一个总结的教程,供大家互相 ...

  6. 使用ShareSDK实现第三方授权登录、分享以及获取用户资料效果,项目中包含:源码+效果图+项目结构图

    [Android应用开发详解]第01期:第三方授权认证(一)实现第三方授权登录.分享以及获取用户资料   由于公司项目的需要,要实现在项目中使用第三方授权登录以及分享文字和图片等这样的效果,几经波折, ...

  7. SpringBoot基于JustAuth实现第三方授权登录

    1. 简介   随着科技时代日渐繁荣,越来越多的应用融入我们的生活.不同的应用系统不同的用户密码,造成了极差的用户体验.要是能使用常见的应用账号实现全应用的认证登录,将会更加促进应用产品的推广,为生活 ...

  8. iOS无处不在详解iOS集成第三方登录(SSO授权登录无需密码)

    链接地址:http://www.it165.net/pro/html/201408/18884.html 1.前言 不多说,第三登录无处不在!必备技能,今天以新浪微博为例. 这是上次写的iOS第三方社 ...

  9. iOS- 无处不在,详解iOS集成第三方登录(SSO授权登录<无需密码>)

    1.前言   不多说,第三登录无处不在!必备技能,今天以新浪微博为例. 这是上次写的iOS第三方社交分享:http://www.cnblogs.com/qingche/p/3727559.html 可 ...

随机推荐

  1. 学习C++后感

    c++是一门系统级语言,记得大一是要学习这门课时还上网找过学习方法.但网上很多学习方法看的我都头晕,都说学习C++很难,有的说学C++前最好先学C语言,有的说学C++最好不要学C语言,当翻了C++课本 ...

  2. 【腾讯Bugly干货分享】舞动的表情包——浅析GIF格式图片的存储和压缩

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:https://mp.weixin.qq.com/s/v0pffOhjFWnVbU2lXjuEmw 导语 G ...

  3. Photon自定义加载Resource之外的资源

    PhotonNetwork.cs 结尾添加如下代码: #region >>> Photon自定义异步加载GameObject public delegate void CustomL ...

  4. kafka学习笔记——基本概念与安装

    Kafka是一个开源的,轻量级的.分布式的.具有复制备份.基于zooKeeper协调管理的分布式消息系统. 它具备以下三个特性: 能够发布订阅流数据: 存储流数据时,提供相应的容错机制 当流数据到达时 ...

  5. Day10:html和css

    Day10:html和css <html> <body> <h1>标题</h1> <p>段落</p> </body> ...

  6. 【Spark调优】聚合操作数据倾斜解决方案

    [使用场景] 对RDD执行reduceByKey等聚合类shuffle算子或者在Spark SQL中使用group by语句进行分组聚合时,经过sample或日志.界面定位,发生了数据倾斜. [解决方 ...

  7. JS中部分不常用小功能记录

    1.serializeArray()在表单中使用,必须在form标签中,需要手机的元素要有name属性.源生JS将对象转成json   resulrMK = JSON.stringify(resulr ...

  8. pycharm安装plugins

    1 . 启动 PyCharm 软件 2 . 打开 设置(Setting) 窗口.(操作:File -> Setting 或者 按快捷键 Ctrl + Alt + S) 3 . 在搜索框里面搜索: ...

  9. 学习笔记第六课 VB程序

    VB程序的特殊地方在于: 前几课学的破解方法,诸如设置API断点,修改关键CALL的返回值,MESSAGEBOX断点等,这些对于VB程序都是无效的. 这节课是设置VB的API断点,绕过报错弹窗来破解. ...

  10. Android--UI之Gallery

    前言 这篇博客讲解一下Android开发中,Gallery控件的使用,这是一个画廊视图,用于展示一组图片,用固定在中间位置的水平滚动列表显示列表项的视图.Android最新的API文档中了解到,在An ...