钉钉扫码登录第三方

钉钉文档

实现登录第三方网站 - 钉钉开放平台 (dingtalk.com)

html页面

将html放在

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>登录</title>// jquery<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>// 钉钉二维码<script src="https://g.alicdn.com/dingding/h5-dingtalk-login/0.21.0/ddlogin.js"></script><style>/* STEP2:指定这个包裹容器元素的CSS样式,尤其注意宽高的设置 */.self-defined-classname {width: 300px;height: 300px;/* border: 1px #000 solid; */}</style>
</head><body><!-- STEP1:在HTML中添加包裹容器元素 --><div id="self_defined_element" class="self-defined-classname"></div>
</body></html>
<script>// STEP3:在需要的时候,调用 window.DTFrameLogin 方法构造登录二维码,并处理登录成功或失败的回调。window.DTFrameLogin({id: 'self_defined_element',width: 300,height: 300,},{   // 回调地址:可以理解为用户扫码同意后钉钉会重定向到你指定的地址并把授权码authCode拼接到该地址参数redirect_uri: encodeURIComponent('http://192.168.11.98:82/index'),client_id: 'dixxxxxxxxxxxxxx', // 你的企业内部应用appKeyscope: 'dingxxxxxxxxxxxxxxxxxxx',	// 保持不变 response_type: 'code',	// 保持不变state: 'pc',	// 跟随authCode原样返回prompt: 'consent',	// 值为consent时,会进入授权确认页},(loginResult) => {const { redirectUrl, authCode, state } = loginResult;// 用户扫码成功后获取到重定向地址以及同意的授权码,这里不做重定向地址。// 通过拿到的授权码调用我们第三方应用的钉钉授权码登录接口换取用户凭证tokenconsole.log(redirectUrl, authCode, state)$.ajax({url: `http://xxxxxxxxxxxxxxx/auth`,   // 后端接口method: 'get',contentType: 'application/json',data:{authCode:authCode},dataType: 'json',success: function (data) {if (data.code == 200) {// 获取token并缓存下来// window.localStorage.setItem('Admin-Token', data.token);document.cookie = 'Admin-Token='+data.token;// 重定向到首页parent.location.href = 'http://xxxxxxxxx/index'} else {alert('钉钉扫码登录失败,请再次尝试。');return;}},error: function (err) {alert(err);}});},(errorMsg) => {// 这里一般需要展示登录失败的具体原因alert(`Login Error: ${errorMsg}`);},);
</script>

将html通过iframe 放在登录页

<div><iframe src="/loginpage.html" ref="iframe" width="330px" height="330px" style="margin: 0px 0px 0px 20px;" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes"></iframe>
</div>

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

redis redisson(仅供自己参考)

redis 通过setnx实现的分布式锁有问题 如图&#xff1a; 解决的新的工具为&#xff08;闪亮登场&#xff09;&#xff1a;redisson redisson可重入锁的原理 实现语言lua&#xff1a; 加锁实现脚本语言&#xff1a; 释放锁的脚本语言&#xff1a; 加锁的lua -- 首先判断这个锁…

[GWCTF 2019]我有一个数据库

我起初以为是sql注入 抓包什么都没有 扫描一下吧 全是文件包&#xff0c;找找有没有有用的 没啥用&#xff0c;但是我们还扫到了一个东西 访问phpmuyadmin/index.php发现什么用 然后我把index.php搞掉了发现version CVE-2018-12613 那么我们看看哦 ?targetdb_sql.php%…

hutool处理excel时候空指针小记

如图所示&#xff0c;右侧的会识别不到 参考解决方案&#xff1a; /***Description: 填补空缺位置为null/空串*Param: hutool读取的list*return: 无*Author: y*date: 2024/7/13*/public static void formatHutoolExcelArr(List<List<Object>> list) {if (CollUtil…

SCI一区级 | Matlab实现GJO-CNN-LSTM-Multihead-Attention多变量时间序列预测

SCI一区级 | Matlab实现GJO-CNN-LSTM-Mutilhead-Attention多变量时间序列预测 目录 SCI一区级 | Matlab实现GJO-CNN-LSTM-Mutilhead-Attention多变量时间序列预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 1.Matlab实现GJO-CNN-LSTM-Mutilhead-Attention金豺优化算…

【C语言】指针(3):探索-不同类型指针变量

目录 一、字符指针变量 二、数组指针变量 三、二维数组传参的本质 四、函数指针变量 4.1 函数指针变量 4.2 函数指针变量的使用 4.3 函数指针变量的拓展 五、函数指针数组 六、转移表的应用 通过深入理解指针&#xff08;1&#xff09;和深入理解指针&#xff08;2&am…

【Redis】简单了解Redis中常用的命令与数据结构

希望文章能给到你启发和灵感&#xff5e; 如果觉得文章对你有帮助的话&#xff0c;点赞 关注 收藏 支持一下博主吧&#xff5e; 阅读指南 开篇说明一、基础环境说明1.1 硬件环境1.2 软件环境 二、Redis的特点和适用场景三、Redis的数据类型和使用3.1字符串&#xff08;String&…

【HTML入门】第十二课 - iframe框架

在早期没有出现Vue和React之前呢&#xff0c;做管理系统&#xff0c;iframe是非常普遍的技术。比如管理系统左侧有非常多的菜单&#xff0c;然后点击菜单后&#xff0c;右边就要展现不同的页面。 又或者呢&#xff0c;我们看一些网站&#xff0c;他们侧边展示着五彩绚烂的广告&…

docker安装mysql, 虚拟机连接mysql

docker已安装&#xff1a;安装教程docker和docker的安装-CSDN博客docker是容器技术&#xff08;软件&#xff09;&#xff0c;提供标准的应用镜像&#xff08;包含应用&#xff0c;和应用的依赖&#xff09;可以轻松在docker里安装应用&#xff0c;每个应用独立容器。https://b…

如何搭建互联网医院系统源码?医疗陪诊APP开发实战详解

今天&#xff0c;小编将为大家讲解如何搭建一个完整的互联网医院系统源码&#xff0c;并介绍医疗陪诊APP的开发实战。 一、互联网医院系统的架构设计 搭建一个完整的互联网医院系统&#xff0c;需要从架构设计开始。一个典型的互联网医院系统通常包含以下几个核心模块&#xf…

[web]-sql注入-白云搜索引擎

ctrlu查看源代码&#xff0c;发现前端有js过滤 <script>function myFunction(){var xdocument.getElementById("number").value;var adocument.getElementById("word").value;var ba.replace(/[\ |\~|\|\!|\|\#|\$|\%|\^|\&|\*|\(|\)|\-|\_|\|\…

Elasticsearch基础概念

Elasticsearch 是一款开源的,ESTful风格的 分布式搜索、存储、分析引擎; 常见的使用场景 网站搜索,代码搜索等日志管理与分析,应用系统性能分析,安全指标监控等数据库同步,将数据库某个表的数据同步到elasticsearch上然后提供搜索服务 ES基本概念 文档 我们向elasticsearch存…

钡铼网关: 轻松实现PLC与OPC UA服务器的双向通信

在当今工业4.0的大潮下&#xff0c;实现不同设备、系统之间的高效通信和数据交换已大势所趋&#xff01;PLC与OPC UA服务器的对接&#xff0c;对于打造智能工厂具有重要意义&#xff0c;本文将深入探讨钡铼技术的网关如何实现这一过程&#xff0c;为用户提供快速且低成本的解决…

JAVA从入门到精通之入门初阶(二)

1. 自动类型转换 自动类型转换&#xff1a;类型范围小的变量可以赋值给类型范围大的变量 byte->int public class java_7_10 {public static void main(String[] args) {//自动类型转换//类型范围小的变量可以赋值给类型范围大的变量 byte->intbyte a 12;int b a;//自动…

MVC之 Controller 》》 ModelState ValidationMessageFor ValidationSummary

ModelState是Controller的一个属性&#xff0c;可以被继承自System.Web.Mvc.Controller的那些类访问。它表示在一次POST提交中被提交到服务器的 键值对集合&#xff0c;每个记录到ModelState内的值都有一个错误信息集。尽管ModelState的名字中含有“Model”&#xff0c;但它只有…

【Android】kotlin jdk版本冲突与Kotlin依赖管理插件

1、androidx.activity&#xff1a;activity&#xff1a;1.8.0 依赖版本错误问题 *依赖项“androidx.activity&#xff1a;activity&#xff1a;1.8.0”要求依赖它的库和应用针对版本 34 或更高版本 Android API 进行编译。&#xff1a;app 目前是针对 android-33 编译的。此外…

昆明网站建设报价

昆明作为中国西南地区的重要城市&#xff0c;经济发展迅速&#xff0c;网络建设也日趋完善。在这个信息化时代&#xff0c;网站建设已经成为企业发展不可或缺的一部分。那么昆明网站建设报价是多少呢&#xff1f;在昆明地区&#xff0c;一般的网站建设报价在5000元至1万元左右&…

【Linux】重定向 | 为什么说”一切皆文件?“

目录 前言 1.文件描述符分配规则 2.dup2 重定向接口 3.重定向 3.1>输出重定向 3.2>>追加重定向 3.3<输入重定向 3.4 shell 模拟实现< > 3.5 理解> 4. 理解“Linux 下一切皆文件” 前言 问&#xff1a;fd 为什么默认从 3 开始&#xff0c;而不是…

人工智能算法工程师(中级)课程4-sklearn机器学习之回归问题与代码详解

大家好&#xff0c;我是微学AI&#xff0c;今天给大家介绍一下人工智能算法工程师(中级)课程4-sklearn机器学习之回归问题与代码详解。回归分析是统计学和机器学习中的一种重要方法&#xff0c;用于研究因变量和自变量之间的关系。在机器学习中&#xff0c;回归算法被广泛应用于…

什么? CSS 将支持 if() 函数了?

CSS Working Group 简称 CSSWG, 在近期的会议中决定将 if() 添加到 CSS Values Module Level 5 中。 详情可见&#xff1a;css-meeting-bot 、[css-values] if() function 当我看到这个消息的时候&#xff0c;心中直呼这很逆天了&#xff0c;我们知道像 less 这些 css 这些预…

前端Vue组件化实践:打造自定义等宽tabs标签组件

在前端开发的世界里&#xff0c;随着业务复杂度的提升和需求的多样化&#xff0c;传统的整体式开发方式已经难以满足快速迭代和高效维护的需求。组件化开发作为一种重要的解决方案&#xff0c;正逐渐受到广大开发者的青睐。本文将结合Vue框架&#xff0c;探讨如何通过组件化开发…