Having trouble with basic authorization for Facebook API using JavaScript?

I am having an issue with my source code. When I run it, I receive an alert that says "No Response" and then the Facebook page displays an error message stating "An error occurred with MYAPP. Please try again later"

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js" charset="utf-8"></script>
<script>
    FB.init({appId: 'MYAPPID',status: true, cookie:true, xfbml: true});
</script>
<script>
    FB.getLoginStatus(function(response){
        if(!response.session){
        alert("NO RESPONSE");
        top.location.href="http://www.facebook.com/dialog/oauth?client_id=MYAPPID&redirect_uri=http://MYWEBSITE";
        }
    });

I'm not sure where the mistake is in my code.

Thank you for your help.

The following error has now appeared:

API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: Invalid redirect_uri: Given URL is not allowed by the Application configuration.
javascriptfacebookfacebook-graph-api

Answer №1

You need to update your login code to work with the latest version. Ensure that for FB.init, you are setting oauth: true and make sure to check response.authResponse instead of response.session.

<!DOCTYPE html>
<html>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
  FB.init({ appId: 'MYAPPID', status: true, cookie: true, xfbml: true, oauth: true });

  FB.getLoginStatus(function(response){
    if(!response.authResponse){
      alert("NO RESPONSE");
      top.location.href="http://www.facebook.com/dialog/oauth?client_id=MYAPPID&redirect_uri=http://MYWEBSITE";
    }
  });

</script>
</body>
</html>

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

Using Javascript, the sum of inputs is calculated based on the keyup event

I am a beginner in javascript and I'm learning about events. Below is the HTML code for a table that displays income titles and their respective prices. <table class="table table-hover table-bordered" id="incomeId"> <thead> <tr&g ...

javascriptjqueryhtmlinputsum

Can you explain the distinction between String[] and [String] in TypeScript?

Can you explain the distinction between String[] and [String] in typescript? Which option would be more advantageous to use? ...

javascriptarraystypescript

Exploring the ng-repeat directive with an array of objects

In the server response, I have an array of objects that I am trying to iterate over using ng-repeat in order to read each value. While trying to use array[0].value works fine, things are not going as expected when using ng-repeat. Despite all my efforts ...

javascriptangularjsarraysangularjs-ng-repeat

Multiple jQuery load() requests are being triggered by calling it from within the ajaxComplete() callback

I've been stuck on this issue for quite some time now. To troubleshoot, I suggest using Firebug to inspect the AJAX requests. It seems that they are multiplying with each click of the next and previous buttons, causing the page to load slowly: You ca ...

javascriptjqueryajaxloadmethods

Designing a MongoDB document structure that includes subdocuments with similar properties

Currently, I am in the process of developing a referral feature and I am relatively new to MongoDB. My main issue lies in figuring out how to construct a document that contains multiple similar subdocuments - specifically, 4 email addresses. The challenge ...

javascriptnode.jsmongodbnpmmongoose

Is there a way to create a function that is able to return both a value and a promise

Assume I need to fetch a value only if an object is already present in my model. Otherwise, I should retrieve the output of an endpoint service: model.getDoohkyById = function( id ){ if( this.data ) { if( this.data.length > 0) { ...

javascriptajaxangularjspromise

What leads to the occurrence of the "maximum call stack size exceeded" error?

I am currently developing a Vue 3 and Bootstrap 5 application. To integrate a date-picker functionality, I opted for the Vue 3 Datepicker plugin available at Vue 3 Datepicker. Within the file components\Ui\Datepicker.vue, I have included the fol ...

javascriptvue.jsvuejs3

Struggling to locate the element using xpath on a JavaScript enabled website in Selenium with Chrome

I have been attempting to extract data from a website that utilizes Javascript. Despite researching similar inquiries on xpath in Selenium, I have not found a solution. I initially tried using requests, but as the JavaScript doesn't load completely, I ...

javascripthtmlpython-3.xseleniumxpath

Transforming Color with JQuery on the Fly

Check out this Jquery script that gradually changes the color of an object from (0, 0, 0) to (255, 255, 0). $(document).ready(function(){ var r = 0; var g = 0; changeColor(r, g); }); function changeColor(r, g){ var newColor = "(" + r + ", ...

javascriptjquery

I am facing an issue with Angular reactive forms where the default values I set in ngOnInIt are not being reflected

Having some issues with setting default values in my Angular app using reactive forms. The defaults I set in ngOnInit are not showing up. I am also using the filter function within the map method. I am trying to select a value based on the URL and have it ...

javascriptangulartypescript

Updating the error state of a TextField Component in React MaterialUI upon clicking a button

After clicking a 'search' button, I want to validate input fields in my input form. Many solutions suggest validating the input live as it is entered, but I prefer not to do this because some of the validation processes are costly operations, su ...

javascriptreactjsvalidationmaterial-ui

Vue is now no longer displaying errors in the console

Something strange is happening while I'm debugging a Vue/Nuxt app. Suddenly, the errors in the console have disappeared whenever my Javascript references a function or variable that doesn't exist. Instead of showing an error, it just fails silent ...

javascriptvue.jsnuxt.js

What is the best way to access the inner html of every cell within a table row that I have selected?

I want to implement a feature on my website where users can click a "save" button on a specific row in a table and save the entire row's innerHtml onto another page as their favorite hiking trails. I've been trying to achieve this by adding clic ...

javascripthtml

Sending an HTTP request from within an Express/Node.js application

I am currently in the process of setting up an express service for a program I am developing. The goal is to interact with an external API, retrieve the data, and store it in a MongoDB database that I have already set up. While this task may seem straight ...

javascriptangularjsnode.jsexpress

"Learn how to showcase a picture in full-screen mode when the webpage is opened

I recently came across a script on Stack Overflow that allows me to select an image at random from an array. The script can be found here: Script to display an image selected at random from an array on page load However, I want to take this concept furthe ...

javascriptjqueryhtmlcss

Error: The function exec in matchExpr[type] is not defined

I made some changes to Object.prototype and now I'm running into errors with jQuery's methods on selectors. The error message I'm getting is: Uncaught TypeError: matchExpr[type].exec is not a function Additionally, when trying to use $.po ...

javascriptjquerytypeerror

The request returned a 404 (Not Found) error message when trying to navigate using AngularJS

Currently, I am working on building a straightforward application using Ionic and Angular. To test my progress locally, I have set up a simple server by running Ionics ionic serve command. Below is the snippet of my playlist.html code, where I intend to s ...

javascripthtmlangularjsvideohttp-status-code-404

Using Redux with Next.js to implement getStaticPaths

Can someone help me understand how to implement getStaticPaths in conjunction with Redux in Next.js? I'm currently using next-redux-wrapper to manage my content, but I am encountering issues when trying to display the data. Below is a snippet of my ...

javascriptreactjsreduxnext.jsnext-redux-wrapper

What is the process of emphasizing a WebElement in WebdriverIO?

Is there a way to highlight web elements that need to be interacted with or asserted in webdriverIO? Or is there a JavaScript code similar to the javascript executor in Selenium that can be used for this purpose? ...

javascriptnpmwebdriver-io

Integrate AngularJS service with Angular framework

Attempting to utilize the $log service within an angular 2 app, it seems that the following steps are necessary: Set up a module that includes the service you wish to inject. Utilize UpgradeAdapter's upgradeNg1Provider method. Therefore, I proceede ...

javascriptangularjsangularionic2ng-upgrade