Next-auth: Auth provider [Apple]

[erhankaradeniz]

Your question
When using the Apple auth provider there is no name in the session.user.name object. it's filled with a random string.

What are you trying to do
Retrieving the name of the user that is logged in.

Is there something that I'm missing to fetch the name of a user. the email is returned correctly as a value. Is this intended behaviour? (if yes, that's fine too, but I'm wondering if I can autofill that for a user after login)

[iaincollins]

Hmm interesting, I don't know! @geraldnolan is the expert on that and my be able to answer that.

[geraldnolan]

@erhankaradeniz Thanks for kicking the the tires with sign in with apple. You will have to give us a little bit more time to update this. Once updated you will have to revoke access to your website using the following link.

https://appleid.apple.com/#!&page=signin

Select Stop using Apple ID. After we update the code, the Name will be set.

@iaincollins haha 👍We are working on getting you access so you can be the expert.
It turns out there is a bit more coding required to get the user object according to apple documentation. I thought it would return in the id_token response from Apple. (Which only has the email address). The random string is just the sub (I placed that there just in case the name was required in someone's DB). The user object must be stored on the first login; otherwise, it will not be returned after that.

I have to modify the callback once more:

if (req.method === 'POST') {
        console.log("Req ->", req.params)
        console.log("Body ->", req.body)
        var body = JSON.parse(JSON.stringify(req.body));
        code = body.code;
        user = body.user
      }


Body -> [Object: null prototype] {
  state: 'Random State',
  code: 'Random Code',
  user: '{"name":{"firstName":"Gerald","lastName":"Nolan"},"email":"[email protected]"}'
}

Apple Documentation

A successful response contains the following parameters:

code
A single-use authorization code that is valid for five minutes.

id_token
A JSON web token containing the user’s identity information.

state
The state contained in the Authorize URL.

user
A JSON string containing the data requested in the scope property. The returned data is in the following format: { "name": { "firstName": string, "lastName": string }, "email": string }

If an error occurs, the HTTP body contains the following parameters:

error
The returned error code.

state
The state contained in the Authorize URL.

[erhankaradeniz]

Ah nice, thanks for the quick replies! If there is anything I can help with, let me know ;)

Also maybe not directly related to mthis question, but it is related to the apple auth provider.

When you login via apple you come to a screen which ask would you like to use the email (email here). You can choose continue or cancel.

After you click cancel you get returned to the callback page you provided in [...nextAuth].js but the next.js server crashes (on develop with ‘now dev’ as the runner). Which means I have to stop the server and restart it again. (Again not sure if I’m doing something wrong, but it seems like the cancel button / callback is not handled correctly by the callback url).

[iaincollins]

When you login via apple you come to a screen which ask would you like to use the email (email here). You can choose continue or cancel.

After you click cancel you get returned to the callback page you provided in [...nextAuth].js but the next.js server crashes (on develop with ‘now dev’ as the runner)

Oh I'm sorry to hear that, thanks for letting us know.

That is supposed to be fixed in [email protected] but maybe the Apple provider get's handled differently somehow.

Can you confirm if you are on v2.2 and if so, could you share the callback URL is comes back to when it crashed (just need the path and query string).

[erhankaradeniz]

When you login via apple you come to a screen which ask would you like to use the email (email here). You can choose continue or cancel.

After you click cancel you get returned to the callback page you provided in [...nextAuth].js but the next.js server crashes (on develop with ‘now dev’ as the runner)

Oh I'm sorry to hear that, thanks for letting us know.

That is supposed to be fixed in [email protected] but maybe the Apple provider get's handled differently somehow.

Can you confirm if you are on v2.2 and if so, could you share the callback URL is comes back to when it crashed (just need the path and query string).

I'm running on v 2.2.0 so that's not the issue I guess.
The callback url it goes back to is the standard one [domain]/api/auth/callback/apple. It gives this error in my terminal:

```https://next-auth.js.org/errors#oauth_get_access_token_error
/...[location]/node_modules/next-auth/dist/server/lib/oauth/callback.js:56
_decodeToken(provider, accessToken, refreshToken, results.id_token, function () {
^

TypeError: Cannot read property 'id_token' of undefined```

[iaincollins]

Thanks @erhankaradeniz!

It looks like the update in 2.2 didn't address this issue for providers that use ID Token - which as far as built-in providers go, is only Apple, but it also works with providers like Auth0 and some Open ID services.

I have raised a fix for users cancelling causing a crash in #352. The fix should go out in the next release.

If you want, you can try it out now as [email protected]

[iaincollins]

@geraldnolan Thanks for that detailed answer as to what is going on!

It turns out there is a bit more coding required to get the user object according to apple documentation. I thought it would return in the id_token response from Apple. (Which only has the email address)

Oh! Yeah that is weird and dumb of them. Other providers support this option and do exactly that.

[iaincollins]

This is working nicely now in the v3 beta and is working on https://next-auth-example.now.sh