Endless redirect loop generated by JavaScript Facebook OAuth integration

To ensure users have the necessary permissions for my app, I plan to redirect them to the oauth page if any required permissions are missing.

However, when attempting to redirect from the FB.api callback function with the code below, I seem to encounter an infinite loop. Any suggestions on how to resolve this issue?

var requiredPermissions = ['publish_actions', 'email', 'user_birthday', 'user_location'],
    permsString         = requiredPermissions.join(','),
    permissionsUrl      = 'https://www.facebook.com/dialog/oauth';
    permissionsUrl     += '?client_id=' + config.facebook.appId;
    permissionsUrl     += '&redirect_uri=' + encodeURI(canvasUrl);
    permissionsUrl     += '&scope=' + permsString;

    FB.getLoginStatus(function (response) {

        if (response.status === 'connected') {

            FB.api('/me/permissions', function(response) {

                var keys = _.keys(response.data[0]),
                    diff = _.difference(requiredPermissions, keys);

                // Redirect user to auth again if they've removed any required permissions
                if (diff.length) {

                    window.location.href = permissionsUrl; // Results in endless loop
                    // window.location.href = 'http://randomwebsite.com'; // Redirects successfully
                }
            });
        }

    }, true);

Answer №1

It's been a while since I last tackled this problem, but from what I can remember, I approached it in the following way:

function redirectToNewLink(link) {
  window.location.href = link;
};

FB.getLoginStatus(function (response) {
    if (response.status === 'connected') {
        FB.api('/me/permissions', function(response) {
            if (true) {
                redirectToNewLink('http://www.browsehappy.com');
            }
        });
    }
}, true);

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

What is the best way to interact with the member variables and methods within the VideoJs function in an Angular 2 project

Having an issue with accessing values and methods in the videojs plugin within my Angular project. When the component initializes, the values are showing as undefined. I've tried calling the videojs method in ngAfterViewInit as well, but still not get ...

JQuery script fails to load in the head section while dynamically generating an HTML page with JavaScript

Using JavaScript, I have created a new window dynamically and added some HTML code to it. However, when I try to insert a script link into the HTML head, it fails to load when the window is open. <script type="text/javascript"> function newWindo ...

losing track of the requested parameters while working asynchronously with Firestore documents

Today is my first time experimenting with firestore and express. Here is the code snippet I am using: app.post('/api/create', (req, res) => { (async () => { try { console.log(req.body); //the above consle.lo ...

Pulling a div from beneath numerous other divs

I have been attempting to create a test case for a web application we are developing and I am on the verge of finding a solution, but there is one final hurdle that has me puzzled... Our requirement is to enable div elements to be draggable (which is work ...

Strip newline characters from information in AngularJS

What is the recommended approach for detecting and formatting the "\n\n" line breaks within text received from the server before displaying it? Check out this Fiddle: http://jsfiddle.net/nicktest2222/2vYBn/ $scope.data = [{ terms: 'You ...

Interactive drop-down feature where the toggle option is displayed exclusively in the initial drop-down menu

I am currently integrating Dropdowns into a dynamic form. However, I have encountered an issue when adding more than one Dropdown. Upon clicking on any Dropdown button, the list only appears above the first Dropdown button and not the specific one I click ...

The Facebook PHP SDK is not being installed by the composer because of compatibility issues with various PHP versions

Having trouble loading the most recent php sdk for Facebook and encountering errors with composer. Any ideas on what could be going wrong? { "minimum-stability": "dev", "require" : { "facebook/php-sdk-v4" : "4.0.*" } } [root@gridjungle gridj ...

Transmitting JSON data object

Sending a JSON Object to JSP Page After following the provided link, I discovered that one of the answers suggests creating a JSON object using the following constructor: JSONObject jsonObj=new JSONObject(String_to_Be_Parsed); Upon downloading the JSON ...

Success/Fail Page for Form Redirect

I've been struggling to figure out how to redirect my form to a success or fail page. I've scoured the internet for solutions, looking into traditional form redirects and even JavaScript onClick redirects. Can someone guide me on adding a redirec ...

Mapping with Angular involves iterating over each element in an array and applying a function to each one

I am working with an API that provides data in a specific format: {"data": [ { path: "some path", site_link: "link", features: ['feature1', 'feature2'] } ... ]} Now, I have a service called getSites() ge ...

Angular ngClick on a rectangle within an SVG element

Need to trigger angular click functions on rects in an svg. <rect data-ng-click="scrollToAnchor('siteHeader')" fill="#010101" width="501" height="81"></rect> Here's the function: $scope.scrollToAnchor = function(anchor) { $a ...

Stop RequireJS from Storing Required Scripts in Cache

It seems that RequireJS has an internal caching mechanism for required JavaScript files. Whenever a change is made to one of the required files, renaming the file is necessary in order for the changes to take effect. The typical method of adding a version ...

What is the speed difference between calling functions from require's cache in Node.js and functions in the global scope?

Let's imagine a scenario where we have two files: external.js and main.js. // external.js //create a print function that is accessible globally module.exports.print = function(text) { console.log(text) } Now let's take a look at main.js: ...

Having difficulty properly streaming UI components with Vercel's AI-SDK

Recently, I've been diving into the new Vercel's AI-SDK to expand my skills. My current project involves developing a persona generator that takes specific guidelines as inputs and generates persona attributes according to a given Zod schema. B ...

Eliminate a particular attribute from an array of objects

https://i.sstatic.net/O7lKv.pngHaving an issue with removing an item from an array object based on a specific property. Let me explain. delColumn($event: any, el: any) { if ($event.target && el > -1) { var colId: string = this.receivedData[ ...

The submit form and cordova functions are failing to trigger

I am encountering an issue where I cannot successfully call the submitForm() function when attempting to trigger it via ng-submit. The function does not execute as expected. How can I troubleshoot and resolve this problem? (function () { 'use str ...

Enable the td checked attribute

I've encountered an issue with a table containing multiple rows, each equipped with a checkbox: <tr id="${user_id}" class="SearchAccount" style="height: 40px;"> <td>John</td> <td>John</td> <td>Smith< ...

Connect guarantees while generating template

Fetching data through a function. Establishing a connection and retrieving necessary information. Some code has been omitted for brevity. function executeSQL(sql, bindParams , options) { return new Promise(function(resolve, reject) { ... resolv ...

Updating Angular Material theme variables during the build processIs this okay?

How can I easily customize the primary color of my angular 6 application to be different for development and production builds? Is there a simple solution to automatically change the primary color based on the build? ...

What is the reason behind the failure to update the state via a reducer and Object.assign?

I'm attempting to develop a reducer without utilizing ES6. It's an outmoded PHP application that lacks a build process for transpilation. I am initializing the state: let defaultState = { accountTypes: { individual: { c ...