fix: update protection to accept array with multiples options

[viniciuscr]

What:
Add new protection value: "both", to use both handlers (state and pkce).

Why:
Some provider require the state param when using the pkce protection as reported on this issues:
#1530
#1367

How:
Just editing the handlers validations to handle in case of "both" is set on protection.

Checklist:

• Documentation
• Tests
• Ready to be merged
  
  It's note ready, actually its more a suggestion than a PR.

Note: I called it both, but it could have other names, such as: pkce-state or pkce-with-state

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/nextauthjs/next-auth/9PLdXwXQpGFdTgrAe2J3MzaKZ5BW
✅ Preview: https://next-auth-git-fork-viniciuscr-fix-pkce-state-nextauthjs.vercel.app

[balazsorban44]

I have been thinking about this, and I am curious what do you think if we implement it such that protection could take an array as well? so protection: ["pkce", "state"] so it's room for the future.

In any way, have you tried/verified that this resolves your Okta problem?

[viniciuscr]

I have been thinking about this, and I am curious what do you think if we implement it such that protection could take an array as well? so protection: ["pkce", "state"] so it's room for the future.

In any way, have you tried/verified that this resolves your Okta problem?

Using the array to pass multiples validation does sounds good. I see in the future it could be
protection: ["pkce", "state", "nonce"]
it would be highly configurable, but the user must know this kind of specifications from each provider and type of authentication used.

I've just found out that nonce is not required with response_type: "code" but it is when response_type: "id_token" or response_type: "token". this way one must be aware that one must use protection: ["pkce", "state", "nonce"] when `response_type: "id_token". What could be simplified somehow in the future.

So another solution would be a flag/config on the provider to indicate that the provider wants a state when is pkce.
it does looks like a few needed it but most of the providers does not.

I've noticed that currently the response_type is enforced to be always 'code' and it looks like to be working for me, but I don’t know if we will find scenarios where it must be 'id_token' or 'token'.

This changes that I've made worked, I was able to successfully authenticate on okta, but because the way i've tested (using yarn link , I've got some issues related to duplicate reacts, that happens when using yarn link) I was unable to got much further on the callback. Anyways, it should works, since the only diference is that the state callback will validade the state param.

[viniciuscr]

Any update here?
I see more people are getting stuck with the same problem and I kind of need it to use next-auth, otherwise I will have to jump to the okta sdk.

[balazsorban44]

Sorry if I haven't been explicit about it, but if you could change the implementation to be able to provide an array instead of "both" for protection to have more room for the future, I could proceed to merge this.

[viniciuscr]

Sorry if I haven't been explicit about it, but if you could change the implementation to be able to provide an array instead of "both" for protection to have more room for the future, I could proceed to merge this.

No worries, it was an easy change.
Now it accepts an array but also keeps compatibility with string.

[LuisValgoi]

Looks good to me

[viniciuscr]

@iaincollins @balazsorban44
any advance to merge this PR?

[balazsorban44]

Thanks for your patience! I finally had the chance to check this out locally, and it seems to work nicely! Tested with Auth0.

[github-actions]

🎉 This PR is included in version 3.14.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[github-actions]

🎉 This PR is included in version 4.0.0-next.5 🎉

The release is available on:

• npm package (@next dist-tag)
• GitHub release

Your semantic-release bot 📦🚀