当前位置: 首页 > news >正文

identity4 系列————纯js客户端案例篇[四]

前言

前面已经解释了两个案例了,通信原理其实已经很清楚了,那么纯js客户端是怎么处理的呢?

正文

直接贴例子哈。

https://github.com/IdentityServer/IdentityServer4/tree/main/samples/Quickstarts/4_JavaScriptClient

那么解释一下其实怎么做的吧。

那么就直接来看这个javascriptClient 是怎么实现的吧。

public void Configure(IApplicationBuilder app)
{app.UseDefaultFiles();app.UseStaticFiles();
}

这个两个就是给静态文件设置路由,这个不过多介绍,.net core 系列已经解读过其源码了。

<!DOCTYPE html>
<html>
<head><meta charset="utf-8" /><title></title>
</head>
<body><button id="login">Login</button><button id="api">Call API</button><button id="logout">Logout</button><pre id="results"></pre><script src="oidc-client.js"></script><script src="app.js"></script>
</body>
</html>

这个的话,那么引入了oidc-client.js 和 app.js。

app.js 肯定就是自己项目的代码了。

oidc-client 可以看下官方介绍。https://github.com/IdentityModel/oidc-client-js

也就是说用好了oidc-client就可以了。
首先实例了一个客户端:

var config = {authority: "https://localhost:5001",client_id: "js",redirect_uri: "https://localhost:5003/callback.html",response_type: "code",scope:"openid profile api1",post_logout_redirect_uri : "https://localhost:5003/index.html",
};
var mgr = new Oidc.UserManager(config);

然后登录的时候:

function login() {mgr.signinRedirect();
}

这里面根据我们前面的例子,也能猜到其实就是去查idenityserver的wellknown 跳转到登录地址。

然后identityServer 注册好jsClient 就行。

// JavaScript Client
new Client
{ClientId = "js",ClientName = "JavaScript Client",AllowedGrantTypes = GrantTypes.Code,RequireClientSecret = false,RedirectUris =           { "https://localhost:5003/callback.html" },PostLogoutRedirectUris = { "https://localhost:5003/index.html" },AllowedCorsOrigins =     { "https://localhost:5003" },AllowedScopes ={IdentityServerConstants.StandardScopes.OpenId,IdentityServerConstants.StandardScopes.Profile,"api1"}
}

下面直接看效果就好了。

首先去拿identityserver 的公开信息。

然后访问identityServer:

然后就到了登录页面了。

然后进行登录。

还是和以前一样,这里可以直接运行例子更加直观。

然后看下客户端拿到授权码后如何获取token的。

然后通过token 获取到了userinfo。

这里解释一下这里有几个token,一个是access_token 这个是来表示授权令牌,比如访问一些接口的api。

然后这个id_token 是身份令牌,在线解析一下哈:

那么这个身份令牌是用来干什么的。授权令牌用来访问api授权的,那么身份令牌用来干什么的呢?

这样我们不要猜,直接看官方怎么说。

https://auth0.com/docs/secure/tokens/id-tokens#learn-more

ID tokens are used in token-based authentication to cache user profile information and provide it to a client application, thereby providing better performance and experience. The application receives an ID token after a user successfully authenticates, then consumes the ID token and extracts user information from it, which it can then use to personalize the user's experience.

上面说id tokens 是基于认证token 来缓存用户的信息提供给客户端,提供更好的性能和体验。在认证后应用收到id token,使用id token 收集用户的信息,可以被使用与私有化的用户体验。

我们知道auth2.0 管理授权,但是不管理用户信息。当然了auth 2.0 可以通过api 获取到用户信息,但是这是另外一回事。

比如说我们访问简书,跳转到qq登录,然后又登录回来,这其中包括了认证和授权。认证应该返回id tokens,来证明这个用户认证了。授权应该返回access_token 表示授权token。

然后文档中也给了例子。

For example, suppose you have a regular web app that you register it with Auth0 and configure to allow users to login with Google. Once a user logs in, use the ID token to gather information such as name and email address, which you can then use to auto-generate and send a personalized welcome email.

比如说,假设你有一个常规的web app,这个app 你允许用户他能给个google 登录。 一但用户登录,使用这个id token 可以收集用户信息,比如说名字邮件,这样你就可以给这个用户发送邮件。

上面那些id_token 中好像没有什么东西,那么其实我们可以增加一些东西。

全部可以看这个:

https://docs.authing.cn/v2/concepts/id-token.html

那么作为客户端下次访问的时候如何去读取数据呢?

也就是从下面这里去读数据:

当然里面还会去执行是否会话过期。

这里面就是检查会话是否过期。

这个有什么用呢?

假如我们在identity server 中退出了登录,那么会发生什么呢?

下面是我identity server 退出后的结果:

那么就会访问https://localhost:5001/connect/authorize。

这里就不看细节了,讲一下效果。

cookie 清除了,会话结束了。

前面是有identity 会话的。

那么这cookie 有什么用呢?

如果cookie 在的话,那么会把cookie带上去访问identity server,identity 如果确定这个会话没有过期,那么不会进入登录界面,而是直接callback 回来。

现在都是不带数据库的,后面把数据库例子说明一下。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.exyb.cn/news/show-140888.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈,一经查实,立即删除!

剑指offer(五):排序算法

剑指offer(五)&#xff1a;排序算法 排序算法用作实现列表的排序&#xff0c;列表元素可以是整数&#xff0c;也可以是浮点数、字符串等其他数据类型&#xff01;常用算法需要在排序算法的基础&#xff1a; 二分查找&#xff1a; 根据数组已排序的特性&#xff0c;才能每轮确定…...

【windows下基于Eclipse和GCC搭建stm32开发环境(6)】通过串口USRAT1实现Printf()打印

通过串口USRAT1实现Printf打印一、串口初始化配置&#xff1a;1、 串口简介&#xff1a;2、启用HAL库UART代码块&#xff1a;3、 串口初始化&#xff08;基于HAL库编程&#xff09;&#xff1a;二、USART1中断函数重定向三、串口收发消息调试1、超级终端连接串口&#xff1a;三…...

小工具整理

转载&#xff1a; 在线工具 - 你的工具箱 (tool.lu) 1.正则 [正则表达式测试工具 - 在线工具 (tool.lu)](https://tool.lu/regex/) 2.文字加密解密 文字加密解密 - 在线工具 (tool.lu) 3.时间戳转换 时间戳(Unix timestamp)转换工具 - 在线工具 (tool.lu) 4.图片压缩 h…...

毕业半年,收获人生第一个一百万,选择比努力更重要

大家都知道程序员这个行业&#xff0c;目前是站在风口上的&#xff0c;薪资待遇可以说是高于其他多数行业&#xff0c;但同时业内的收入差异也非常大。我见过年薪百万的高级技术专家&#xff0c;也见过月薪7K的外包码农&#xff0c;而许多的码农这辈子可能都在复制粘贴&#xf…...

原子操作的实现原理

原子&#xff08;atom&#xff09;本意是“不能被进一步分割的最小粒子”&#xff0c;而原子操作&#xff08;atomic operation&#xff09;意为”不可被中断的一个或一系列操作” 。 我们一起来聊一聊在Inter处理器和Java里是如何实现原子操作的。 术语定义 Cache line&#x…...

打造基于 PostgreSQL/openGauss 的分布式数据库解决方案

在 MySQL ShardingSphere-Proxy 逐渐成熟并被广泛采用的同时,ShardingSphere 团队也在 PostgreSQL ShardingSphere-Proxy 上持续发力。相比前期的 alpha 与 beta,5.0.0 正式版对 PostgreSQL 的协议实现、SQL 支持度、权限控制等方面进行了大量的完善,为后续全面对接 Postgre…...

博图V13、V14、V15、V15.1、V16版本安装包链接下载

关注博主&#xff0c;并私信&#xff0c;可获得博图V13、V14、V15、V15.1、V16版本安装包...

C# RedisHelper

public class RedisHelper{/// <summary>/// redis连接字符串/// </summary>private static readonly string RedisConnString ConfigurationManager.AppSettings["RedisConn"];private static readonly string RedisKey ConfigurationManager.AppSett…...

安装配置Tomcat,idea配置Tomcat(纯步骤)

一、下载Tomcat 1、进入官网Http://tomcat.apache.org/,选择download&#xff0c;下载所需要的Tomcat版本。 2、下载zip直接解压&#xff0c;exe需要安装 找到目录bin下的startup.bat&#xff0c;点击启动Tomcat&#xff1b;shutdown.bat&#xff1a;关闭Tomcat 二、 Tomcat环…...

苹果 Mac 影音播放器:IINA

一个好的电脑工作环境&#xff0c;除了系统稳定外&#xff0c;还是需要许多好用的软体来相辅相成。这次我们要来介绍一款&#xff0c;macOS 影音播放器软体&#xff0c;它能让使用者在简单的环境之下&#xff0c;不用复杂的操作&#xff0c;以及支援许多档案格式&#xff0c;就…...

discord 自动水群脚本

原理&#xff1a;从你加入的channel里获取到历史消息随机选择一条发送至目标channel 需要先登录网页版获取authorization # -*- coding: utf-8 -*- """ Time &#xff1a; 2021/10/3 19:18 Auth &#xff1a; d1rrickscientistDAO File &#xff1a;autochat.p…...

我是程序员中的10%,父母眼中的不干正事,今天我就要说,我就是女程序员怎么了!

从哪里说起呢&#xff0c;我的程序员之路。有些话只是自己心里想的很明白&#xff0c;还从没说过。希望你有耐心看完&#xff0c;因为我的故事不精彩&#xff0c;也算不上奋斗史。我的文笔和叙事能力也很差。 高中报志愿的时候坚定的报了计算机技术及应用&#xff0c;当时对计…...

pytorch导包Dataloader失败原因

问题&#xff1a; pytorch中导入’Dataloader’失败。 报错&#xff1a; ImportError: cannot import name ‘Dataloader’ from ‘torch.utils.data’ (C:\Users\sq\anaconda3\envs\pytorch-gpu\lib\site-packages\torch\utils\data_init_.py) 解决方案&#xff1a; 把这句…...

Flume知识点总结

点击查看flume安装配置教程 1、概念 Flume是一个分布式、可靠、和高可用的海量日志采集、聚合和传输的系统。 Flume可以采集文件&#xff0c;socket数据包、文件、文件夹、kafka等各种形式源数据&#xff0c;又可以将采集到的数据(下沉sink)输出到HDFS、hbase、hive、kafka等…...

如何使用netwokx进行复杂网络的中心性分析?

如何使用netwokx进行复杂网络的中心性分析&#xff1f; 这是本学期在大数据哲学与社会科学实验室做的第七次分享了。 第一次分享的是&#xff1a; 如何利用“wordcloudjieba”制作中文词云&#xff1f; 第二次分享的是&#xff1a; 如何爬取知乎中问题的回答以及评论的数据…...

python实现对图片的处理--图像处理课设

实现的东西 1.从左到右第一个按钮是打开一张图片 2.第二个按钮是二维卷积突出图像边缘&#xff1a;使用一个5*5的卷积核&#xff0c;以步长为1&#xff0c;边缘填充为0的方式对图像进行卷积&#xff0c;输入通道数和输出通道数都3&#xff08;RGB&#xff09; 3.第三个按钮是透…...

实验项目2 贪吃蛇游戏开发

一.项目要求 &#xff08;1&#xff09;实现贪吃蛇游戏基本功能&#xff0c;屏幕上随机出现一个“食物”&#xff0c;称为豆子&#xff0c; 上下左右控制“蛇”的移动&#xff0c;吃到“豆子”以后“蛇”的身体加长一点。 &#xff08;2&#xff09;“蛇”碰到边界或蛇头与…...

Activit7之流程定义、流程实例、个人任务、流程变量、组任务、网关详解

Activit7之流程定义、流程实例、个人任务、流程变量、组任务、网关详解流程定义部署流程定义查询流程定义删除流程定义流程定义资源查询查看流程历史信息流程实例启动流程实例业务标识之Businesskey查询流程实例挂起、激活流程实例全部流程实例挂起单个流程实例挂起个人任务分配…...

Python的线程05 解决共享变量问题举例

正式的Python专栏第43篇&#xff0c;同学站住&#xff0c;别错过这个从0开始的文章&#xff01; 前面学委分享了几篇多线程的文章&#xff0c;前面提到了银行转账这个场景&#xff0c;展示了一个比较耗时的转账操作。 这篇继续转帐&#xff0c;下面展示一段程序&#xff0c;多…...

如何在Seaborn柱形图顶端添加数字——以奥运数据分析为例

如何在Seaborn柱形图顶端添加数字——以奥运数据分析为例 1.问题的提出 之前暑期在家&#xff0c;闲着没事干的时候想写点基础的代码巩固下自己python知识&#xff0c;于是就上Kaggle下了一套东京奥运会的数据集&#xff0c;原数据集地址在这里&#xff1a;https://www.kaggl…...

实现艾尔登法环中的大卢恩效果

使用顶点动画中的广告牌技术(Billboarding),实现简单的艾尔登法环中的大卢恩效果使用顶点动画中的广告牌技术(Billboarding),来实现大卢恩在竖直方向上保持始终朝向玩家的效果。 1、广告牌技术原理 广告牌技术会根据视角方向来旋转一个被纹理着色的多边形,通常用于渲染烟…...

图床搭建|chrome插件|操作简单不要钱

为什么需要一个图床 为了写博客 图床:专门用来存放图片,同时允许你把图片对外连接的网上空间. 用markdown格式写作,插入图片需要图片的url地址,然后博客的背景图也是要用url地址。 有段时间,我一直很想拥有一个自己的博客。这个博客既要足够简洁明了,又要有一定的观赏性。我…...

【面试题】如何去掉vue的url地址中的#号?及其原理?

如何去掉vue的url地址中的#号?及其原理? 点击打开视频讲解更加详细 如何去掉vue的url地址中的#号? import Vue from vue;import VueRouter from vue-router;Vue.use(VueRouter)// 1. 定义一些路由 // 每个路由都需要映射到一个组件。 const routes = [{ path: /home, compon…...

学习ASP.NET Core Blazor编程系列一——综述

一、NET 6概述.NET 6 是微软统一.Net Core与.Net Framework 两大框架的第二个版本,微软在 .NET 5 中开始进行这两大框架的统一之路。.NET 6 将作为长期支持 (LTS) 版本得到三年的支持。只有Visual Studio 2022(以及更高版本)支持 .NET 6。Visual Studio 2017/2019等版本都不…...

React报错之Parameter props implicitly has an any type

正文从这开始~ 总览 当我们没有为函数组件或者类组件的props声明类型,或忘记为React安装类型声明文件时,会产生"Parameter props implicitly has an any type"错误。为了解决这个错误,在你的组件中明确地为props对象设置一个类型。安装类型文件 你首先要确定的是你…...

(WebFlux)003、多数据源R2dbc事务失效分析

一、背景 最近项目持续改造,然后把SpringMVC换成了SpringWebflux,然后把Mybatis换成了R2dbc。中间没有遇到什么问题,一切都那么的美滋滋,直到最近一个新需求的出现,打破了往日的宁静。 在对需求分析了一番后,需要引入新的数据源,那就是MongoDb。然后出现了MongoDb、Mysq…...

对Github指定类目的内容进行监控和推送

很久之前看到HACK学习呀有一个Github 安全搬运工的系列文章,个人觉得很不错,想要在自己的公众号上也做这方面的内容,内容的编辑排版相对来说比较容易,这样问题就回归到Github安全内容的获取上 这篇文章整体比较长,如果想直接使用的话可以跳转去仓库 https://github.com/Cl…...

HCNP RoutingSwitching之端口安全

什么是端口安全呢?端口安全是对端口的一种保护机制;我们知道MAC安全特性中,默认情况没有配置任何配置的端口,它能够学习很多动态MAC,并且老化时间为5分钟;即我们没有限制端口学习MAC的数量;没有限制数量这意味着只要有一个MAC帧,对应端口都会学习源MAC,即不管是伪造的…...

【C标准库】详解feof函数与EOF

创作不易,多多支持! 再说此函数之前,先来说一下EOF是什么 EOF,为End Of File的缩写,通常在文本的最后存在此字符表示资料结束。 在C语言中,或更精确地说成C标准函式库中表示文件结束符。这种以EOF作为文件结束标志的文件,必须是文本文件。在文本文件中,数据都是以字符的…...

TMC2209步进驱动芯片基本配置及使用

TMC2209是用于两相步进电机的超静音电机驱动器IC。TMC2209与许多传统驱动器以及TMC2208引脚兼容。 TRINAMICs先进的StealthChop2斩波器可确保电机无噪音运行,实现最高效率和最佳电机扭矩。其快速的电流调节和抑制共振功能组合可实现高动态运动。 StallGuard用于无传感器回原点…...

freeswitch配置SBC的方案

概述 freeswitch 是一款好用的开源软交换平台。 但是&#xff0c;fs不是专为SBC而开发的&#xff0c;所以需要做一些定制化的配置和开发。 本文主要介绍如何利用fs的基本功能配置一个简单的SBC方案&#xff0c;满足一般化需求&#xff0c;如果有定制化的需求需要定制开发。 …...

电脑正常联网,提示无法登录微信

事故起因:因为工作需要安装一款软件,安装途中提示有风险直接忽略了该风险。后期卸掉该软件,然后无法登录微信、QQ、easyconnect等软件,但是浏览器可以正常访问。 登录微信出现的界面是: 登录esayconnect会出现疯狂点击但就是没有丝毫反应,腾讯会议无法打开,向日葵打开…...

银河麒麟桌面V10微信不能登录

一、清理缓存 sudo rm -rf /home/用户/.Xauthority sudo rm -rf /home/用户/.config sudo rm -rf /home/用户/.cache 二、设置网络MTU 把MTU从自动改成1500点击保存即可...

微信登录收不到回调的解决方法

接入微信三方登录&#xff0c;有时候会有收不到回调的情况 可以再添加上这个方法&#xff0c;即可收到回调: - (BOOL)application:(UIApplication*)app openURL:(NSURL*)url options:(NSDictionary<NSString*, id>*)options {return [WXApi handleOpenURL:url delegate…...

Android 微信登录 无法调起授权页面

如果你什么都比对了,有问题,只有一个原因 签名不匹配, 工具地址 微信开放文档 去微信 官方下载签名工具,然后按到手机上,然后在你工程的包名 粘贴一下子,发到手机上,然后用微信那个工具 放包名,获取你的签名,然后去微信官方换一下,然后等一会就好了.\ 如果这个还不行, and…...

PHP redis list

$redis new \Redis(); $redis->connect(127.0.0.1,6379); $redis->auth(123456);// 密码 $redis->select(1);// 指定数据库 $keylist:wps2; // 设置key&#xff0c;无则新建&#xff0c;有责从末尾插入 // $redis->rpush($key,sh…...

Facebook 错误 不允许用户查看应用程序

错误提示&#xff1a;提示不允许用户查看应用程序&#xff0c;根据开发者设定的配置&#xff0c;不允许用户查看这一应用。 主要是应用在未发布前&#xff0c;需要添加测试账号到FB开发者后台&#xff0c;还有就是检查facebook 的appid是否正确...

facebook 分享图片显示不出来

facebook 分享图片出不来&#xff0c;可能原因&#xff1a; 1、图片小于facebook 200*200的最小限制 2、网页包含被facebook屏蔽的内容&#xff0c;可通过下面链接进行调试 https://developers.facebook.com/tools/debug...

react native 出现程序包com.facebook.react不存在

今天在通过android studio 编译react-native 项目的时候&#xff0c;莫名出现com.facebook.react下的文件不存在&#xff0c;部分缺失如图&#xff1a; 如&#xff1a;程序包com.facebook.react不存在、 程序包com.facebook.react.bridge不存在、程序包com.facebook.react.uima…...

Cordova ios 工程实现Facebook登录分享的问题及解决办法

说明&#xff1a;本文章是为了记录最近我在Cordova ios 中接入facebook&#xff0c;实现facebook的登录和分享出现的问题以及解决方法&#xff0c;以免自己后面忘记了&#xff0c;也希望给出现同样问题的朋友一点帮助。 前提条件&#xff1a;你已经注册申请了facebook&#xff…...

Facebook-Rebound弹簧效果

在 Android 使用动画&#xff0c;除了属性动画比较好用&#xff0c;还有 Facebook-Rebound 的动画效果&#xff0c;今天就来通过几个小的动画效果来初步了解以下 Facebook-Rebound 。下面是效果图&#xff1a; 效果十分的酷炫&#xff0c;下面就来看一下如何实现的&#xff1b;…...

facebook修改权限_如何在Facebook上更改小组的隐私

facebook修改权限Groups are one of Facebook’s best features. They’re really handy for anyone who wants to run a club or interact with people who share the same hobbies. 群组是Facebook的最佳功能之一。 对于想要经营俱乐部或与拥有相同爱好的人进行互动的人来说&…...

Facebook改名,元宇宙非区块链不可

美东时间10月28日&#xff0c;在名为Facebook Connect的年度大会上&#xff0c;扎克伯格宣布&#xff0c;Facebook将公司名称更改为“META”&#xff0c;公司股票代码将从12月1日起变更为“MVRS”&#xff0c;All In元宇宙。先勿论小扎突然改名是真的想专注打造元宇宙也好&…...

你不知道的 facebook 盈利模式

图&#xff1a;2016年11月19日&#xff0c;Facebook联合创始人兼首席执行官马克扎克伯格&#xff08;Mark Zuckerberg&#xff09;在亚太经合组织CEO峰会上发表讲话时表示:“我们需要尽自己最大力量阻止仇恨、暴力和错误信息传播。” 网易科技讯 3月21日消息&#xff0c;据Vent…...

Android 集成facebook授权登录以及过程中登录错误,密钥散列不匹配

Facebook开发文档 授权登录还是比较简单的&#xff0c;看着文档一步步下来就好。集成登录的代码也较少&#xff0c;直接在登录的activity写即可。 主要说下可能会遇到的问题&#xff1a; 授权登录出现&#xff1a; 应用程序未设置&#xff1a;此应用程序仍处于开发模式&#x…...

关于facebook分享不能显示图片链接问题

最近做项目facebook的分享问题一直有bug&#xff0c;分享出去一直是这样的&#xff1a;由于项目是外包出去的&#xff0c;看不到代码&#xff0c;开发人员说集成的是第三方分享&#xff0c;陆陆续续解决了一个多月&#xff0c;我让他们换成facbook原生的sdk试了还是不行&#x…...

Talk预告 | 亚马逊云科技上海人工智能研究院肖天骏:基于视频的自监督物体遮挡补全分割

本期为TechBeat人工智能社区第458期线上Talk&#xff01; 北京时间11月30日(周三)20:00&#xff0c;亚马逊云科技上海人工智能研究院资深应用科学家——肖天骏的Talk将准时在TechBeat人工智能社区开播&#xff01; 他与大家分享的主题是: “基于视频的自监督物体遮挡补全分割”…...

slf4j中的桥接器是如何运作的?

关于slf4j源码分析系列&#xff0c;更多精彩内容&#xff0c;请关注公众号“程序新视界”&#xff0c;持续更新中… 阅读分析slf4j的日志源码&#xff0c;发现其中涵盖了许多知识点和优秀的设计&#xff0c;关键它们都是活生生的实践案例。写成系列文章与大家分享&#xff0c;欢…...

SpringBoot集成@Slf4j

背景 当前采用SpringBoot架构进行打印日志&#xff0c;会有很多的方式&#xff0c;其中推荐使用SpringBoot自带的工具Slf4j该工具使用起来很方便。 SpringBoot整合Slf4j 1.需要安装的工具 我们采用的是IDEA开发工具&#xff0c;所以这里我们要安装工具&#xff1a; Lombok…...

平衡搜索树——B-树小记

文章目录B- 树系列定义插入规则代码B-树结点定义查找key在结点哪个子树插入分裂B- 树系列 定义 B-树是一棵多叉 平衡 搜索树(不是二叉树&#xff0c;B-树中每个结点中可以有多个key&#xff0c;也有多个孩子) B-树中每个结点在实现时人为规定一个key的上限(KEY_LIMIT 4) B-…...