从Django REST Framework取数据遇401 Unauthorized错误求助

• 第一步：通过登录接口获取认证令牌
  先访问你提供的Swagger文档（http://68.183.74.14:4005/swagger/），找到登录相关接口（通常命名为login、token或auth/token），这类接口一般是POST请求。用你的账号密码发送请求获取认证令牌，示例代码：

  fetch("http://68.183.74.14:4005/api/auth/token/", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      username: "你的账号",
      password: "你的密码"
    })
  })
  .then(response => response.json())
  .then(data => {
    // 保存令牌，可存入localStorage或变量
    const token = data.token; // 字段名可能为access/token，以Swagger返回为准
    console.log("获取到令牌:", token);
    // 携带令牌请求邮件列表
    fetchEmails(token);
  })
  .catch(error => console.log(error));
  

• 第二步：携带令牌请求邮件列表接口
  请求邮件列表时，需在请求头中添加Authorization字段，格式根据后端认证方式调整：

  • Token认证：格式为Token 你的令牌
  • JWT认证：格式为Bearer 你的令牌
    示例代码：

  function fetchEmails(token) {
    fetch("http://68.183.74.14:4005/api/emails/", {
      headers: {
        "Authorization": `Token ${token}` // 根据实际认证方式调整前缀
      }
    })
    .then(response => {
      if (response.ok) {
        return response.json();
      }
      throw new Error("请求失败");
    })
    .then(emails => console.log("邮件列表:", emails))
    .catch(error => console.log(error));
  }
  

• 关键注意事项

  • 确认Swagger文档中登录接口的参数字段，部分接口可能用email替代username作为登录标识
  • 认证头的前缀必须和后端配置一致，前缀错误会导致仍返回401
  • 若前端与后端跨域，需确保后端已配置CORS允许你的前端域名访问

内容的提问来源于stack exchange，提问作者Yura Shtefanko