I need an Openshift person to answer this. Local server working serving files from /static folder on root. Once ported up to Openshift, "404 not found". There is something in Openshift that is changing my routes. I'm using the lines:
const repoDir = env.OPENSHIFT_REPO_DIR || __dirname;
app.use(express.static(repoDir + '/static'));
What step am I missing?
I am user of OpenShift‎.
Recently I have came across the similar issue.
Please refer the below to check if it resolves the issue.
1. Check if you get the below error.
TypeError: Object #<ServerResponse> has no method 'sendFile'
- try Upgrading expressJS version
2. Use the below approach to serve the static files including js. Working sample
<code>
app.use(express.static(path.join(__dirname, '/public')));
app.get('/', function(req, res){
res.sendFile(path.join(__dirname, '/views/index.html'));
});
</code>
express - version is 4.14.0
Related
I'm trying to serve a production build of a React app(Typescript), booted with create-react-app.
I'm following the official guide: https://create-react-app.dev/docs/deployment/
There's nothing unique about my setup. This is the server.js file, located in the root directory(above src):
app.use(express.static(path.join(__dirname, 'build')));
app.get('/*', function (req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(8000);
The production files are created within a folder called build. An example of the paths generated:
<script src="./static/js/main.0ae46692.chunk.js"></script>
When i navigate to localhost:8000/, everything is served fine. The initial request serves the index.html, and the script requests serve the correct files.
But, when i try to navigate(from the browser) to something like localhost:8000/todos, all script requests return index.html.
I do not see anything "special" about my setup, and do not understand what's going on. Am i missing something in the guide? It clearly states that app.get('/*',...) fixes the issue.
Any help will be greatly appreciated.
Copying the comment into an answer here so it can be marked.
This sounds like the issue is the script tags are generated with relative paths, because it works when you make a request to the root /, but not anything else. Could you try setting the "homepage" to "localhost:8000"
I want to deploy an application that I perform with the MEAN stack on Heroku, but I encounter 1 problem.
I have this folder structure, my node server, with a public folder, where is the dist / fronted folder and all the files generated by Angular's ng build --prod, it works when I start the server and browse normally, but if I refresh the page or write a route myself, I get these errors:
Errores
Sorry for my English.
If your are building a MEAN stack, you probably have a server.js or index.js or app.js as an entry point to your application. An SPA by definition manages all the routes within the router configuration. But if you try to refresh or type a route yourself, it is like you were trying to access that folder on the server (ex: www.mywebsite.com/about, here the folder about might not exist on the server, it is just known by your Angular app)
My suggestion is that you try to add this fix to the app.js (or server.js or app.js) file, so all unexisting routes or refresh go back to your index.html:
// Check your port is correctly set:
const port = process.env.PORT || 8080;
// Is saying express to put everything on the dist folder under root directory
// Check the folder to fit your project architecture
app.use(express.static(__dirname + "/dist"));
// RegEx saying "capture all routes typen directly into the browser"
app.get(/.*/, function(req, res) {
// Because it is a SPA, all unknown routes will redirect to index.html
res.sendFile(__dirname + "/dist/index.html");
});
app.listen(port);
This guy shows full deploy on Heroku with Angular: https://www.youtube.com/watch?v=cBfcbb07Tqk
Hope it works for you!
I have been working for hours on figuring out how to deploy my Angular 6 project on NodeJS Express server,
First, in development i use ng serve which refer to localhost:4200 (default) and another one is Node Express for API (interacting with DB) on localhost:3000. In production i want the Angular build to be served from that Node Express server too.
So what i did was:
Setting up <base href="/"> on index.html on Angular Project
Run ng build --prod it went 100% smooth, no errors.
Copy all files from dist/myprojectname on Angular to Node Express server directory under views/.
In index.js i add following lines app.use(express.static(path.join(__dirname, '/views/')));
it got error something like this
Refused to apply style from 'http://localhost:3001/styles.a64e6aa0f6090e05d2190.css/' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
3localhost/:16 GET http://localhost:3001/runtime.16a329deb1d564eef6599.js/ net::ERR_ABORTED 404 (Not Found)
If i use app.use('/*', express.static(path.join(__dirname, '/views/')));
it will give following error:
Uncaught SyntaxError: Unexpected token <
This seems similar to this issue, are you sure that your css files are NOT starting with comments?
From the linked question's answer:
The issue i think it was with a CSS library starting with comments.
While on dev, i do not minify files and i don't remove comments, this
meant that the stylesheet started with some comments, causing it to be
seen as something different from css.
Hope this helps you this worked perfectly fine for me. The important part of the code is below. My angular application is in ROOT_FOLDER/dist/index.html . You can set the compile/output path in angular.json (variable is outputPath). My express.js file and package.json file is just under the root folder.
const bodyParser = require('body-parser');
const DIST_FOLDER = join(process.cwd(), 'dist');
const STARTING_SERVER_MSG = 'Running server on port %s';
const VIEW_ENGINE_STR = 'view engine';
const HTML_STR = 'html';
const VIEWS_STR = 'views';
const BROWSER_STR = 'browser';
private routes() {
// This part might be useless STRAT_LINK later
this.app.set(VIEW_ENGINE_STR, HTML_STR);
this.app.set(VIEWS_STR, join(DIST_FOLDER));
this.app.use(express.static(join(DIST_FOLDER)));
this.app.use(bodyParser.json());
this.app.use(bodyParser.urlencoded({extended: false}));
// this.app.use('/env', envRouter);
// get router
this.app.use(function (req, res, next) {
res.sendFile(join(DIST_FOLDER, 'index.html'), {req});
});
}
I'm using a simple node express server which is wrapped in the Webpack Dev Server (http://webpack.github.io/docs/webpack-dev-server.html)
I'm starting an express app from a top level directory where the static files are in a directory called "public".
I've got this line of configuration:
server.app.use(express.static(__dirname + '/public'));
If I type http://0.0.0.0:3000/index.html, all is good.
How but the URL of http://0.0.0.0:3000/ produces a directory listing of the top level.
What is the proper way to configure http://0.0.0.0:3000/ to go to the index.html file?
add
server.app.get('/', function(req, res) {
res.sendFile('index.html');
});
See the docs http://devdocs.io/express/index#res.sendFile
The solution involved setting the contentBase proper of the WebpackDevServer plus telling the
server.app.use(express.static(__dirname + contentbase);
Per this diff
The docs are here: http://webpack.github.io/docs/webpack-dev-server.html
Looking at SockJS multiplex example
I got the server running. When I go to http://127.0.0.1:9999/multiplex I see a welcome message "Welcome to SockJS!"
When I try to browser to index.hmtl http://127.0.0.1:9999/index.html I get 404 message "Cannot GET /index.html"
The 'index.html' is in the same directory as the server.js is running. Why can't the server find this file?
Please double check if you're using good express version. Express 3 changed API's and code may require some tweaking. See sockjs-node/examples for examples.
Installed express 3.1.1 and made some code updates to server.js. Now when I go to http://127.0.0.1:9999/ it serves me index.html as specified in server:
app.get('/', function (req, res) {
res.sendfile(__dirname + '/index.html');
});
Not sure why but http://127.0.0.1:9999/index.html still doesn't give me the file.