Clerk with Next.js local development error

Question

I was integrating Clerk with Next.js an everything was going smoothly until yesterday when I completed my integration and OAuth apps with Google and GitHub and pushed it to production on the Clerk Dashboard! The local development setup went dysfunctional and shows a JSON file in the screen as error:

{
    "errors": [
        {
            "message": "is invalid",
            "long_message": "http://localhost:3000/ does not match one of the allowed values for parameter redirect_url",
            "code": "form_param_value_invalid",
            "meta": {
                "param_name": "redirect_url"
            }
        }
    ],
    "clerk_trace_id": "50853014beb041287ae2239b8e5c065b"
}

And the HTTP response is as follows:

{"errors":[{"message":"is invalid","long_message":"http://localhost:3000/ does not match one of the allowed values for parameter redirect_url","code":"form_param_value_invalid","meta":{"param_name":"redirect_url"}}],"clerk_trace_id":"c17d3948ee86decbf95d11b41c8ddfa4"}

Please help me through this! I couldn't continue my development process after this error!

I tried changing my Clerk instance to Development and changed the API keys in .env.local file from live to test! but still I couldn't resolve the issue

Answer 1

I tried changing the .env.local keys to 'test' and entered my development port at the Clerk Dashboard and everything came back to normal!