nodejs和java混编

java代码，使用Spring：

@RestController
public class UserController {

    private List<User> userList = new ArrayList<>();

    @PostMapping("/register")
    public String register(@RequestBody User user) {
        // 处理用户注册逻辑
        userList.add(user);
        return "success";
    }

    @PostMapping("/login")
    public String login(@RequestBody User user) {
        // 处理用户登录逻辑
        for (User u : userList) {
            if (u.getUsername().equals(user.getUsername()) && u.getPassword().equals(user.getPassword())) {
                return "success";
            }
        }
        return "fail";
    }

    @GetMapping("/users")
    public List<User> getUsers() {
        // 返回用户列表
        return userList;
    }
}

nodejs代码：

const express = require('express');
const httpProxy = require('http-proxy');

const proxy = httpProxy.createProxyServer();
const app = express();

app.use(express.json());

app.post('/register', (req, res) => {
  proxy.web(req, res, { target: 'http://localhost:8080/register' });
});

app.post('/login', (req, res) => {
  proxy.web(req, res, { target: 'http://localhost:8080/login' });
});

app.get('/users', (req, res) => {
  proxy.web(req, res, { target: 'http://localhost:8080/users' });
});

app.listen(3000, () => {
  console.log('Server started on port 3000');
});

html代码：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>User Management System</title>
</head>
<body>
  <h1>User Management System</h1>

  <h2>Register</h2>
  <form id="register-form">
    <label>Username:</label>
    <input type="text" name="username">
    <br>
    <label>Password:</label>
    <input type="password" name="password">
    <br>
    <button type="submit">Register</button>
  </form>

  <h2>Login</h2>
  <form id="login-form">
    <label>Username:</label>
    <input type="text" name="username">
    <br>
    <label>Password:</label>
    <input type="password" name="password">
    <br>
    <button type="submit">Login</button>
  </form>

  <h2>User List</h2>
  <ul id="user-list"></ul>

  <script>
    const registerForm = document.getElementById('register-form');
    const loginForm = document.getElementById('login-form');
    const userList = document.getElementById('user-list');

    registerForm.addEventListener('submit', (event) => {
      event.preventDefault();
      const username = registerForm.elements['username'].value;
      const password = registerForm.elements['password'].value;
      fetch('/register', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({
          username,
          password
        })
      }).then((response) => {
        if (response.ok) {
          alert('Register success');
        } else {
          alert('Register fail');
        }
      });
    });

    loginForm.addEventListener('submit', (event) => {
      event.preventDefault();
      const username = loginForm.elements['username'].value;
      const password = loginForm.elements['password'].value;
      fetch('/login', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({
          username,
          password
        })
      }).then((response) => {
        if (response.ok) {
          alert('Login success');
        } else {
          alert('Login fail');
        }
      });
    });

    fetch('/users').then((response) => {
      if (response.ok) {
        return response.json();
      }
    }).then((users) => {
      for (const user of users) {
        const li = document.createElement('li');
        li.textContent = user.username;
        userList.appendChild(li);
      }
    });
  </script>
</body>
</html>

猜你喜欢