React FacebookAuth Error: FB.login() called before FB.init() - node.js

I'm using the admin-on-rest npm package starter project and trying to plug in a simple SSO Facebook login button using the FacebookAuth npm package. Every time I try to click the "Login" button, I get the following error:
FB.login() called before FB.init()
I'm using an .env file with the following variable: REACT_APP_FACEBOOK_APP_ID and setting it to the right value. I even did console.log() within my app and can see it output.
I checked and I'm only loading the FB SDK once, not multiple times (this was a common issue reported on other threads).

Ok, it turned out to be something pretty dumb, but something to point out nonetheless!
In my .env file, I had accidentally placed a semicolon (;) at the end of the declaration, like this:
REACT_APP_FACEBOOK_APP_ID = XXXXXXXXXXXX;
Apparently .env files do NOT like semi-colons. This was just very difficult to figure out from the error above.
So if any of you want to pull your hair out because of this issue, and you're using similar tech, check to make sure you're syntactically kosher EVERYWHERE variables are being declared.

the funny thing was i forgot to replace your-app-id with my app id:
<script>
FB.init({
appId: 'your-app-id',
autoLogAppEvents: true,
xfbml: true,
version: 'v8.0'
});
</script>

Related

Angular universal server error: When using the default fallback, a fallback language must be provided in the config

I have installed angular universal on my app.
Running npm run build:ssr - DONE. WORKS.
Running npm run server:ssr - DONE.WORKS.
After accessing the server URL (localhost:4000), the page is not fully loaded and the following error is raised on the Terminal:
I also faced the same problem, so I would just like to share my findings for the same.
For me, there were two plausible causes/solutions for it:
First, in my project's I18N default JSON file that was en.json, I was having a problem In the structure of the JSON file.
For example, I had the below mistake. I missed the comma after the second label 'FINISH' :
{
"COMMON": {
"EDIT": "Edit",
"FINISH": "Finish"
"QUIT": "Quit",
}
}
So after correcting the structure, the application ran fine without an error.
Secondly, another cause of the issue could be, at runtime transloco was not able to find the correct label in the selected language, so it looked for a fallback language and it could not even find that in the transloco-root.module.ts so after adding my fallback language, it tried to find the same in the fallback language as specified in the transloco-root.module.ts.
So it found out that label and the issue got resolved.
BUT in the second solution provided, you need to have that incorrect label in at least that fallback language's json file in correct format.
I added the fallback language like below:
useValue: translocoConfig({
availableLangs: ['fr', 'en'],
defaultLang: 'en',
reRenderOnLangChange: true,
fallbackLang: 'fr',
prodMode: environment.production,
missingHandler: {
logMissingKey: true
}
})
i18n Transloco wasn't fully configured on the module file.

How to use `index.js` in a Node.js when creating an Express service?

Hi I am structuring my Node.js project based on this, like so:
Root
product name
index.js: (contains requires for the product and the main export)
productName.js: contains application logic
test
test1.js
test2.js
...
Now I have two questions
What should logically go in index.js? At the moment I have this (would this be a good way to do things and what else might I include in index.js?):
// index.js
var myServer = require('./myServer.js'); // "product name" = "myServer"
module.exports = {
run: myServer.listen
}
Does it matter what I call the object key in module.exports (currently "run")? Why does the server always run when I execute index.js with $ node index.js how does it automatically know to run myServer.listen?
P.S.: I am aware of web structure auto-generation tools, I just wish to understand the logical reason for this suggested structure (the idea of not having any logic in index.js)
As you mentioned this is a Express service, if it is only handling backend of some application or more specifically this is only backend application, I would suggest you change name of your index.js to server.js(Thus explicitly stating that it'll process all service requests).
But if not then even index.js is fine.
Now for
1
What you've put is absolutely fine, apart from this you could require all modules, routes(or controllers whatever you name them) in a way that it serves as entry point to your application. Try not to put any logic in here.
2
Actually the server runs because it executes the script in the file called index.js, the script says myServer.listen, now if you had written console.log("Hello World") and used $ node index.js it would've printed Hello World instead.
Node just expects and executes script that is there in index.js, in your case it is to start the server.
About the logic that why not put anything else in index.js, for me the reasoning I consider good enough is it provides abstraction as it is the entry point I don't want index.js to worry about things like what to do with this data and all. I believe it should provide a base to setup server. Thus following single responsibility to some extent. Also I won't have to touch it ever in projects lifetime unless some major change occurs e.g. I decide to shift from express to something else.
EDIT
Why have a key called run
You seem to have answered it yourself(in comments), you are giving or more proper description would be you're attaching an object to module.exports as it is a object similar to JSON it was supposed to have a key(which could be anything not necessarily run it could've been hii). Now if you don't want to pass a key and export only one thing that is server.listen then you could write same as module.exports = myServer.listen; instead of
module.exports = {
hii: myServer.listen
}
Note that you could export more modules using the way you did. For more details about module.exports refer this or better google about it as this link might expire anytime and does not seem an ideal thing to put on SO.

Sail. js / Waterline.js - find() not returning array

Problem: I'm getting unexpected output from code that previously worked.
Code Problem:
sails.models.user.find().then(function (users){...});
is currently returning { id: 1 }
but should return an array of User objects like [{id:x, name:y},...]
Code Alterations:
sails.models.user.find().exec(function (err, users){...}); does not contain an error and returns the same as using .then() like above.
sails.models.user.findOne(1).then(function (users){...}); correctly returns a User like {id:x, name:y}.
sails.models.venue.find().then(function (venues){...}); returns an array of venues, just as substituting any other class besides User.
Note:
This code was previously working (it's a pretty simple line), and the only changes I made between it working and not working was running npm install (but it was previously working on heroku where which installed, so I don't think that was a problem) and changing the schema of User to add a few columns (I did this by deleting the User table in the DB, updating the Sails User model, and lifting the app in create mode, so the table exactly matches the model). Neither of these should cause a problem, but we all know how "should" and coding don't mix :P
How do I fix this? And why did this happen? Thanks :)
Realized other code was calling the package sails-mock-models which was doing its job. Totally forgot about that code. Problem solved.

Netsuite: ReferenceError functionName is not defined

This is probably a stupid one but I have tried all the things I can think of. I am currently getting the below error on my client side script when I try and execute it.
Error: ReferenceError acvt_serialNumber_saveRecord is not defined
On the Script record in Netsuite I have set the saveRecord function as follows:
acvt_serialNumber_saveRecord
The code in the file is:
function acvt_serialNumber_saveRecord(){
/**do stuff */
}
I have reuploaded to code to make sure the right version was in NetSuite. I have added one character to both the script fn name and the fn name on the Script record (as a shot in the dark). I have seen in the Javascript console at runtime that the correct code is in there and I can see the exact function name (I did a ctrl+f for the "undefined" function in the code in the console to make sure spelling was all the same).
NOTHING has worked. I had this code working earlier, but the changes I made were not to this function at all.
Any help is appreciated
Another thing to check is the code that you recently changed. In particular, check for a hanging comma. IE:
var someObj = {
someProp:'somevalue',
};
The comma at the end of 'somevalue' will cause the script to fail, throwing 'undefined' errors.
Have you tried deleting the Script record in NetSuite and re-creating it?
Do you have any library included for that Client Script in netsuite ?
Provide a screen shot of your Netsuite script page
I encounter similar problem like this before, but it was because i called a function which is inside a library file
Thanks

Node JS Express Boilerplate and rendering

I am trying out node and it's Express framework via the Express boilerplate installation. It took me a while to figure out I need Redis installed (btw, if you're making a boilerplate either include all required software with it or warn about the requirement for certain software - Redis was never mentioned as required) and to get my way around the server.js file.
Right now I'm still a stranger to how I could build a site in this..
There is one problem that bugs me specifically - when I run the server.js file, it says it's all good. When I try to access it in the browser, it says 'transferring data from localhost' and never ends - it's like render doesn't finish sending and never sends the headers. No errors, no logs, no nothing - res.render('index') just hangs. The file exists, and the script finds it, but nothing ever happens. I don't have a callback in the render defined, so headers should get sent as usual.
If on the other hand I replace the render command with a simple write('Hello world'); and then do a res.end();, it works like a charm.
What am I doing wrong with rendering? I haven't changed a thing from the original installation btw. The file in question is index.ejs, it's in views/, and I even called app.register('.ejs', require('ejs')); just in case before the render itself. EJS is installed.
Also worth noting - if I do a res.render('index'); and then res.write('Hello'); immediately afterwards, followed by res.end();, I do get "Hello" on the screen, but the render never happens - it just hangs and says "Transferring data from localhost". So the application doesn't really die or hang, it just never finishes the render.
Edit: Interesting turn of events: if I define a callback in the render, the response does end. There is no more "Transferring data...", but the view is never rendered, neither is the layout. The source is completely empty upon inspection. There are no errors whatsoever, and no exceptions.
Problem fixed. It turns our render() has to be the absolute last command in a routing chain. Putting res.write('Hello'); and res.end(); after it was exactly what broke it.
I deleted everything and wrote simply res.render('index') and it worked like a charm. Learn from my fail, newbies - no outputting anything after rendering!

Resources