Express Static nodejs - javascript

There is a style.css in public, but I can't seem to make the express static option work. I deleted express and have done npm install express, but still it isn't working. I just get a 404 error.
var express = require('express')
, app = express.createServer();
app.use(express.static(__dirname+'/public'));
app.listen(8080, "127.0.0.1");
I have added an app.get() block to insure express is properly running, but I am still unable to request the static file.

An important detail that I have overlooked on multiple occasions now is that "public" is not in the URL of the static content you are delivering.
Alfred example nails it but it is easy to miss. The location of the README file is not localhost:8080/public/README, but simply localhost:8080/README

Works just fine for me.
app.js
var express = require('express')
, app = express.createServer();
app.use(express.static(__dirname+'/public'));
app.listen(8080, "127.0.0.1");
mkdir public
cd public
touch README
README
test
$ curl http://localhost:8080/README
test
$ npm ls
connect#1.6.1
express#2.4.4

app.use(express.static('public'));
http://expressjs.com/4x/api.html#express.static

Related

How to add user authentication to docsifyjs

I am using docsifyjs to create a documentation. But I wanted to add Authentication to access the docs.
Basically we serve the docs with following commands
Initializing docsify
docsify init ./docs
After the init is complete, you can see the file list in the ./docs subdirectory.
index.html as the entry file
README.md as the home page
.nojekyll prevents GitHub Pages from ignoring files that begin with an underscore
We can now serve the mark-down files as HTML with following commands.
docsify serve docs
or
cd docs && python -m SimpleHTTPServer 3000
or
npx http-server docs
Here docsify is served by giving the path of initialized directory.
But I am not able to figure out how to serve this with expressJS. So that I can add authentication.
I have tried adding app.js to ./docs and added the following code but markdown files are not being rendered.
var express = require('express');
var path = require('path');
var serveStatic = require('serve-static');
var app = express();
app.use(serveStatic('/', { 'index': ['index.html', 'index.htm'] }));
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname, 'index.html'));
})
app.listen(8000);
Please help. Thanks

Configure express to call external API in proxy.conf.json in production

I have two apps running on heroku, myserverapi(spring boot) and client(Angular app). the server is running on myserver.heroku.com while the client is myclient.heroku.com currently my express server is only serving static files. I am new to express want to know how to make it access my proxy.conf.json file where I have declared the domain it should call. everything works fine locally with Cli but after deployment, it doesn't work.
proxy.Conf.json file below
{
"/api": {
"target": "https://mygramapi.herokuapp.com",
"secure": false,
"changeOrigin": true
}
}
And my express server.js
//Install express server
const express = require('express');
const path = require('path');
const app = express();
// Serve only the static files form the dist directory
app.use(express.static(__dirname + '/dist/mygram'));
app.get('/*', function(req,res) {
res.sendFile(path.join(__dirname +'/src'));
});
console.log(app);
// Start the app by listening on the default Heroku port
app.listen(process.env.PORT || 4000);
my API's all start with /api eg /api/login, /api/signup etc
is there a comprehensive way of handling this
thank you.
express-http-proxy has the solution but i have a few question about it, does it mean i delete the express.js file and how about my static files , im not sure to add this to my existing code, so im accessing both static files and api's
const url = require('url');
const proxy = require('express-http-proxy');
// New hostname+path as specified by question:
const apiProxy = proxy('https://myserverapi.heroku.com', {
forwardPath: req => url.parse(req.baseUrl).path
});
app.use('/api/*', apiProxy);
how do make them all work
Good day!
As you may know, proxy.conf.json can be used only for webpack dev server - this proxy configuration ignores when you've built the prod bundle and just serve it via express server. For your case, I can suggest to check this npm package: https://www.npmjs.com/package/express-http-proxy or try to setup nginx.

How to deploy a Vue.js application on Node.js server

I have a dist folder containing CSS, fonts, JS folder and an index.html file minimized for Vue.js, ready to deploy and use. I want to use Node.js to run this application. How can I set this up to just run npm run server and have it deployed on a specific port requested? Not sure how to structure this or if I need to build it in a specific way to run this Vue app. Any help would be greatly appreciated.
Since Vue is only a frontend library, the easiest way to host it and do things like serve up assets is to create a simple Express friendly script that you can use to start a mini-web server. Read up quickly on Express if you haven’t already. After that, add express:
npm install express --save
Now add a server.js file to your project’s root directory :
// server.js
var express = require('express');
var path = require('path');
var serveStatic = require('serve-static');
app = express();
app.use(serveStatic(__dirname + "/dist"));
var port = process.env.PORT || 5000;
var hostname = '127.0.0.1';
app.listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
});
after that you could run :
node server
and your project will be served at the given host and port
Assuming that you have already the dist directory, if you don't have it run :
npm run build
in order to generate it

Run static website using node or grunt?

I am new to node or grunt. I have developed a website using html, css and bootstrap. Now I am confused how to run this site? shall I use nodejs to serve static files or use grunt?
Most of the examples I see use grunt-watch and grunt-serve to serve files. Is watching a file necessary only during development phase and not in production right?
I would also like to minify the files(css,js etc) before I host it. I am from java background where I normally use apache tomcat to deploy and run a webapp, but just for static site I don't want to use tomcat server. How do I go about this?
Note: I am trying to deploy my project on heroku.
As an addition to T.J. Crowder anwer
To serve static html app
npm install -g http-server
http-server ./index.html
To serve nodejs app
npm install -g forever
forever start server.js
To develop static app
//grunt or gulp
//both support watchers, livereaload, minifications, bundling
//google it
To develop nodejs app
express
hapi
meanjs
...many other
Finally got my answer:
Used express js to serve static files
use npm install express --save -dev
and then in the index.js or server.js file:
var express = require('express');
var app = express();
app.set('port', (process.env.PORT || 5000));
app.use(express.static(__dirname + '/public'));
app.get('/', function(request, response) {
response.render('public/');
});
app.listen(app.get('port'), function() {
console.log('Node app is running on port', app.get('port'));
});
So the above line app.use(express.static(__dirname + '/public')); will serve static files like html,css etc from this folder (i.e public)
and then in the command prompt: node index.js will start the server

How to setup simple static server where path '/' points to index.html within dirrectory?

There might be a very simple solution to this question, but I am not able to find answer online and due to my practice with node I can't figure it out either.
I'm trying to set up a simple server.js file that listens on port 80 and serves /dist/index.html file when users enter root address, so example.com
This is my project structure
dist/
index.html
bundle.js
node-modules/
package.json
server.js
You can create a static server with express:
server.js
var express = require('express');
var app = express();
app.use(express.static(__dirname + '/dist'));
app.listen(8080, function() {
console.log('Listening on port: ' + 80);
});
You simply run node server.js to get the static server. This app can also be deployed.
http-server is a simple method of serving from your file system. Install that, then just run http-server -p X in the command line in your project folder, substituting your port number for X

Categories

Resources