实际中遇到需要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. Windows 10 IoT Core 17127 for Insider 版本更新

    昨天,微软发布了Windows 10 IoT Core 17127 for Insider 版本更新,本次更新只修正了一些Bug,没有发布新的特性.相比于17120,修复了一个已知的问题. 一些已知的 ...

  2. Javascript高级编程学习笔记(53)—— DOM2和DOM3(5)遍历

    遍历 “DOM2级遍历和范围” 定义了两个用于辅助完成顺序遍历的DOM结构类型 NodeIterator 和 TreeWalk 上述两种类型可以基于给定起点的DOM结构执行深度优先的遍历操作 对于检测 ...

  3. prompt的工作原理

    浏览器提供了一个内置函数,可以用来获取用户输入:这个函数就是prompt.函数prompt与你使用过的函数alert很像(它也显示一个对话框,其中包含你指定的字符串),但它还提供了让用户输入响应的区域 ...

  4. Ubuntu 18.04搭建Git服务器

    学习链接:博客园.廖雪峰 一 前言 前面已经贴了两个链接,为什么还要再写一篇呢,因为可能由于个人能力问题,我觉得上面两篇写的都有点简略,有些地方不太好理解,并不能一次性成功搭建,所以想根据自己踩过的坑 ...

  5. yii学习笔记--url解析

    在通过yiic命令生成了一个app之后,我们通过浏览器访问会看到这样的一个页面.   点击home时,url为:http://localhost/blog/index.php?r=site/index ...

  6. springboot~让我习惯了TDD的开发模式

    TDD是什么 TDD就是测试驱动开发,以测试用例为主导,去开发项目,业务代码该怎么写还是怎么写,在实现UI之前,可以先实现Test用例,通过test来实现对业务场景的模拟,最终让你的代码更稳定. 大叔 ...

  7. Apache-Flink深度解析-State

    摘要: 实际问题 在流计算场景中,数据会源源不断的流入Apache Flink系统,每条数据进入Apache Flink系统都会触发计算.如果我们想进行一个Count聚合计算,那么每次触发计算是将历史 ...

  8. C++ STL中的map用红黑树实现,搜索效率是O(lgN),为什么不像python一样用散列表从而获得常数级搜索效率呢?

    C++ STL中的标准规定: map, 有序 unordered_map,无序,这个就是用散列表实现 谈谈hashmap和map的区别,我们知道hashmap是平均O(1),map是平均O(lnN)的 ...

  9. 浅谈Mybatis连接原理

    众所周知数据库连接的过程,但是最近面试的人(菜面菜),都说用的SSM框架,但是我问了一下,mybatis是怎么连接上mysql的,基本上都会说:配置好的,直接用了,今天我来抛砖引玉一下,欢迎拍砖! 什 ...

  10. spring-boot(二)

    学习文章来自:http://www.ityouknow.com/spring-boot.html web开发 spring boot web开发非常的简单,其中包括常用的json输出.filters. ...