Snapchat Provider - Missing PKCE Parameters

KiritoXD01 commented 2 years ago

Hi, I'm having an issue with the Snapchat integration, right now its showing Missing PKCE parameters.

I found a previous issue here not there was no resolution for it.

Everything is correct both in snapchat dev portal and Socialite

trbsi commented 2 years ago

I have the same problem, I haven't found any solution

KiritoXD01 commented 2 years ago

@trbsi I found a solution in Laravel, but basically I did the whole process from scratch, creating the token and PKCE keys and sending them to a snapchat URL

trbsi commented 2 years ago

@KiritoXD01 How did you solve it?

KiritoXD01 commented 2 years ago

` $state = Str::random(40); $codeVerifier = Str::random(128);

    session()->put([
        "state"         => Str::random(40),
        "code_verifier" => $codeVerifier
    ]);

    $codeChallenge = strtr(rtrim(base64_encode(hash('sha256', $codeVerifier, true)), '='), '+/', '-_');

    $query = http_build_query([
        'client_id'             => config('services.snapchat.client_id'),
        'redirect_uri'          => config('services.snapchat.redirect'),
        'response_type'         => 'code',
        'scope'                 => 'https://auth.snapchat.com/oauth2/api/user.display_name https://auth.snapchat.com/oauth2/api/user.bitmoji.avatar',
        'state'                 => $state,
        'code_challenge'        => $codeChallenge,
        'code_challenge_method' => 'S256',
    ]);

    return redirect("https://accounts.snapchat.com/accounts/oauth2/auth?$query");

`

This is Laravel/PHP but you can translate the process to other languages, basically you create a random 128 characters long string as a code verifier and a 40 character long state string, them you base64 encode the code verifier with the format codeChallenge = strtr(rtrim(base64_encode(hash('sha256', $codeVerifier, true)), '='), '+/', '-_');, create the query string with the info I sent and then redirect to snapchat's url

trbsi commented 2 years ago

Socialite plugin for Snapchat is working fine. The problem why people get that stupid "Missing PKCE Parameters " error is because you need to do some extra steps: