Issues with connecting through Facebook, unable to log in using Internet Explorer due to permission denial

Having trouble logging into my facebook app using Internet Explorer with the Facebook Connect feature.

The standard code I'm using can be found here - http://jsfiddle.net/M74qN/

Encountering two problems:

Line: 23
Char: 3884
Error: Permission denied
Code: 0
URL: MYDEVELOPMENTSITE.LOCAL

Additionally, receiving a Facebook error:

An error occurred with my-facebook-app. Please try again later.
API Error Code: 100
API Error Description: Invalid parameter
Error Message: redirect_uri URL is not properly formatted

Login functions without issues in Firefox & Chrome.

Any suggestions on what might be going wrong?

Edit - Came across this link which may be related -

Considering that if this was affecting all Facebook Connect implementations on IE, there would probably be more information/complaints online.

Also noticed a similar error on Hulu but it still allows me to authorize the app, unlike mine.

EDIT 2 - Upon clearing cookies and rechecking - the Facebook error changes to

Invalid Argument
Given URL is not allowed by the Application configuration.

Link to the page displaying this error -

https://www.facebook.com/login.php?api_key=MYAPIKEY&skip_api_login=1&display=popup&cancel_url=null%3Ffb_xd_fragment%23%3F%3D%26cb%3Df29536d8cef9e1c%26relation%3Dopener%26transport%3Dfragment%26frame%3Df3208481ca1f38c%26result%3D%2522xxRESULTTOKENxx%2522&fbconnect=1&next=https%3A%2F%2Fwww.facebook.com%2Fdialog%2Fpermissions.request%3F_path%3Dpermissions.request%26app_id%MYAPIKEY%26redirect_uri%3Dnull%253Ffb_xd_fragment%2523%253F%253D%2526cb%253Df29536d8cef9e1c%2526relation%253Dopener%2526transport%253Dfragment%2526frame%253Df3208481ca1f38c%2526result%253D%252522xxRESULTTOKENxx%252522%26sdk%3Djoey%26display%3Dpopup%26api_key%MYAPIKEY%26fbconnect%3D1%26locale%3Den_US%26return_session%3D1%26session_version%3D3%26from_login%3D1&rcount=1

Suspecting the issue lies with the redirect_uri%3Dnull in the url params.

Unsure how to modify that or why it's only an IE problem.

By the way, the Facebook developer forums are extremely unhelpful.

javascriptfacebook

Answer №1

After implementing a Custom Channel URL as suggested on this page - https://developers.facebook.com/docs/reference/javascript/FB.init/, I was able to resolve the issue and get it working.

Although the solution worked, I am still uncertain about the root cause of the error. Therefore, I will keep the question open in case someone can provide a more comprehensive answer.

Answer №2

If you're encountering this issue, it may be due to the configuration of your Facebook Developers account linking to a specific web URL while you're developing locally. For instance, Facebook might be looking for www.mydomain.com, but you are actually using a local test server such as localhost:7689//.

To resolve this, one workaround is to deploy a hidden subdomain or set up a password-protected environment on the actual domain for testing purposes. Once everything is working smoothly, you can then transfer the code to your main domain.

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

Error Encountered: Module Not Located

I am encountering an error in my Project where it keeps showing 'Cannot find module' even after numerous attempts to install and uninstall packages simultaneously. The problem persists, and I can't seem to resolve it. https://i.sstatic.net/Z ...

javascriptnode.jsnpm

Tips for creating an array:

Currently, I am working on a project that involves using an array of objects. While I have a good understanding of what an array is and how to create an object, I am struggling with incorporating my student object into the array. In this project, each st ...

javascriptphphtmljquerycss

Creating a unique field button in AngularJS that is dynamically generated and specifically targeted as the last button

Is there a way to enable the plusSign = true option only for the last item in the dynamic input field? (function() { var app = angular.module('managementApp', []); // var app = angular.module('managementApp', ['ngRoute' ...

javascriptangularjsdynamicangularjs-ng-repeat

How to use AJAX script to call a non-static page method in ASP.NET

Is it possible to achieve this task without utilizing the UpdatePanel feature? ...

c#asp.netjavascriptajax

An issue has arisen with AngularJS and Twitter Bootstrap, displaying an error message stating that the function element.focus

I recently implemented the angularjs twitter bootstrap datepicker and everything seemed to be working smoothly. However, I encountered an error when trying to click on the text box for the popup datepicker. This issue has left me puzzled as I am still new ...

javascripttwitter-bootstrapangularjsfocus

Basic $http.get request including parameters

I've been attempting to send an HTTP request using the AngularJS $http service like this: $http.get('http://myserver:8080/login?', { params: {username: "John", password: "Doe" }, headers: {'Authorization': ...

javascriptangularjs

Separating screens for logged in and logged out users in React Router with Firebase is not possible

I'm currently developing an application using React and Firebase. The app has a requirement for user authentication to access their own timeline. To achieve this, I have decided to split the app into LoggedIn screens and LoggedOut screens. In the App ...

javascriptreactjsfirebase

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> & ...

javascriptfacebookfacebook-graph-api

Numpad functionality in JQuery malfunctioning post-ajax request

Using the jQuery numpad plugin has been flawless until after an AJAX call. I have tried various functions like on('click') and others, but unfortunately, none of them worked as expected. Apologies for my poor English! You can find the extension l ...

javascriptjqueryhtmlajax

What is the best way to find the dimensions of an unrotated Object3D?

To calculate the height of an Object3D, I use the following method: let obj = ... ; // An instance of Object3D, such as Mesh or Group let boundingBox = new THREE.Box3().setFromObject(obj); let height = Math.abs(boundingBox.min.y - boundingBox.max.y); How ...

javascriptthree.jsrotation

Toggle React like button

I am working on a component that displays the number of likes next to a 'like' button. I want to implement a functionality where clicking the button once adds to the number of likes, but if clicked again, it reverts back to the previous state. Th ...

javascriptreactjsfrontend

Steps for accessing the controller scope from a directive nested within another directive:

I am in the process of developing code that is as generic as possible. Currently, I have 2 directives nested within each other, and I want the inner directive to call a method on the main controller's $scope. However, it seems to be requesting the m ...

javascriptangularjs

Save JSON data from Javascript to a file on the server without using a server-side application

I am currently working with a .js client and need to save an object to a file on the server. This is new to me as I am not familiar with file i/o using JavaScript. My plan is to utilize jquery and json for this task, and I am using java serverside. Althoug ...

javascriptjqueryjsonfile-io

What is the best way to make text appear as if it is floating in Jade or HTML?

Currently, I am facing an issue with a Jade file that displays an error message when a user tries to log in with incorrect credentials. The main problem is that this error message disrupts the alignment of everything else on the page, as it is just a regul ...

javascripthtmlpug

Visible center of the HighMaps display

I want to display a map of the USA with only certain states visible, such as those on the east coast. Is there a way to resize the map area dynamically to show only the selected states? For example, when I try to display just the east coast states, the fu ...

javascriptgeohighmaps

Is it possible to nest enums within enums in TypeScript programming?

enum TYPES { CODE = 1, TEXT, IMAGE, VIDEO } enum ALL_TYPES { CODE = 1, TEXT, IMAGE, VIDEO, NONE } Is there a way to incorporate the TYPES enum into the ALL_TYPES enum? ...

javascripttypescriptenums

Getting 6 shots to load simultaneously on Jribbble - how can I do it?

Hello! I'm still getting the hang of Javascript, but I've made progress in loading elements onto the page. As a beginner, this is a good start for me. Currently, I am working on a script to load 6 "shots" onto a page, but it seems to be loading ...

javascripthtml

Manipulating an Array of Objects based on conditions in Angular 8

I have received an array of objects from an API response and I need to create a function that manipulates the data by enabling or disabling a flag based on certain conditions. API Response const data = [ { "subfamily": "Hair ...

javascriptangulartypescriptangular8

How can the focusout event be obtained for the .editor-text within slickgrid in an AngularJS environment?

My slickgrid has editable cells, and I've noticed that when I double click on a cell in the grid, an input box with the class .editor-text appears. However, when I click on other cells, the onBeforeEditorDestroy method is triggered before removing the ...

javascriptjqueryangularjsslickgrid

How can I monitor the "OnMouseNotMoving" event using jQuery?

Recently, I had an idea to add a fun feature for users on a webpage - displaying a layer at the mouse position when the user is not moving it, and then hiding it once the mouse starts moving again after a delay. I've managed to figure out the delay u ...

javascriptjquery