要在JSP页面中调用钉钉的签到接口,并将签到数据展示在页面上,同时提供部门筛选功能,你可以按照以下步骤操作:
-
准备钉钉API:
- 你需要首先获取钉钉开放平台的API凭证(如access_token)。请参考钉钉开放平台的文档来获取这些信息:钉钉开发者文档
-
后端代码:调用钉钉API:
- 在你的JSP项目的后端,通过一个Servlet来调用钉钉的签到接口,并将数据返回给前端页面。
-
前端代码:展示签到数据:
- 使用HTML和Ajax来调用后端的Servlet,获取签到数据并展示在页面上,同时提供部门筛选功能。
以下是一个完整的示例:
后端:Servlet代码
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>
说明
-
Servlet部分:
GetDingSignInData
Servlet接收前端发送的请求,调用钉钉签到API,并将结果返回给前端。access_token
需要通过钉钉开放平台获取。
-
JSP页面部分:
- 通过表单输入部门ID,并点击按钮发送Ajax请求到Servlet。
- 成功获取签到数据后,使用JavaScript将数据展示在表格中。
这个示例提供了一个基本的实现方法,可以根据具体需求进行扩展和优化。