I am deploying a nodejs project on a server with apache2 reverse proxy.
When i type this in apache:
http://mywebsite/folder1prefix/myroute
it redirects me to my node application, but apache use folder1prefix because there are other apps.
The problem is my nodejs use routes like this:
app.all('/myroute', function(req,res) { ... });
Is there a way to tell node to ignore folder1prefix prefix. I don t want to do this:
app.all('/folder1prefix/myroute', function(req,res) { ... });
Because the folder1prefix purpose is for testing and it can change.
Related
So my express app has a small Node server setup so it can serve up the index.html file when the home route '/' is hit. This is a requirement of using the App Services from Azure, there has to be this server.js file to tell the server how to serve up the client, and i had a previous implementation of this working, however i wanted to change my file structure. previously i had, the client React app in a folder client and the server.js in a folder server along with all of the conrtollers and routes. i've since moved the server API to its own application as there are other apps that depend on it. and i moved the client up one directory into the main directory. Everything was working fine till the other day when all of the sudden when you hit the home route / it will not serve up the index.html file. if you hit any other route it works, if you even hit a button linking back to the homepage, it works, but it wont serve up the app from the / and i cannot for the life of me figure out why, on my development server there are no errors in the console. and im most definitely targeting the correct directory and place for the index. but its like the server isnt reading the route to serve up.
if (process.env.NODE_ENV === 'production') {
console.log('running');
app.use(express.static(path.resolve(path.join(__dirname, 'build'))));
// no matter what route is hit, send the index.html file
app.get('*', (req, res) => {
res.sendFile(path.resolve(path.join(__dirname, 'build', 'index.html')));
});
} else {
app.get('/', (req, res) => {
res.send('API is running...');
});
}
So here im saying if the NODE_ENV is in production make the build folder static, and then whatever route is hit. (Note: i also tried this app.get with other route formats such as /* or / all have the same issues. however in my previous iteration when the client and server where deployed in the same location, /* is what i used.) The .env varialbes are setup correctly, as when the server is ran, itll console log running.. but even if i put a console log inside of the app.get() its like its never hit unless i access the route from something else first.
for example, if i place a console log inside of app.get that states hit whenever the route is hit, hitting / directly does nothing, but if i go to /login itll serve up the correct html on the client and console log hit in the terminal...
If you are having server files inside the client react app, then we are basically accessing file which are not inside our server file. So, we can serve static files using the following code:
const express = require("express");
const app = express(); // create express app
const path = require('path');
app.use(express.static(path.join(__dirname, "..", "build")));
app.use(express.static("build"));
app.listen(5000, () => {
console.log("server started on port 5000");
});
Now in your packages.json of the client react app change the name of start tag under scripts tag to start-client. Then add this following tag to the scripts tag:
"start":"npm run build && (cd server && npm start)",
Basically, this will build the react app and start the server.
It should look like this :
Also in the packages.json of your server add the following tag under script tag
"start":"node server.js"
So when you run the following command npm start it should look like this :
I am trying to configure a nodeJS express app which handles a react static build to run from a location inside my VPS (nginx).
So far I have managed to configure the location like this:
added path in webpack build:
output: {
path: path.join(__dirname, '/client/public/dist/'),
filename: 'main.js',
publicPath: "/location/",
},
added the path to the express server:
app.use("/location/", express.static(path.join(__dirname, './client/public/dist/')))
added the location to the react router, to each route
added the location to the nginx proxy_pass:
location /location{
proxy_pass http://localhost:5002/location;
}
The issue I am facing is that if I have a subpath (e.g. /location/page1), if I refresh the browswer I get the error cannot get /location/page1
I have tried to modify the express server as app.use("/location/*", ) or app.use("*"),
but the I get Uncaught SyntaxError: Unexpected token '<'
Is this an issue with index.html? Is there any simpler way to run the app from a location route?
location /location/ {
rewrite ^/location/(.*) /$1 break;
proxy_pass http://localhost:5008/yourPath/;
}
Do not add * path in express, but add the path like above as I have shown in your Nginx file, I have tried this in Nginx itself for my projects.
Here /location/ can be anything of your choice where users can see but in the proxy pass, it should be exactly where you are serving through your application, for example, the route facing the user i.e /location/ can be /test/ that's what users see but after that, the routes can be your /location from where your application is served.
Do let me know if you have ambiguity in understanding the solution I can show you a demo and explain. Thank you.
I have 2 angular apps one is web and other one is admin. I used NodeJS and Express server to serve this app. For the web url is staring with the / (ex: mydomain.com/) and its work fine. Now i want to access admin panel via mydomain.com/admin but its show me error in console.
Error: Cannot match any routes. URL Segment: 'admin'
Note : Both apps ( web and admin ) are separate angular app.
I tried to serve admin interface using proxy_pass in nginx configratio, But it not worked
Here is my routing congigation in NodeJs Server
app.js
//Routing
const WEB = require('./routes/web')
const ADMIN = require('./routes/admin')
//app.use('/',WEB);
app.use('/admin/',ADMIN);
app.use('/',WEB);
/routes/web.js
Router.get('*',(req,res) =>{
// server from angular build using comand ng build
res.sendFile(path.join(APP_PATH,'build/index.html'));
})
/routes/admin.js
Router.get('*',(req,res) =>{
// server from angular build using command ng build
res.sendFile(path.join(APP_PATH,'admin/index.html'));
})
How can I serve two different apps using the same nodeJS server?
This should work
app.use('/',express.static('build'));
app.use('/admin',express.static('admin'));
I am trying to add BrowserSync to my react.js node project. My problem is that my project manages the url routing, listening port and mongoose connection through the server.js file so obviously when I run a browser-sync task and check the localhost url http://localhost:3000 I get a Cannot GET /.
Is there a way to force browser-sync to use my server.js file? Should I be using a secondary nodemon server or something (and if i do how can the cross-browser syncing work)? I am really lost and all the examples I have seen add more confusion. Help!!
gulp.task('browser-sync', function() {
browserSync({
server: {
baseDir: "./"
},
files: [
'static/**/*.*',
'!static/js/bundle.js'
],
});
});
We had a similar issue that we were able to fix by using proxy-middleware(https://www.npmjs.com/package/proxy-middleware). BrowserSync lets you add middleware so you can process each request. Here is a trimmed down example of what we were doing:
var proxy = require('proxy-middleware');
var url = require('url');
// the base url where to forward the requests
var proxyOptions = url.parse('https://appserver:8080/api');
// Which route browserSync should forward to the gateway
proxyOptions.route = '/api'
// so an ajax request to browserSync http://localhost:3000/api/users would be
// sent via proxy to http://appserver:8080/api/users while letting any requests
// that don't have /api at the beginning of the path fall back to the default behavior.
browserSync({
// other browserSync options
// ....
server: {
middleware: [
// proxy /api requests to api gateway
proxy(proxyOptions)
]
}
});
The cool thing about this is that you can change where the proxy is pointed, so you can test against different environments. One thing to note is that all of our routes start with /api which makes this approach a lot easier. It would be a little more tricky to pick and choose which routes to proxy but hopefully the example above will give you a good starting point.
The other option would be to use CORS, but if you aren't dealing with that in production it may not be worth messing with for your dev environment.
I'm using yeoman for my application which consists of 2 parts - client site with js/html/css and the rest service.
During development I start rest service in Eclipse and start server for my static files with
grunt server
The problem is that I have to do a post request to root url '/' (it's a fake login POST request to make browsers prompt to save passwords).
It worked with yeoman 0.9 but after updating I get:
Cannot POST /
Is there a way to configure grunt server task to accept POST requests?
Thanks!
Leonti
I think you want the connect-rest middleware.
https://github.com/imrefazekas/connect-rest
npm install connect-rest --save-dev
Edit Gruntfile.js, at the top
var restSupport = require('connect-rest');
restSupport.post( { path: '/savequestion'}, function(req, content, next){
next(null, {result: 'OK'});
});
In your connect or livereload middleware section:
livereload: {
options: {
middleware: function (connect) {
return [
lrSnippet,
mountFolder(connect, '.tmp'),
mountFolder(connect, yeomanConfig.app),
restSupport.rester( {'context': '/forms'} ),
rewriteRulesSnippet, // RewriteRules support
The key part is "restSupport.rester()", remove the context if you don't want it.
This simple function should just reply with the json object {result: 'OK'} to everything you post to /forms/savequestion . It should at least let you build out scaffolding in grunt server :9000 mode before you have build your templates. Without this you would have to $.get() each $.post() and then change it during or after the build.