vue.js - Google OAuth 2.0 Invalid token format Vue/PHP

Question

I am trying to setup a google login on my webpage and to store the users token in some tables to recognize which user is logged in.

Now i am able to open the google login Iframe and to send the logged in User Data to the backend. But in the backend this error is thrown. Uncaught InvalidArgumentException: Invalid token format

Vue Frontend, following code is working and i am recieving the user data

onUserLoggedIn(user) {
  var id_token = user.getAuthResponse().id_token;

  axios
    .post(
      "/api",
      {
        action: "googleSignin",
        token: id_token,
      },
      {
        headers: {
          "Content-Type": "application/x-www-form-urlencoded",
        },
      }
    )
    .then((response) => {
      console.log(response);
    });
},

And the PHP backend

$received_data = json_decode(file_get_contents("php://input"));

if($received_data->action == 'googleSignin'){
    require_once dirname(__DIR__, 1).'vendorautoload.php';

    $client = new GoogleClient();
    $client->setAuthConfig(dirname(__DIR__, 1).'client_credentials.json');

    // Your redirect URI can be any registered URI, but in this example
    // we redirect back to this same page
    $redirect_uri = 'http://' . $_SERVER['HTTP_HOST'] . $_SERVER['PHP_SELF'];
    $client->setRedirectUri($redirect_uri);
    
    if (isset($received_data->token)) {
        $token = $client->fetchAccessTokenWithAuthCode($received_data->token); //this is where it fails, eventhough the token is set
        $client->setAccessToken($token);

        // store in the session also
        $_SESSION['upload_token'] = $token;
    }

    $output = array(
        'token' => $received_data->token
    );
    
    echo json_encode($output);
}

Answer 1

等待大神答复