POST http://127.0.0.1:8000/api/v1/users/ 400 (Bad Request)

Question

I'm following a tutorial verbatim. The following code throws up a 400 Bad Request error, with the following information:

data: undefined status: undefined statusText: undefined headers: undefined config: undefined request: undefined

Code

if (!this.errors.length) {
  const formData = {
    username: this.username,
    password: this.password1,
  };
  console.log(formData);

  axios.post("/api/v1/users/", formData);
}

Console.log prints the following, so there's no issue with the data:

{username: '[email protected]', password: 'code'}

A bit surprised as I've set up CORS and djoser exactly as in the tutorial. This is the relevant code in urls.py:

urlpatterns = [
  path('admin/', admin.site.urls),

  path('api/v1/', include('djoser.urls')),
  path('api/v1/', include('djoser.urls.authtoken')),
]

I'm able to go to http://127.0.0.1:8000/api/v1/users/ and view and post via my browser, so the issue must be with axios, but I'm not sure what it is. Any thoughts?

Answer 1

I realised that I'm getting this error when I input (dummy) passwords that are either short (e.g., 4 letters) or look too similar to the username input. For example, "[email protected]" with password "something" will throw up this error, but more sophisticated passwords won't.