全面解锁:通过JSP和Ajax实现钉钉签到数据展示及部门筛选功能

devtools/2024/9/22 20:42:20/

要在JSP页面中调用钉钉的签到接口,并将签到数据展示在页面上,同时提供部门筛选功能,你可以按照以下步骤操作:

  1. 准备钉钉API

    • 你需要首先获取钉钉开放平台的API凭证(如access_token)。请参考钉钉开放平台的文档来获取这些信息:钉钉开发者文档
  2. 后端代码:调用钉钉API

    • 在你的JSP项目的后端,通过一个Servlet来调用钉钉的签到接口,并将数据返回给前端页面。
  3. 前端代码:展示签到数据

    • 使用HTML和Ajax来调用后端的Servlet,获取签到数据并展示在页面上,同时提供部门筛选功能。

以下是一个完整的示例:

后端:Servlet代码

java">import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.OutputStream;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.Scanner;@WebServlet("/GetDingSignInData")
public class GetDingSignInData extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {String accessToken = "YOUR_ACCESS_TOKEN";String departmentId = request.getParameter("departmentId");String apiUrl = "https://oapi.dingtalk.com/attendance/list?access_token=" + accessToken;URL url = new URL(apiUrl);HttpURLConnection conn = (HttpURLConnection) url.openConnection();conn.setRequestMethod("POST");conn.setRequestProperty("Content-Type", "application/json");conn.setDoOutput(true);String jsonInputString = "{\"department_id\": \"" + departmentId + "\"}";try(OutputStream os = conn.getOutputStream()) {byte[] input = jsonInputString.getBytes("utf-8");os.write(input, 0, input.length);           }int status = conn.getResponseCode();Scanner scanner;if (status > 299) {scanner = new Scanner(conn.getErrorStream());} else {scanner = new Scanner(conn.getInputStream());}StringBuilder jsonResponse = new StringBuilder();while (scanner.hasNext()) {jsonResponse.append(scanner.nextLine());}scanner.close();response.setContentType("application/json");response.getWriter().write(jsonResponse.toString());}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doPost(request, response);}
}

前端:JSP页面代码

<!DOCTYPE html>
<html>
<head><title>钉钉签到数据</title><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script><script type="text/javascript">function fetchSignInData() {var departmentId = $('#departmentId').val();$.ajax({url: 'GetDingSignInData',type: 'POST',data: { departmentId: departmentId },success: function(response) {var signInData = JSON.parse(response);var html = '<table border="1"><tr><th>姓名</th><th>签到时间</th><th>签到地点</th></tr>';$.each(signInData.recordresult, function(index, record) {html += '<tr>';html += '<td>' + record.user_name + '</td>';html += '<td>' + record.user_check_time + '</td>';html += '<td>' + record.user_check_location + '</td>';html += '</tr>';});html += '</table>';$('#signInData').html(html);},error: function(error) {console.log("Error: ", error);}});}</script>
</head>
<body><h1>钉钉签到数据</h1><div><label for="departmentId">部门ID: </label><input type="text" id="departmentId" name="departmentId"><button οnclick="fetchSignInData()">查询</button></div><div id="signInData"></div>
</body>
</html>

说明

  1. Servlet部分

    • GetDingSignInData Servlet接收前端发送的请求,调用钉钉签到API,并将结果返回给前端。
    • access_token需要通过钉钉开放平台获取。
  2. JSP页面部分

    • 通过表单输入部门ID,并点击按钮发送Ajax请求到Servlet。
    • 成功获取签到数据后,使用JavaScript将数据展示在表格中。

这个示例提供了一个基本的实现方法,可以根据具体需求进行扩展和优化。


http://www.ppmy.cn/devtools/89016.html

相关文章

用virtualbox虚拟机扩容后无法开机,怎么办,怎么办,求求了

首先&#xff0c;虚拟机刚开始空间只有50G,下载几个项目后&#xff0c;就提示空间不足了&#xff0c;就随便百度了一下&#xff0c;很快就加到了200G,然后&#xff0c;刚开始没有成功&#xff0c;就重启虚拟机验证一下。 再然后&#xff0c;再然后&#xff0c;虚拟机就起不来了…

java基础--字符串用法

一、前言&#xff08;在java中字符串的重要性&#xff09; 在 Java 编程中&#xff0c;字符串&#xff08;String&#xff09;的重要性不言而喻&#xff0c;它几乎贯穿于所有的应用程序和系统中。以下是 Java 中字符串重要性的几个方面&#xff1a; 1. 数据表示和处理 文本数…

[Bugku] web-CTF靶场系列详解①!!!

平台为“山东安信安全技术有限公司”自研CTF/AWD一体化平台&#xff0c;部分赛题采用动态FLAG形式&#xff0c;避免直接抄袭答案。 平台有题库、赛事预告、工具库、Writeup库等模块。 ------------------------------- Simple_SSTI_1 启动环境&#xff1a; 页面提示传入参数f…

数字电路设计常见术语

头阻&#xff08;Head-of-Line blocking&#xff09; 交织&#xff08;interleaving&#xff09; 加速比&#xff08;speedUP&#xff09; 乱序&#xff08;outOfOrder&#xff09; 保序&#xff08;order&#xff09; 乱序重排&#xff08;reorder&#xff09; 发出未回…

8月17日|广州|Cocos开发者沙龙不见不散!

6月底举行的Cocos成都沙龙吸引了近200位开发者和10多家发行&#xff0c;得到了大家的一致好评。 Cocos广州沙龙即将到来&#xff0c;会邀请更多KOL和头部发行、渠道嘉宾分享行业经验&#xff0c;让大家实现技术干货、游戏合作、行业信息多丰收。 活动主题&#xff1a;小游戏与出…

关于JS中的AO对象

在JavaScript中&#xff0c;AO对象&#xff08;Activation Object&#xff0c;激活对象&#xff09;是与函数执行上下文相关的概念。每当一个函数被调用时&#xff0c;都会创建一个新的执行上下文&#xff0c;这个执行上下文包含一个AO对象&#xff0c;用于存储在函数执行期间创…

社交登录新纪元:Laravel Socialite 实战指南

社交登录新纪元&#xff1a;Laravel Socialite 实战指南 在当今数字化世界&#xff0c;社交登录为用户提供了一种快速、简便的登录方式。Laravel Socialite 是 Laravel 社区的一个扩展包&#xff0c;它提供了一种统一的方法来处理社交账号登录。本文将详细介绍如何在 Laravel …

欧拉图,欧拉通路,欧拉回路,Hierholzer算法详解

文章目录 零、哥尼斯堡七桥问题一、欧拉图1.1 相关概念1.2 判别法&#xff08;不做证明&#xff09;1.3 Hierholzer算法1.4 代码实现1.4.1 邻接表存图1.4.2 链式前向星存图 二、OJ练习2.1 模板12.2 模板22.3 重新安排行程2.4 合法重新排列数对2.5 破解保险箱2.6 骑马修栅栏2.7 …