尝试将xmlhttprequest从js转换为Java时键入错误,以获取所有员工的列表并将其显示在我的网页上

我一直陷于这个错误中,并且我尝试从许多站点上阅读为什么会出现此错误,但是我不知道如何根据我的具体情况解决我的问题。当我转到网页时,在console.log上收到未捕获的TypeError。它不会显示我的员工列表。它说有一个:

 Uncaught TypeError: empl is not iterable
at displayAllEmployees (ViewEmployees.js:38) and 
at XMLHttpRequest.xhr.onreadystatechange

这是我的JS文件,它将从我的servlet请求我的雇员列表

let requestUrl = "http://localhost:8080/ERS/api/employee"; let token = sessionStorage.getItem("token"); if (!token) {
window.location.href = "http://localhost:8080/ERS/tokennull"} else {
let tokenArr = token.split(":");
if (tokenArr.length === 2) {
    let baseUrl = "http://localhost:8080/ERS/api/employee?id=";
    sendAjaxGet(baseUrl + tokenArr[0],displayAllEmployees);
} else {
    window.location.href = "http://localhost:8080/ERS/error";
}

function sendAjaxGet(url,callback) {

let xhr = new XMLHttpRequest();
xhr.open("GET",url);
xhr.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {
        callback(this);
    }
} xhr.setRequestHeader("Authorization",token); xhr.send(); }

这是上面尝试解析响应的同一个JS文件中的函数。console.log中的“ empl”变量在此处。我使用for(let of)来遍历我的列表,但我不喜欢这样做。它应该为从我的数据库中检索到的每个员工添加一个新的表行。

function displayAllEmployees(employee) {

let empl = JSON.parse(employee.response);
let table = document.getElementById("empl-table");
console.log('you reached line 36');

for(let emp of empl){
let newRow = document.createElement("tr");

newRow.innerHTML = `<td>${empl.employeeID}</td><td>${empl.fullName}</td><td>${empl.username}</td><td>${empl.passWord}</td>
<td>${empl.isManager}</td>`;
table.appendChild(newRow);

 } }

这是我的FrontController Servlet,它接收来自客户端的请求。

public class FrontController extends DefaultServlet {


private static final long serialVersionUID = 1L;

private RequestHelper requestHelper = new RequestHelper();

public FrontController() {
    super();

}

protected void doGet(HttpServletRequest request,HttpServletResponse response)
        throws ServletException,IOException {
    String path = request.getServletPath();
    if (path.startsWith("/static/")) {
        super.doGet(request,response);
    } else {
        requestHelper.processGet(request,response);
    }
}

这是我的请求助手,它将检查客户端请求位于哪个端点,然后转到适当的委托类并调用正确的方法。在这种情况下,它将转到“员工”切换选项。

public class RequestHelper {

private ViewDelegate viewDelegate = new ViewDelegate();
private EmployeeDelegate employeeDelegate = new EmployeeDelegate();
private ReimbursementDelegate reimDelegate = new ReimbursementDelegate();
private AuthDelegate authDelegate = new AuthDelegate();

public RequestHelper() {
    super();

}

public void processGet(HttpServletRequest request,HttpServletResponse response)
        throws IOException,ServletException {
    String path = request.getServletPath();
    if (path.startsWith("/api/")) {

        if (!authDelegate.isAuthorized(request)) {
            response.sendError(401);
            return;
        }

        String record = path.substring(5);
        switch (record) {
        case "employee":
            employeeDelegate.getEmployees(request,response);
            break;
        case "reimbursement":
            reimDelegate.getReimbursement(request,response);
            break;

我的EmployeeDelegate类检查授权标头中索引1上的键/值,该键/值表示布尔值isManager,并验证用户是经理还是普通员工。如果boolStr == true,则应检索该列表,否则它将检查我的授权令牌中的ID(用户ID = [0],isManager = [1])。

当我要求通过其ID获取1位特定员工的所有信息时,它确实起作用。只是不适用于所有员工的名单。

public class EmployeeDelegate {

private EmployeeDao employeeDao = new EmployeeDaoImpl();

public void getEmployees(HttpServletRequest request,HttpServletResponse response) throws IOException {
    String idStr = request.getParameter("id");
    String boolStr = request.getHeader("Authorization").split(":")[1];
    if (boolStr == "true") {
        List<Employee> employee = employeeDao.getallEmployees();
        try (PrintWriter pw = response.getWriter();) {
            pw.write(new ObjectMapper().writeValueAsString(employee));

        }
    } else {
        if (idStr.matches("^\\d+$")) {
            Employee e = employeeDao.getEmployeeById(Integer.parseInt(idStr));
            if (e == null) {
                response.sendError(404,"No user with given ID");
            } else {
                try (PrintWriter pw = response.getWriter()) {
                    pw.write(new ObjectMapper().writeValueAsString(e));
                }
            }
        } else {
            response.sendError(400,"Invalid ID param");
        }
    }

}

这是我的AuthDelegate类,供您参考,该类将在用户成功登录时创建一个令牌。然后检查该用户是否被授权为管理员。

public class AuthDelegate {

private EmployeeDao employeeDao = new EmployeeDaoImpl();

public boolean isAuthorized(HttpServletRequest request) {
    String authToken = request.getHeader("Authorization");
    // this will check to see if there is an auth header
    if (authToken != null) {
        String[] tokenArr = authToken.split(":");
        // if the token is formatted the way we expect,we can take the id from it and
        // query for that user or grab the boolean for isManager
        if (tokenArr.length == 2) {
            String idStr = tokenArr[0];
            String boolStr = tokenArr[1];
            if (idStr.matches("^\\d+$")) {
                // check to see if there is a valid user and if that user is the appropriate
                // role in their token
                Employee e = employeeDao.getEmployeeById(Integer.parseInt(idStr));
                if (e != null && e.getisManager() == Boolean.parseBoolean(boolStr)) {

                    return true;
                }
            }
        }

    }
    return false;
}

public void authenticate(HttpServletRequest request,HttpServletResponse response) throws IOException {
    String username = request.getParameter("username");
    String password = request.getParameter("password");

    Employee e = employeeDao.getEmployeeByusernameAndPassword(username,password);

    if (e != null) {
        String token = e.getEmployeeID() + ":" + e.getisManager();
        System.out.println(token);
        response.setStatus(200);
        response.setHeader("Authorization",token);
    } else {
        response.sendError(401);
    }

} }

这是我的ViewEmployees页面的HTML文档。当用户单击主屏幕导航栏中的选项卡时,它将显示我数据库中所有雇员的列表。

<!DOCTYPE html>
<html>

<head>
  <meta charset="ISO-8859-1">
  <title>View Employees</title>

  <link rel="icon" href="https://img.icons8.com/bubbles/100/000000/star.png" type="image">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.0/css/bootstrap.min.css" integrity="sha384-SI27wrMjH3ZZ89r4o+fGIJtnzkAnFs3E4qz9DIYioCQ5l9Rd/7UAa8DHcaL8jkWt" crossorigin="anonymous">
  <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.0/js/bootstrap.min.js" integrity="sha384-3qaqj0lc6sV/qpzrc1N5DC6i1VRn/HyX4qdPaiEFbn54VjQBEU341pvjz7Dv3n6P" crossorigin="anonymous"></script>


  <style>
    body {
      background-image: url(https://images.pexels.com/photos/1323712/pexels-photo-1323712.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260
);
    }
  </style>

</head>

<body>
  <div class="container">

    <h1 align="center">View All Employees</h1>

    <table id="empl-table" class="table table-striped table-bordered">
      <tr>
        <th>User Id</th>
        <th>Full Name</th>
        <th>username</th>
        <th>Password</th>
        <th>Manager?</th>

      </tr>
    </table>
  </div>
  <script type="text/javascript" src="static/scripts/ViewEmployees.js"></script>
</body>

</html>

vcx111 回答:尝试将xmlhttprequest从js转换为Java时键入错误,以获取所有员工的列表并将其显示在我的网页上

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/2961937.html

大家都在问