Oauth error invalid_request: The redirect_uri is not whitelisted (Shopify app install)

TL;DR

Installing a shopifyapp Rails app in a dev store fails on the OAuth step with this error. The app ran on YOURHOST behind ngrok, and the redirect_uri parameter sent during installation did not exactly match any URL in the Partners dashboard whitelist.

Steps

1. Installing a shopifyapp Rails app in a dev store fails on the OAuth step with this error. The app ran on YOURHOST behind ngrok, and the redirect_uri parameter sent during installation did not exactly match any URL in the Partners dashboard whitelist. The mismatch can be subtle: a different ngrok subdomain, http vs https, a trailing slash, or a double slash (e.g. ...//auth/shopify/callback) caused by a trailing slash in the app host env var.
2. Copy the exact redirecturi value from the browser address bar on the error page, URL-decode it, and add that exact string to Partners dashboard > App setup > Allowed redirection URL(s). Multiple URLs are allowed, one per line, so whitelist both YOURHOST and your ngrok URL, and match the scheme exactly (http vs https both need entries if both are used). Watch for trailing slashes: a trailing slash in your app host variable can produce a double slash in the callback path and fail the match. The reporter confirmed the install worked once the exact redirecturi was whitelisted. Source: https://github.com/Shopify/shopifyapp/issues/486

When to use

You are seeing this: The mismatch can be subtle: a different ngrok subdomain, http vs https, a trailing slash, or a double slash (e.g....//auth/shopify/callback) caused by a trailing slash in the app host env var. Use this skill when you run into "Oauth error invalidrequest: The redirecturi is not whitelisted (Shopify app install)".

When not to use

If your error message or symptom does not match what is described above, this is probably not your fix. Search for your exact error text instead of forcing this one to fit.

Versions

No specific versions are mentioned in the source material, so treat the fix as generally applicable and check the examples against whatever you have installed.

Why this happens

The original report does not dig into a root cause. It documents the symptom and the fix that resolved it.

Sources

• https://github.com/Shopify/shopify_app/issues/486

Question asked in the thread: Installing a shopifyapp Rails app in a dev store fails on the OAuth step with this error. The app ran on YOURHOST behind ngrok, and the redirect_uri parameter sent during installation did not exactly match any URL in the Partners dashboard whitelist. The mismatch can be subtle: a different ngrok subdomain, http vs https, a trailing slash, or a double slash (e.g. ...//auth/shopify/callback) caused by a trailing slash in the app host env var.

Verified answer: Copy the exact redirecturi value from the browser address bar on the error page, URL-decode it, and add that exact string to Partners dashboard > App setup > Allowed redirection URL(s). Multiple URLs are allowed, one per line, so whitelist both YOURHOST and your ngrok URL, and match the scheme exactly (http vs https both need entries if both are used). Watch for trailing slashes: a trailing slash in your app host variable can produce a double slash in the callback path and fail the match. The reporter confirmed the install worked once the exact redirecturi was whitelisted. Source: https://github.com/Shopify/shopifyapp/issues/486

Thread: https://vectle.com/threads/thrP5SeG7pC5JPj2GSfeBIOQ