Ways to resolve the responseJSON showing {error: "invalid_request", error_description: "Code parameter is missing"}

My current issue involves uploading files to Google Drive from my Vuejs and JavaScript web application. The request I send is returning an error. Upon checking, I noticed that the variable code is null, and even the variable window.location.search is empty. However, I am unsure of what value the code variable should contain in the request.

Below is the relevant section of code:

  const urlParams = new URLSearchParams(window.location.search);
  console.log ("Value of window.location.search", window.location.search);
  const code = urlParams.get('code');
  console.log ("Valor de code", code);
  const redirect_uri = "http://localhost:3000/formacionProf"
  const client_secret = clientSecret;
  const scope = "https://www.googleapis.com/auth/drive";
  let access_token= "";
  let client_id = clientID;

  $.ajax({
    type: 'POST',
    url: "https://www.googleapis.com/oauth2/v4/token",
    data: {
      code: code,
      redirect_uri: redirect_uri,
      client_secret: client_secret,
      client_id: client_id,
      scope: scope,
      grant_type: "authorization_code"
    },
    dataType: "json",
    success: function(resultData) {
      localStorage.setItem("accessToken",resultData.access_token);
      localStorage.setItem("refreshToken",resultData.refreshToken);
      localStorage.setItem("expires_in",resultData.expires_in);
      window.history.pushState({}, document.title, "/formacionProf");
    },
    error: function (error) {
        console.log(error);
    }
  });

Thank you for your assistance.

Answer №1

When using the Google API, the callback URL is where they pass parameters such as "code" when redirecting to your page.

To access the query string in the current URL, you can use window.location.search

If you are testing, you may need to redirect from their pages to see the results.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

New and improved method for showcasing the switching of two PHP variables using jQuery Ajax

Obtaining two random values from a table in the same row can be achieved using PHP and MySQL. For example: <?php $result = mysql_query("SELECT * FROM people ORDER BY RAND() LIMIT 1", $connection); $row = mysql_fetch_array($result); echo $ro ...

Using jQuery AJAX to send a URL as a string parameter

Currently, I have an ajax function that sends a string of variables to my script. However, there is one variable that needs to hold a complete URL along with parameters. In the current setup, var1 and var2 are received as $_POST variables. But I specifica ...

How do I display two records in a single column according to their respective IDs?

https://i.stack.imgur.com/eo1YY.png If I have a number like 12144 and need to display it as 6, 13 in a column, what steps should I take? Your assistance would be greatly appreciated. Thank you so much! ...

Achieving the perfect alignment: Centering a paragraph containing an image using JQuery

I need help centering the background image of my <p> tag on the webpage. Script $(function() { $('ul.nav a').bind('click', function(event) { var $anchor = $(this); $('html, body').stop().animate({ ...

The functionality for navigating the Angular uib-dropdown using the keyboard is currently experiencing issues

I am currently utilizing Angular Bootstrap 2.2.0 in conjunction with Angular 1.5. Despite enabling the keyboard-nav option, I am experiencing issues with keyboard navigation on UIB dropdowns. Below is the snippet of my code: <div class="btn-group" ...

Retrieve a prepared response from a TypeORM query

I need to retrieve all the courses assigned to a user with a simple query: There are 2 Tables: students & courses return await this.studentsRepository .createQueryBuilder('s') .leftJoinAndSelect('courses', 'c' ...

JQuery .click Event doesn't center elements even with transform-origin adjustment

In the JSfiddle provided below, you can see that after a click event occurs, two span (block) elements rotate 45deg to form an "X". However, both elements are slightly shifted left, creating an off-center "X" relative to the parent's true center-origi ...

Consistently encountering issues when attempting to submit JSON data via POST request (body in raw format

I'm facing an issue with sending data to my server. Currently, I am working on a project using react native and axios version ^0.16.2. let input = { 'longitude': -6.3922782, 'latitude': 106.8268856, 'content': &apos ...

Is it possible to transform all scripts into a React component? (LuckyOrange)

I am currently working on converting the script for a specific service (http://luckyorange.com/) into a component. The instructions say to place it in index.html within the public folder, but that appears to be insecure. I'm uncertain whether this tas ...

When a form added by jQuery is submitted, the associated JavaScript does not run as expected

After clicking a button on my page, jQuery removes one form and replaces it with another. However, when I try to submit the second form, the associated JavaScript does not execute as expected. Instead of running the JavaScript function, the form submissio ...

Is there a method I can utilize to ensure functionality within Google Apps Script?

I encountered an issue when using innerHTML instead of getBody() and I am looking for assistance with debugging on apps-script as mine is not functioning properly. function findText(findme,colour,desc,rule_name) { var body = DocumentApp.getActiveDocum ...

I am interested in swapping out the text links in a menu for images

Looking to swap out text links in a menu for images, but stuck with template constraints generated by rapidweaver. The HTML template can't be modified, except for the link text itself. For example: <a href="http://truehealth.gr/eng/" rel="">!UK ...

When the menu active item is clicked, the header will automatically scroll to the top

I've implemented a sticky header using CSS and JavaScript along with a mega menu. However, I've encountered an issue where when scrolling to the bottom and clicking on the "more" link in the dropdown, the page scrolls back to the top. This is the ...

Invoke the parent function when extending javascript prototype

Below is the Meta-Code I am currently working with: var Parent = function(){} Parent.prototype.doSomething = function(){ console.log("As a parent I did like a parent"); } var Child = function(){} Child.prototype = new Parent(); Child.prototype.doSometh ...

Unable to load JavaScript file twice dynamically in Internet Explorer

I recently created this page where users can click on rows in a table to load data via an ajax request and dynamically generate a graph. While this functionality works smoothly in Chrome and Firefox, I'm experiencing issues with Internet Explorer 8. S ...

Angularjs allows you to repeat a specific number of elements based on a given number

I am working with an object that is connected to the $scope in my Angularjs application {name: 'Vampire Cafe', rating: 4, review: "Food was good, cafe was a bit dark..."} I want to display the value of the rating by showing a certain number of ...

Customize the <td> column based on values and rows. Modify the current jQuery code

This code snippet contains an HTML table that dynamically populates based on the dropdown selection. The script included in the code highlights the best and worst values in the table by changing their background color to green and red, respectively. & ...

Include an Open OnClick event in the React/JSX script

We have a dynamic menu created using JavaScript (React/JSX) that opens on hover due to styling. My inquiries are: Instead of relying on CSS for the hover effect, where in the code can I implement an OnClick event to trigger the menu opening using Java ...

Unable to modify preset choices in radio checkboxes

I am a paramedic with no prior experience in this area. My task involves completing numerous patient forms that contain excessive fields, creating redundancy. To streamline this process, I am attempting to script a solution that will automatically populat ...

Error in ReactJS: Trying to access property 'items' of an undefined object

I've been diving into ReactJS, but I've hit a roadblock with this perplexing error. My goal is to update the parent's items array state from its child component. To achieve this, I attempted to pass the addItem function as a prop to the chi ...