Using OAuth2 Connector with Facebook NodeJS Error

[scott]

Wappler Version : 3.4.2
Operating System : Mac Catalina Version 10.15.7

Expected behavior

While following the tutorial at https://docs.wappler.io/t/using-oauth2-connector-with-facebook/12345, Facebook should respond accordingly.

Actual behavior

The following error occurs:

How to reproduce

1. Create a new project using NodeJS
2. Follow the steps outlined in the tutorial, https://docs.wappler.io/t/using-oauth2-connector-with-facebook/12345
3. Receive the error listed above.

Cause of the error and solution

It took me three days to figure out the cause of the error, but I finally tracked it down. The error is caused because in the json file, the client id is not being enclosed in quotation marks. In the json file that is created by the tutorial, on line 10, you will find the client id. The response entered is a green color instead of a blue color because the quotation marks are not there. When you add the quotation marks, the response becomes green and you can move forward with the tutorial. Any time you save the file with a change, the quotation marks are removed and have to be re-added.

This bug is probably only specific to node.js projects.

@Teodor (tagged because you helped me out in the past with the Facebook Login API)

[Teodor]

@scott

In the json file that is created by the tutorial, on line 10, you will find the client id. The response entered is a green color instead of a blue color because the quotation marks are not there.

Which input/option in the UI are your referring to?

[scott]

Honestly, I think it occurs on file save no matter which input you were working on prior to the save.

I have not changed the client id since starting the tutorial, but I did change other options in later steps.

[scott]

For example, I just added the data part (email and id) to the data api schema and clicked on save and the quotation marks were removed from the client_id on line 10.

[Teodor]

Can you post a screenshot of what you enter in the UI for this exactly?

[scott]

and the result in the json file is:

[Teodor]

So what’s wrong with the value? Is facebook expecting this value to be a string, or a number? Looks like a number to me.

[scott]

I am not sure what they expect to be honest. I only know it works with the client_id enclosed in quotation marks and does not work without the quotation marks.

I thought initially it was because I had used v8.0 instead of v6.0 in the https://graph.facebook.com/v8.0/me URL, but regardless of which version used, the result is the same.

[Teodor]

I see they seem to require a numeric string. Maybe @patrick can check what’s wrong here.

[mebeingken]

Hey @Teodor

I was diving into this today as well and seeing the same error. Seems the client_id is not being passed in the query string although it is provided on the oauth action:

If I add the fb app id into the url, the process continues to the next step.

@patrick Any chance there is a quick workaround / patch for this on a Node project?

[patrick]

I believe it is a bug in the Wappler UI, it tries to auto detect the type. The client_id should be a string and not a number. Just edit the json directly and place quotes around the id.

[mebeingken]

Yup, that fixes it. Thanks Patrick.

[Teodor]

Fixed in Wappler 3.5.2