20分钟学会网络请求的一切主流技术 前端新手遇到问题最多的技术 前端必备技能 AJAX Axios Fetch API https://www.youtube.com/watch?v=-EdsfZDsIR0

1. 原生 API：fetch
2. Axios
3. SuperAgent
4. …

// Generated by AI
async function onClickRegister() {
  if (!username.value) {
    return message.error("Please input username!");
  }
  if (!password.value) {
    return message.error("Please input password!");
  }
 
  message.info("Try to register...");
 
  try {
    const res = await fetch('/api/register', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      // 如果后端用 cookie 做会话并需要携带，解开下面一行
      // credentials: 'include',
      body: JSON.stringify({
        username: username.value,
        password: password.value
      })
    });
 
    // 根据你的后端约定来解析
    const data = await res.json();
 
    if (!res.ok) {
      // HTTP 层面非 2xx
      return message.error(data.message || `Register failed (${res.status})`);
    }
 
    // 业务层面判断
    if (data.success) {
      message.success("Register success!");
      // router.push('/')
    } else {
      message.error(data.message || "Register failed!");
    }
  } catch (err) {
    console.error(err);
    message.error("Network error, please try again later.");
  }
}