Better Auth•2w ago

User avatars/profile pics for Microsoft Entra social sign in

Hello, I am trying to implement social sign in with Microsoft Entra. In the Entra dashboard my App Registration has selected User.Read and User.ReadBasic.All (the latter gives "Allows the app to read a basic set of profile properties of other users in your organization on your behalf. Includes display name, first and last name, email address and photo.") My better auth config lists the User.ReadBasic.All scope:

    microsoft: {
      clientId: MICROSOFT_CLIENT_ID,
      clientSecret: MICROSOFT_CLIENT_SECRET,
      requireSelectAccount: true,
      scope: ["User.ReadBasic.All"],
    },

    microsoft: {
      clientId: MICROSOFT_CLIENT_ID,
      clientSecret: MICROSOFT_CLIENT_SECRET,
      requireSelectAccount: true,
      scope: ["User.ReadBasic.All"],
    },

But the record inserted into the DB by Better Auth doesn't have a profile photo. I'd really appreciate some help figuring this out? Thank you!

Solution:

So I've partially solved it. I've confirmed scope: ["User.ReadBasic.All"] is correct, but the image doesn't provide the placeholder you see in microsoft apps if an avatar isn't explicitly set.

Jump to solution

10 Replies

Ping•2w ago

Could you try using mapProfileToUser and logging what the options are? Just so that you can see if it's possible to get the avatar, and then map that to the image field on your user table. https://www.better-auth.com/docs/concepts/oauth#other-provider-configurations

OAuth | Better Auth

How Better Auth handles OAuth

dan—1106OP•2w ago

thanks for taking a look! I've obfuscated some fields, but there's no image URL in the returned value. Any suggestions on how to make sure it's there? { ver: '2.0', iss: 'https://login.microsoftonline.com/9188040d-***-4c5b-b112-36a304b66dad/v2.0', sub: 'AAAAAAAAAAAAAAAAAAAAAXOo2eF3xdF8', aud: '2363d37a-48ad-467e--1c3dd92fc577', exp: 1744312069, iat: 1744225369, nbf: 1744225369, name: 'xxxx', preferred_username: '16509606656', oid: '00000000-0000-0000-*-8cc4b6c95b8a', email: '[email protected]', tid: '9188040d-6c67-4c5b--36a304b66dad', aio: 'Dlmws2fyx5bUAlu!0N72lJE8Gk**' }

Ping•2w ago

You might need to look into the documentation for that provider, look for which scopes they offer, and try to look for one that could include an image field. If you can't find one, it may mean they just don't support giving user img out. Once you find the scope you need, go to your auth instacen, find that oauth provider config, and pass scope

dan—1106OP•2w ago

ok, thanks for the advice will try to track it down

Ping•2w ago

For example:

Ping•2w ago

🫡

Solution

dan—1106•2w ago

So I've partially solved it. I've confirmed scope: ["User.ReadBasic.All"] is correct, but the image doesn't provide the placeholder you see in microsoft apps if an avatar isn't explicitly set.

dan—1106OP•2w ago

I've run into a related problem: The avatar image is returned as a base 64 encoded image, not a URL. This causes session caching to break: [BetterAuthError: Session data is too large to store in the cookie. Please disable session cookie caching or reduce the size of the session data] Apart from turning off session caching, are there any workarounds you can think of?

Ping•2w ago

There isn't much you can do about this. Unless you can convert this base64 to a png and store it in your own s3 bucket or something to get a URL and then save that URL in the image field? It's an idea, but probably not what you want to do.

dan—1106OP•2w ago

thanks @Ping ! Appreciate all the advice!

Gaming

Programming

User avatars/profile pics for Microsoft Entra social sign in

Did you find this page helpful?