Unlocking the secret to obtaining durable identity provider tokens for JavaScript in web browsers

Currently, I am working on implementing browser-side JavaScript code for login with Facebook, Amazon, Twitter, and Google using Cognito.

I have reached a point where I am able to obtain client tokens for all four platforms. However, the issue is that these tokens have a short lifespan and expire within 1-2 hours.

After conducting some research, it was discovered that Google tokens only last for 1 hour, and extending their lifespan requires server-side code.

Facebook tokens last for 2 hours but auto-refresh only when the user is actively logged in. If the user returns after two days, the token will have expired, necessitating the use of server-side code to acquire a longer-lasting token.

Amazon tokens are valid for 1 hour, while Twitter tokens do not expire at all.

Any help provided would be greatly appreciated, whether it be links to documentation or personal experiences.

Note: Working with JavaScript on the browser, not node.js

Although utilizing Cognito, it seems that it does not influence the lifespan of tokens.

Corrections and suggestions are also welcomed and encouraged.

javascriptfacebook-graph-apitwitter-oauthamazon-cognitogoogle-identity

Answer №1

Attempting to extend the lifespan of access tokens in the browser is not a recommended practice, especially for platforms like Facebook. This method would require exposing your app's secret within your JavaScript application, potentially allowing unauthorized individuals to retrieve it.

This approach could result in losing access to your social media accounts. Therefore, it is more prudent to handle this process on the server side.

For further information, please refer to:

It is crucial to note that as this request involves your app secret, it should never be executed in client-side code or within an app binary that could be reverse-engineered. It is imperative to keep your app secret confidential and ensure that it remains undisclosed. Consequently, this API call must solely be implemented using server-side coding.

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

Run an npm script located in a different package

Imagine I have two node packages, one named parent and the other named child. The child package contains a package.json file with some scripts. Is it viable to merge the scripts from child into the context of parent? For instance: child/package.json: "s ...

javascriptnode.jsnpmpackage.jsonrun-script

The div layer is positioned above the flash object

I have successfully implemented a method where I position a div over a webpage containing a flash object. This absolutely positioned div has a high z-index and captures click events. The main goal is to trigger the click event on the div when the flash obj ...

javascriptjqueryflashfirefox

The node.js system automatically restarts an API call when a timeout occurs

Current Setup: I am using a combination of sails.js for the backend API and React for the frontend. The communication between the frontend and backend is handled by the fetch API. Scenario: Within some of my API endpoints, I need to run an external file ...

javascriptnode.jsreactjssails.jsfetch

I aim to conceal the Spinner feature within the service layer of Vue JS

I have a basic bootstrap Spinner.vue component <template> <div class="modal" v-if="start"> <div class="spinner-border text-info" role="status" style="width: 3rem; height: 3rem;" ...

javascriptvue.js

Issue with Jquery .ajax function returning an object even after it has already moved on to the next line of code

I'm currently working with JQUERY and AJAX, and it seems like the function is somewhat functional but there's a glitch that occurs after the next line of code runs. This issue causes the script to add a null value when trying to insert the object ...

javascriptjqueryajaxasp.net-mvc

Steps for regularly executing 'npm run build' on the server

My website doesn't require frequent content updates, as users don't always need the latest information. As a result, most pages are generated server-side and served as static pages. There will be occasional database updates that need to be visib ...

javascriptnext.js

PHP: How to Return a Multidimensional Array and Separate Variables Simultaneously

I am trying to send a 2D array with multiple individual variables from a PHP script to a JavaScript client using AJAX. Despite many attempts, I haven't been able to figure out how to include additional individual variables (like $var1, $var2, $var3) i ...

javascriptphpajaxjson

Unable to receive a response in React-Native after sending a post request

My current challenge involves sending a response back after successfully making a post request in react-native. Unfortunately, the response is not arriving as expected. router.route("/addUser").post((req, res) => { let name= req.body.name; connection ...

javascriptnode.jsreact-nativeexpress

Is Jquery "resistant" to updating CSS properties?

Within my HTML document, there exists a div with the class fd-video-upload-box, which has the following style properties applied: background-color: rgb(236, 238, 239); outline: 1px dashed gray !important; Upon rendering, it displays correctly as intended ...

javascriptjquery

The mobile menu functions correctly on Jfiddle but is not functioning on the local server

I was working on a responsive mobile menu and used a toggleClass function to open the menu. It's functioning correctly in Jfiddle and below, but every time I click the nav icon in the live preview within brackets, nothing happens. I even tried it in a ...

javascriptjqueryhtmlcss

The pagination in React using React Query will only trigger a re-render when the window is in

Currently, I am utilizing React-Query with React and have encountered an issue with pagination. The component only renders when the window gains focus. This behavior is demonstrated in the video link below, https://i.sstatic.net/hIkFp.gif The video showc ...

javascriptreactjstypescriptpaginationreact-query

Circular dependency situation encountered in Angular 2 shared module

I'm currently working on a share module setup that is structured as follows: @NgModule({ exports: [ CommonModule, HttpModule, OneModule, TwoModule ] }) export class SharedModule { } The OneModule imports the SharedModule in order ...

javascriptangular

Improving the efficiency of AES decryption in Node.js

I had the idea to build a webpage that would display decrypted data fetched from the server. The app.js file on the server reads and decrypts all the data from a specific folder. var http = require('http'); var path = require('path'); ...

javascriptexpressaesnode-crypto

Steps to include a Target property in a freshly created MouseEvent

Trying to dispatch a contextMenu event, I've noticed that in the MouseEvent interface for TypeScript, the target property is missing, even though it is documented in the contextMenu documentation. Here's my TypeScript snippet: const emulatedMou ...

javascripttypescripteventsdom-events

What methods can I employ JSON to create a dynamic Sidebar within Nextjs?

[ { "type": "root", "children": [ { "type": "file", "route": "Open-EdTech/AWS-Associate-Notes/EC2.md", "title": "EC2", ...

javascriptjsonreactjsnext.js

Sort activities according to the preferences of the user

This is the concept behind my current design. Click here to view the design When making a GET request, I retrieve data from a MongoDB database and display it on the view. Now, I aim to implement a filter functionality based on user input through a form. ...

javascriptjsonnode.jsexpressejs

Accessing the database variable in controller files with Node.js

I am new to node.js and currently using lowdb for my database as I start building my app. In the index.js file, I have set up my Express server along with routes: var express = require('express'); var app = express(); var bodyParser = require(& ...

javascriptnode.js

What is the best way to reset an event back to its original state once it has been clicked on again

As a newcomer to web development, I'm currently working on creating my own portfolio website. One of the features I am trying to implement is triangle bullet points that can change direction when clicked - kind of like an arrow. My idea is for them to ...

javascriptcssfrontend

Switching between play and pause for the video element using a component for the child

Trying to toggle the play/pause of a child video by clicking on a parent div can be challenging, especially when dealing with multiple instances of the same div and video. A normal function may only work for one specific video, as mentioned by @ken. I hav ...

javascripthtmlvue.jsvue-component

JS backbone require global models in js

I am looking to implement a UserSession model that will handle loading and saving session IDs into cookies using the jQuery cookie plugin. Below is the code for my UserSession model module: define(['jQuery', 'Underscore', 'Backbo ...

javascriptjquerybackbone.jsrequirejs