Trouble with user registration in React app using WordPress REST API

Frontend
1

I’m having trouble with my React app that uses the WordPress REST API for user registration. My form includes fields for username, email, and password. I use Axios to make API calls and JWT for authorization, yet I keep encountering a 400 error stating “Missing parameter(s): password.” Below is a reworked version of my code:

const SignUp = () => {
  const [formData, setFormData] = useState({
    username: '',
    email: '',
    password: ''
  });

  const handleSubmit = async (e) => {
    e.preventDefault();
    try {
      const token = localStorage.getItem('authToken');
      const response = await axios.post(
        'http://mysite.com/wp-json/wp/v2/users',
        formData,
        {
          headers: {
            'Content-Type': 'application/json',
            'Authorization': `Bearer ${token}`
          }
        }
      );
      console.log('User created:', response.data);
    } catch (error) {
      console.error('Registration failed:', error.response.data);
    }
  };

  // Form rendering code here
}

Any thoughts on what might be causing this error?

2

I’ve encountered similar issues when working with the WordPress REST API for user registration. The “Missing parameter(s): password” error often occurs due to WordPress’s security measures. Try modifying your API endpoint to ‘/wp-json/wp/v2/users/register’ instead of ‘/wp-json/wp/v2/users’. This endpoint is specifically designed for user registration and should accept the password parameter.

Additionally, ensure your WordPress installation has the necessary plugins or custom code to handle user registration via the REST API. Some setups require additional configuration or plugins like ‘JWT Authentication for WP REST API’ to work properly.

Lastly, double-check that your server’s CORS settings allow requests from your React app’s domain. Incorrect CORS configuration can sometimes lead to unexpected errors during API calls.

3

hey man, i had similar issues. try adding ‘application/x-www-form-urlencoded’ as the Content-Type header instead of json. also, make sure ur sending the password as a separate parameter, not nested in formData. like this:

const params = new URLSearchParams();
params.append(‘username’, formData.username);
params.append(‘email’, formData.email);
params.append(‘password’, formData.password);

hope this helps!

4

hmmm, have you considered using a different api endpoint? maybe ‘/wp-json/custom/v1/register’ could work better? also, are u sure the password is being sent correctly in the formData? Sometimes the data gets lost in transit. what if u try logging the formData right before the axios call to double-check? just some ideas to explore!