Adding OpenStreetMap login to Auth0

So you want to add OSM as an OAuth provider to Auth0? Here's a tip - you do not want to create a custom social connection! Instead, you need to create an "OpenID Connect" provider. Here's how.

So you want to add OSM as an OAuth provider to Auth0? Here’s a tip - you do not want to create a custom social connection!

Instead, you need to create an “OpenID Connect” provider. Here’s how.

OpenSteetMap (https://shkspr.mobi/blog/2026/02/adding-openstreetmap-login-to-auth0/#opensteetmap)

As per the OAuth documentation (https://wiki.openstreetmap.org/wiki/OAuth#Using_OpenStreetMap_as_identity_provider) you will need to:

• Register a new app at https://www.openstreetmap.org/oauth2/applications/ (https://www.openstreetmap.org/oauth2/applications/)

• Give it a name that users will recognise

• Give it a redirect of https://Your Auth0 Tenant.eu.auth0.com/login/callback

• Tick the box for “Sign in using OpenStreetMap”

Once created, you will need to securely save your Client ID and Client Secret.

Auth0 (https://shkspr.mobi/blog/2026/02/adding-openstreetmap-login-to-auth0/#auth0)

These options change frequently, so use this guide with care.

• Once you have logged in to your Auth0 Tennant, go to Authentication → Enterprise → OpenID Connect → Create Connection

• Provide the new connection with the Client ID and Client Secret

• Set the “scope” to be openid

• Set the OpenID Connect Discovery URL to be https://www.openstreetmap.org/.well-known/openid-configuration

• In the “Login Experience” tick the box for “Display connection as a button”

• Set the favicon to be or other suitable graphic

Next Steps (https://shkspr.mobi/blog/2026/02/adding-openstreetmap-login-to-auth0/#next-steps)

We’re not quite done, sadly.

The details which OSM sends back to Auth0 are limited, so Auth0 is missing a few bits:

{ “created_at”: “2026-02-29T12:34:56.772Z”, “identities”: [ { “user_id”: “openstreetmap-openid|123456”, “provider”: “oidc”, “connection”: “openstreetmap-openid”, “isSocial”: false } ], “name”: “”, “nickname”: “”, “picture”: “https://cdn.auth0.com/avatars/default.png”, “preferred_username”: “Terence Eden”, “updated_at”: “2026-02-04T12:01:33.772Z”, “user_id”: “oidc|openstreetmap-openid|123456”, “last_ip”: “12.34.56.78”, “last_login”: “2026-02-29T12:34:56.772Z”, “logins_count”: 1, “blocked_for”: [], “guardian_authenticators”: [], “passkeys”: [] }

Annoyingly, Auth0 doesn’t set a name or nickname - so you’ll need to manually get the preferred_username, or create a “User Map”:

{ “mapping_mode”: “use_map”, “attributes”: { “nickname”: “\({context.tokenset.preferred_username}", "name": "\){context.tokenset.preferred_username}” } }

There’s also no avatar image - only the default one.

Getting the Avatar Image (https://shkspr.mobi/blog/2026/02/adding-openstreetmap-login-to-auth0/#getting-the-avatar-image)

The OSM API (https://wiki.openstreetmap.org/wiki/API_v0.6) has a method for getting user data (https://wiki.openstreetmap.org/wiki/API_v0.6#Methods_for_user_data).

For example, here’s all my public data: https://api.openstreetmap.org/api/0.6/user/98672.json (https://api.openstreetmap.org/api/0.6/user/98672.json) - thankfully no authorisation required!

{ “user”: { “id”: 98672, “display_name”: “Terence Eden”, “img”: { “href”: “https://www.gravatar.com/avatar/52cb49a66755f31abf4df9a6549f0f9c.jpg?s=100&d=https%3A%2F%2Fapi.openstreetmap.org%2Fassets%2Favatar_large-54d681ddaf47c4181b05dbfae378dc0201b393bbad3ff0e68143c3d5f3880ace.png” } } }

Alternatively, you can use the Unavatar service (https://github.com/microlinkhq/unavatar/issues/488) to get the image indirectly.

I hope that’s helpful to someone!

Write a comment
No comments yet.