Flutter web app fails to get node API on the same pc - node.js

I have created a flutter web app which uses NodeJS API to fetch data from mongodb database and write some data to mongodb. The app works fine when i run it as a Desktop app,it communicates to my node server. The app also work fine when i run it on chrome using
flutter run -d chrome
from android studio terminal. But when i build the web app and run it with the bellow command only the static page loads and it is not fetching data from mongoDB. It isnot communicating with NodeJS API.
flutter build web
cd build/web
python -m http.server 8000
So all i want was to deploy my flutter web app to a server and check if it works properly, but it fails to connect to the NodeJS back end. What is the best way to do it,Deploy a Flutter web app with also uses NodeJS APIs to fetch some JSON data.

Enable CORS for API. Here is an example which enables it for all requests.
var express = require('express')
var cors = require('cors')
var app = express()
app.use(cors())
...
app.listen(80, function () {
console.log('CORS-enabled web server listening on port 80')
})
See cors for details.

Related

Run both client and server apps at same time IIS Express for local development

I have a Visual Studio 2019 Project that has both a ReactJS client app in ClientApp folder and a .Net Core 3.1 Entity Framework app in the same solution. The client side ReactJS app uses the controllers on the .NetCore side to manage the data.
For example, one way the ReactJS Client-side app gets data from the .NetCore API is like this:
const getPlayerStats = async (onlineVal) => {
const apiResult = await axios("api/gamerStats/", {
params: {
isOnline: onlineVal
}
});
return apiResult;
};
On my Windows Server using IIS, it runs both fine.
However, when I try and debug the solution locally, it fires up IIS Express but only the .Net Core Entity Framework is running.
If I start the app using npm init from the ClientApp folder, it starts the ReactJS part, but then the .NetCore Entity Framework app is not running.
How can I debug locally so that both parts of the solution are running and can talk to each other?
Thanks!

Google Cloud Compute Engine - Nodejs not working

I created a free server from Google Cloud. I want to run Node.js on this server. I installed Node.js. I installed Express and created a project. Then I run the project (working).
But I can not get the output by typing ip-address: 3000. "This site can not be reached." I get as a result.
What could be the reason for that.
I just setup one to see how this works, how i setup the server, hope this helps:
var express = require('express');
var app = express();
app.get('/', (req, res) => {
res.json('Home Page');
})
app.listen(8080);
The web applications must listen for HTTP requests on ports within the permitted range 8080 to 8084.....To connect to a web application running on an instance, click the Web Preview button Web Preview Button above the Cloud Shell terminal window in the GCP Console. src: https://cloud.google.com/shell/docs/features#web_preview

Azure web deployment not displaying web page

I'm writing a simple nodejs app to be deployed to azure.
The app works fine, 100%, but the web page I have to manage admin matters refuses to load.
It always displays internal server error. I'm using express and viewing the logs but they say nothing useful. The app doesn't crash so I cant understand why it wont display.
This is the simple hello world code I'm using for testing, and even that wont display.
var express = require('express');
var app = express();
app.use(express.static('website'));
app.listen(80);
Does anyone have any idea what could be the problem?
Edit: I forgot to include that I do set the port environment variable
var port = process.env.PORT || 80;
var baseHost = process.env.WEBSITE_HOSTNAME || 'localhost';
Thats at the top of my server.js, sorry about that.
guess your app is listening on the wrong port when running on Azure App Service.
you will have to get the port number from environment variable "process.env.port"
var app = require('express')();
var port = process.env.port || 8080; // 8080 for local or whatever number u want
var listener = app.listen(port, function(){
console.log('Listening on port ' + port);
});
Follow this blog to get a Node.js app working on Azure. I used this for a demo recently and it worked properly.
Create a Node.js web app in Azure App Service
You have to use GIT and Continuous Deployment to get Azure App Services to recognize and setup the right pieces for your node application to function, it also takes care of node packages for you automatically.
Hope this helps, TehDude
Try turning on logging to get a better idea of what's going on
From How to debug a Node.js web app in Azure App Service:
To enable the logging of stdout and stderr streams, you must create an
IISNode.yml file at the root of your Node.js application and add the
following:
loggingEnabled: true
This enables the logging of stderr and stdout from your Node.js
application.
The IISNode.yml file can also be used to control whether friendly
errors or developer errors are returned to the browser when a failure
occurs. To enable developer errors, add the following line to the
IISNode.yml file:
devErrorsEnabled: true
Once this option is enabled, IISNode will return the last 64K of
information sent to stderr instead of a friendly error such as "an
internal server error occurred".
Node.js application running on Azure Web Apps Service, is hosted on IIS handled mapping via IISNode, which gives a Named Pipe to receive the incoming requests, not a TCP port like you would use when running locally.
This Named Pipe has been defined as the port in Node.js runtime on Azure Web Apps. You can define the port in your app like: process.env.PORT || 3000, with which your app can run on Azure or locally.

How to run Node.js server in Ionic mobile app?

I am making an app using MEAN and ionic framework where nodejs is a middleware to connect to the database(mongoDb). I need to run the nodejs server using node server.js and the app using ionic serve. This is my server.js.
var express = require('express'),
app = express(),
bodyParser = require('body-parser'),
mongoose = require('mongoose'),
CohortController =require('./www/server/controller/CohortController');
mongoose.connect('mongodb://localhost:27017/persistent');
app.use(bodyParser());
app.get('/api/cohorts',CohortController.list);
app.post('/api/cohorts',CohortController.create);
app.listen(3000,function(){
console.log('Listening...');
})
Now this is my app.js. I use http://localhost:3000 to get the JSON.
app.controller('CohortController',['$scope','$resource',
function($scope,$resource){
var Cohort=$resource('http://localhost:3000/api/cohorts');
Cohort.query(function(results){
$scope.cohorts=results;
});
$scope.cohorts=[];
$scope.createCohort= function () {
var cohort=new Cohort();
cohort.name=$scope.CohortName;
cohort.id=$scope.CohortId;
cohort.$save(function(result){
$scope.cohorts.push(result);
$scope.CohortName='';
$scope.CohortId='';
});
}
}]);
How can I run the node server when I convert it into a mobile application? How the application will use the API?
You will have to have your Node.js app running on a server which you would then access (from your Ionic app) via it's public IP. So, you wouldn't use http://localhost:3000 to get the JSON, instead you would use something like http://123.456.789.123:3000.
But, usually, this is not the way you would do it (with the port 3000). What you would additionally do is put (for example) Nginx in front of your Node.js app (see an example here) in order to serve your api from the standard HTTP port (80).
So, basically, you can't actually "run Node.js server in Ionic app" - the way you do it is run the Node.js app separate from Ionic and expose its functionality via a standardized API (usually these days REST is what you would want to achieve) which you then "consume" via Ionic's (well, to be exact, it's actually Angular's) $resource module.
Hope this helps clear things up a bit.

How to deploy a socket.io node.js application on windows azure?

I am building windows azure application which is primarily based on .NET, but I also have to build a socket.io server using node.js hence i need to deploy a socket.io server and use this socket.io url to connect in my .NET application.
I followed all the steps listed here . And I am able to get the socket.io running on my local but when i deploy to cloud, it doesnt start. Please find below a code snippet for socket.io
var app = require('express')()
, server = require('http').createServer(app)
, io = require('socket.io').listen(server, { origins: '*:*' });
server.listen(4001);
When i hosted it in my local emulator, 127.0.0.1:81 was pointing to this in my browser
But 127.0.0.1:4001 showed "Cannot GET /" on the browser, which is an indicative that the socket.io server is running on that url.
But when i deploy the same to cloud, i get the same as the screenshot on the url where the cloud service is hosted but on port 4001 where the socket.io server should have started it says page cannot be displayed.
Please let me know if you need to see any other files like web.config etc.
I have been stuck on this issue from forever and its really crucial for my project, any suggestions or ideas would be deeply appreciated.
Thanks
The important part that you are missing from the sample is setting of the port number
var port = process.env.port || 1337;
and
.listen(port)
when you are running inside of the Azure environment (even emulated) the ports are assigned for you, the port environment variable will tell you where. 4001 is likely not the assigned port.
The 1337 would only be used if you are running by executing
node server.js
from the command line

Resources