I am using Express with Node and then building a React app with this which is single page, except one static HTML file.
I have this working locally, so when I go to localhost:3000/static-file.html, I can see the file. But this doesn't work in production.
I can't even hit any of the test console.log statements, so I know that nothing is being hit when requesting static-file.html. Please see below part of my app.js file:
if (process.env.NODE_ENV === "production") {
app.get('/static-file.html', function (req, res) {
console.log('test1');
});
app.get('static-file.html', function (req, res) {
console.log('test2');
});
app.get('static-file', function (req, res) {
console.log('test3');
});
app.get('/static-file', function (req, res) {
console.log('test4');
});
app.use(express.static("client/build"));
}
When I go to production-site.com/static-file.html - I just see the index still, unlike with localhost.
Can anybody help me on that? Thanks so much.
Try something like this:
const express = require('express');
const app = express();
const path = require('path');
// the __dirname is the current directory from where the script is running
app.use(express.static(__dirname));
app.use(express.static(path.join(__dirname, 'build')));
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname + '/build/index.html'))
})
/* Here build is the production build directory and index.html is the main html page to show */
Related
I am running the express server on localhost:8080. The API is working fine.
I have added a new folder called public in express server source and added the react project source in the folder.
I have added homepage:"." but no results. The application works fine with serve -s build from root of App but not with the express server!
import { Router, Request, Response } from 'express';
import { V1_Router } from './v1';
import path from 'path';
export const Routes = Router();
Routes
.use('/v1/', V1_Router)
.get('/*', async (_req: Request, res: Response) => {
res.sendFile(path.resolve('../public/build/index.html'));
});
I have checked the console no errors! All Javascript and CSS files are completely loaded just not running for some reason please help me...
Change it in something like that
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname, 'public', 'build', 'index.html'));
});
app.listen(process.env.PORT || 8080);
EDIT1
app.use(express.static(path.join(__dirname, "..", "build")));
app.use(express.static("public"));
app.use((req, res, next) => {
res.sendFile(path.join(__dirname, "..", "build", "index.html"));
});
I have created an express angular app which works fine but if I am at a URL say http://localhost:4007/login and hit refresh it gets an error tried many things to correct it nothing works.
My server snippet code is as follow.
app.use(express.static(path.join(__dirname, '../client/dist/bringclean')));;
app.get('/*', function (req, res){
res.redirect('/');
});
app.listen(4007, function () {
console.log('BringClean app is running on port 4007');
});
Found a way to solve the problem.
const routes = require('express').Router();
routes.get('*', function (req, res) {
res.sendFile(path.join(__dirname + '/../client/dist/projectname/index.html'));
});
Files:
I have two different frontend build apps, each one in own directory - frontApp and frontAdmin and I need to send them on different requests
in routes/index.js
router.get('/', (req, res) => {
res.sendFile('index.html');
});
router.get('/admin', (req, res) => {
res.sendFile('admin/index.html');
});
I tried
in app.js
const frontPath = express.static(path.join(__dirname, '/frontApp'));
const adminPath = express.static(path.join(__dirname, '/frontAdmin'));
app.use(frontPath);
app.use('/admin', adminPath);
At the end i get the app on http://localhost:3000/admin/ but with errors
Sorry for incorrect question, the problem was in mime type
i did this and it works now
const frontPath = express.static(path.join(__dirname, '/frontApp'));
const adminPath = express.static(path.join(__dirname, '/frontAdmin'));
app.use(frontPath);
app.use(adminPath);
app.use('/admin', adminPath);
I have the following express server setup:
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function (req, res) {
console.log('/*');
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.get('/test', function (req, res) {
console.log('test');
//res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(9000);
Everytime I hit localhost:9000/test, it still take to the route '/'.
I tried placing the app.get code before the static declaration but I don't think that really makes any difference. Any idea why this is happening?
Your existing code is fine. It should work.
I believe you had your index route as app.get('/*', function (req, res){ instead of app.get('/', function (req, res) { before and that's why it was capturing all requests.
In the /test route handler you have to terminate the request-response cycle by using res.end(), something like this:
app.get('/test', function (req, res) {
console.log('test');
res.end();
});
Otherwise the page will never refresh showing the first page (route /)
Hope this helps
I am trying to make az ExtJS application with a Node.js server. My server code currently looks like this:
var express = require('express');
var app = express();
app.get('/', function (req, res) {
res.sendfile(filedir + '/index.html');
});
app.get('/employees', function(req, res){
console.log("hello");
});
app.listen(3000);
When I open localhost:3000 in a browser, the html file is load, but not correctly. Checking in firebug I see that itt cannot find the linked files in html. For example
"NetworkError: 404 Not Found - http://localhost:3000/ext-4/ext-debug.js".
This is quite logical, since the file doesn't exist on that URL. My question would be how to fix this issue, so it could find every single linked file on my filesystem.
I'm clearly doing something wrong or missing something, I am totally new in node.
Doesn't look like you're configuring Express' static file handler.
Try adding this code:
app.configure(function() {
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.bodyParser());
app.use(express.logger("short"));
});
It would go right after var app = ... like this:
var express = require('express');
var app = express();
app.configure(function() {
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.bodyParser());
app.use(express.logger("short"));
});
app.get('/', function (req, res) {
res.sendfile(filedir + '/index.html');
});
app.get('/employees', function(req, res){
console.log("hello");
});
app.listen(3000);
And then place your static files under the ./public directory.
You'll want to use some static middleware such as: http://www.senchalabs.org/connect/static.html
note express inherits connect so you can
app.use(express.static(filedir));
Or the full thing:
var express = require('express');
var app = express();
app.use(express.static(filedir));
app.get('/employees', function(req, res){
console.log("hello");
res.send("hello");
});
app.listen(3000);