bug: Getting invalid_redirect_uri on local docker instance

[raminious]

Describe the bug

I get this error when I'm trying to connect a local React app to a local Logto instance running on Docker

{"code":"oidc.invalid_redirect_uri","message":"`redirect_uri` did not match any of the client's registered `redirect_uris`.","error":"invalid_redirect_uri","error_description":"redirect_uri did not match any of the client's registered redirect_uris","state":"1PRuqSahxd8XK-d6guzqUV9v-9LkQOaCbwFrbBU2aj_0pY0Kunc5ujKkOKMocPHNcPkvjYlY-cOsFGxb7b-yQg","iss":"http://localhost:3001/oidc"}

Expected behavior

It should display login screen

How to reproduce?

run Logto and create an app:

curl -fsSL https://raw.githubusercontent.com/logto-io/logto/HEAD/docker-compose.yml | \
docker compose -p logto -f - up

Create a simple react app:

const config: LogtoConfig = {
  endpoint: 'http://localhost:3001',
  appId: '****',
}

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <LogtoProvider config={config}>
      <App />
    </LogtoProvider>
  </React.StrictMode>,
)

import { useLogto } from "@logto/react"

export default function App() {
  const { signIn, signOut, isAuthenticated } = useLogto()

  return (
    <div>
      {
        isAuthenticated ? (
          <button onClick={() => signOut()}>Sign Out</button>
        ) : (
          <button onClick={() => signIn('http://localhost:5170/callback')}>Sign In</button>
        )
      }
    </div>
  )
}

Click on SingIn app.

Context

• [ ] Logto Cloud
• [x] Self-hosted, Logto version =
  • [x] Container (Docker image)
  • [ ] Raw Node.js

Screenshots

[raminious]

sorry it was a misconfiguration