Receive data on front-end React app from webhook - node.js

I am building a headless CMS with Strapi. I am testing the webhooks section and want to show the received data from the webhook on my React front-end.
I created a new folder webhooks on my local machine and ran npm init -y.
It created a package.json file with this content in it:
{
"name": "webhooks",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.18.2"
}
}
I added a index.js file to the root folder with this content and installed express and body-parser:
const express = require("express")
const bodyParser = require("body-parser")
const app = express()
const PORT = 3001
app.use(bodyParser.json())
app.post("/webhook", (req, res) => {
console.log(req.body)
res.status(200).end()
})
app.listen(PORT, () => console.log(`🚀 Server running on port ${PORT}`))
After that I added this line in my package.json:
"start": "node index.js"
So it will start up with npm start instead of node index.js.
I added this URL to my strapi webhooks: http://localhost:3001/webhook and tested the trigger from the Strapi admin. It works fine.
After this I ran npx create-react-app client to create my react front-end app.
My next question is now how can I receive the contents from the webhook in my react front-end app?

Related

Node.js in Heroku

I am hosting my very simple nodejs server in Heroku. But, when I try it, it returns this error:
Application error
An error occurred in the application and your page could not be served. If you are the application
owner, check your logs for details. You can do this from the Heroku CLI with the command`
Here's the server.js:
const express = require("express");
const cors = require("cors");
const PORT = process.env.PORT || 80;
const server = express();
server.use(cors());
server.get("/", (req, res) => {
const INDEX = "/index.html";
res.sendFile(INDEX, { root: __dirname });
});
server.get("/test", (req, res) => {
res.send("test Page");
});
server.listen(PORT, () => console.log(`listening on port ${PORT}`));
package.json:
{
"name": "express-heroku",
"version": "1.0.0",
"description": "",
"main": "server.js",
"engines": {
"node": "15.11.x"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node server.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.17.1",
"mongoose": "^5.11.19"
},
"devDependencies": {
"nodemon": "^2.0.7"
}
}
Don't know what the reason is, but, when I try this in the localhost it works perfectly!
The full error on Heroku CLI:
Any help is greatly appreciated !
Create a ProcFile:
Inside the ProcFile add web: node index.js
Doing this, you are telling heroku to run your server, with node.

Nodemon crashes when trying to use es6 modules but works well with es5

I am trying to run a server using es6 modules but crashes every time I do it and works whenever I use it with es5error message
I have babel installed and have "preset": ["env"] in my .babelrc file but whenever I run it, I have a "syntax error: Invalid or unexpected token". And this is not on one particular project, this is the third project where am experiencing this
import http from 'http';
import express from 'express';
import logger from 'morgan';
import bodyParser from 'body-parser';
// setting up express application
const app = express();
const hostName = '127.0.0.1';
const port = 3000;
const server = http.createServer(app);
// logs request to the console
app.use(logger('dev'))
// Parse incoming data requests
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: false
}));
// making a request to the server
app.get('*', (req, res) => res.status(200).send({
message: 'Welcome to the default API route',
}));
server.listen(port, hostName, () => {
console.log(`Server running at http://${hostName}:${port}/`);
});
it supposed to bring out "Welcome to the default API route" to the console but instead, it is an error message. And if the repo is needed, i will gladly supply it
ES6 is not yet supported in the Node runtime by default. You can integrate it like this:
npm i esm && npm i -D nodemon
In your package.json, add this to scripts:
"start": "nodemon -r esm index.js"
(make sure the index.js part of the script matches the name of your server entry point file)
Run npm start
Solution to running nodemon with support for ES6 module import/export syntax.
first, install the esm package:
npm i esm
second, ensure package.json contains the line
"type": "module"
example package.json:
line 6
{
"name": "stack-overflow-example",
"version": "1.0.0",
"description": "",
"main": "index.js",
"type": "module",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"cors": "^2.8.5",
"esm": "^3.2.25",
"express": "^4.18.1"
}
}
To run nodemon:
nodemon esm path-to-your/index.js
the file extension is necessary

How to deploy node app on openshift and run it?

Just created a very simple hello world app using node:
var express = require('express');
var app = express();
app.get('/', function (req, res) {
res.send('Hello World!');
});
var server_port = process.env.OPENSHIFT_NODEJS_PORT || 8080
var server_ip_address = process.env.OPENSHIFT_NODEJS_IP || '127.0.0.1'
app.listen(server_port, server_ip_address, function () {
console.log( "Listening on " + server_ip_address + ", port " + server_port )
});
and it works as it is expected in my local machine,
put that on github and deployed it on openshift, pod created and server running fine:
but when I browse the route which I could find it in Application>>routes menu it says:
Application is not available
The application is currently not serving requests at this endpoint. It may not have been started or is still starting.
I guess I'm using the latest version of openshift since just created an account.
I'm expecting it to show me the Hello world!
update1:
here is my package.json:
{
"name": "npmtest",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.16.2"
}
}
Your application server IP address needs to be 0.0.0.0. So you either specify an environment variable for that, or hard code it.
have you configure main file in package.json
and maybe you need to get port dynamically from the environment variables check below link for openshift sample
https://github.com/openshift/nodejs-ex

App engine nodejs deployment error

I am trying some hands-on on Google Cloud Platform, App Engine in specific.
For the same, I've created a simple nodejs application which just send Hello Wold message in the response.
But I am unable to access the endpoint and getting the below error
below are my files:
aap.yaml
runtime: nodejs
env: flex
index.js
'use strict';
const http = require('http');
const port = 443;
const requestHandler = (request, response) => {
console.log(request.url);
response.end('Hello Node.js Server!');
}
const server = http.createServer(requestHandler);
server.listen(port, (err) => {
if (err) {
return console.log('something bad happened', err)
}
console.log(`server is listening on ${port}`)
});
package.json
{
"name": "test-pro-for-gcm",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js",
"deploy": "gcloud app deploy",
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
UPDATE 1
In the GCP log, 16:31:59.000 server is listening on 443
The port that will receive HTTP requests is 8080.
Use the PORT environment variable in your code to make it compatible with the App Engine environment: const port = process.env.PORT || 443;

Openshift node app error when restarting

I have a node/socket.io chat app hosted on openshift, and while it starts correctly if i ssh into the server and do "node main.js" (where main.js is the server script that starts the chat), I can't start the app on the server by web interface, where it would go on automatically; If i just start the app by ssh, it would stop working as soon as i exit the terminal.
I get this error when starting the app by the web interface:
Starting Node.js application...
Application is already stopped.
Warning! Could not start Node.js application!
Failed to execute: 'control restart' for /var/lib/openshift/57003fbe7628e1491d00011e/nodejs
In case it's relevant, my package.json file is
{
"name": "rainychat",
"version": "1.0.0",
"description": "rainychat, my chat app",
"main": "main.js",
"dependencies": {
"express": "^4.13.4",
"socket.io": "^1.4.5",
"validator": "^5.1.0"
},
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "JG",
"license": "ISC"
}
And here you can see the files of the app by ftp:
I can't decode what that error means...
My main.js code
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function (req, res) {
res.sendFile(__dirname + '/chat.html'); // /home/redadmin/public_html/rainychat.com
console.log('enviado');
});
app.set('port', process.env.OPENSHIFT_NODEJS_PORT || 8080);
app.set('ip', process.env.OPENSHIFT_NODEJS_IP || '127.0.0.1');
http.listen(app.get('port'), app.get('ip'), function () {
console.log('Listening on port ' + app.get('port'));
});
//... More code
If you're creating a new Node project, start with npm init to create the package.json file. You can add the --auto option to give it safe defaults.
Remember, the JSON file must be valid JSON, so test it with jsonlint or a tool like an online validator.
Any dependencies your project has should be spelled out in the package file. This is done automatically with things like npm install express --save.

Resources