Django DRF结合simplejwt首次API调用返回AnonymousUser问题排查

问题原因 #

1. axios实例初始化时Authorization头格式错误：你创建axios实例的代码中，JWT和token之间缺少空格，生成的请求头是JWT<token值>，不符合simplejwt要求的JWT <token值>的格式，导致首次请求时后端无法识别token，返回匿名用户。
2. axios头静态缓存问题：axios实例的默认headers是创建时一次性读取localStorage生成的，后续你更新localStorage中的token时，实例的默认headers不会自动同步。你在登录成功后手动修改了axiosInstance.defaults.headers['Authorization']为正确带空格的格式，所以第二次请求时携带的头是正确的，就能正常识别用户身份。
3. 你提到的articles视图能正常运行，是因为调用该视图时已经完成登录逻辑，axios的头已经被更新为正确格式，所以不会出现问题。

解决方案 #

1. 修复axios初始化时的头格式错误 #

修改axios实例创建代码，在JWT后加空格：

export const axiosInstance = axios.create({
    baseURL: baseURL,
    timeout: 5000,
    headers : {
        Authorization: localStorage.getItem('access_token')
            ? 'JWT ' + localStorage.getItem('access_token') // 新增空格
            : null,
        'Content-Type' : 'application/json',
        accept : 'application/json'
    }
})

2. 新增请求拦截器动态获取token（推荐） #

避免静态缓存导致的头不同步问题，每次请求都从localStorage读取最新的token：

// 写在axios实例创建之后
axiosInstance.interceptors.request.use(
  config => {
    const accessToken = localStorage.getItem('access_token')
    if (accessToken) {
      config.headers.Authorization = `JWT ${accessToken}`
    }
    return config
  },
  error => Promise.reject(error)
)

3. 优化接口重试逻辑 #

移除无限递归重试，增加重试次数限制，避免服务端被压垮：

const fetchAuthorData = (retryTimes = 0) => {
  axiosInstance.get('authors/')
  .then((res) => {
    setAuthor(res.data)
    fetchAuthorThreads()
    fetchAuthorArticles()
  }).catch((err) => {
    // 仅401错误最多重试1次，其余错误直接跳转登录
    if (err.response?.status === 401 && retryTimes < 1) {
      fetchAuthorData(retryTimes + 1)
    } else {
      history.push('/login')
    }
  })
}

4. 后端视图优化（可选） #

未认证的请求返回401状态码，符合HTTP语义，方便前端做统一错误处理：

@api_view(['GET'])
def author(request):
    print(request.user)
    if request.user.is_authenticated:
        author = request.user
        serializer = AuthorAccessSerializer(author, many=False)
        return Response(serializer.data)
    else:
        return HttpResponse(status=401)

其他非必要但建议修改的配置 #

你当前的ALLOWED_HOSTS配置存在错误，不能带http前缀，修改为：

ALLOWED_HOSTS=['127.0.0.1', 'localhost']

内容的提问来源于stack exchange，提问作者Been-H