Serving static files in Express
To serve static files such as images, CSS files, and JavaScript files, use the express.static
built-in middleware function in Express.
Pass the name of the directory that contains the static assets to the express.static
middleware function to start serving the files directly. For example, use the following code to serve images, CSS files, and JavaScript files in a directory named public
:
app.use(express.static('public'))
Now, you can load the files that are in the public
directory:
http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html
To use multiple static assets directories, call the express.static
middleware function multiple times:
app.use(express.static('public'))
app.use(express.static('files'))
Express looks up the files in the order in which you set the static directories with the express.static
middleware function.
To create a virtual path prefix (where the path does not actually exist in the file system) for files that are served by the express.static
function,specify a mount path for the static directory, as shown below:
app.use('/static', express.static('public'))
Now, you can load the files that are in the public
directory from the /static
path prefix.
http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html
However, the path that you provide to the express.static
function is relative to the directory from where you launch your node
process. If you run the express app from another directory, it’s safer to use the absolute path of the directory that you want to serve:
app.use('/static', express.static(path.join(__dirname, 'public')))
openshift上創建的node1.0工程樣例中index.html引用的所有資源都是絕對地址,
為什么呢,因為它不知道我們的目錄結構,也不想建一些我們不想要的目錄,就空着了。
四處查詢得出一個結論,必須得對靜態文件目錄作處理才能不至於404,而工程里只有一個server.js

#!/bin/env node // OpenShift sample Node application var express = require('express'); var fs = require('fs'); /** * Define the sample application. */ var SampleApp = function() { // Scope. var self = this; /* ================================================================ */ /* Helper functions. */ /* ================================================================ */ /** * Set up server IP address and port # using env variables/defaults. */ self.setupVariables = function() { // Set the environment variables we need. self.ipaddress = process.env.OPENSHIFT_NODEJS_IP; self.port = process.env.OPENSHIFT_NODEJS_PORT || 8080; if (typeof self.ipaddress === "undefined") { // Log errors on OpenShift but continue w/ 127.0.0.1 - this // allows us to run/test the app locally. console.warn('No OPENSHIFT_NODEJS_IP var, using 127.0.0.1'); self.ipaddress = "127.0.0.1"; }; }; /** * Populate the cache. */ self.populateCache = function() { if (typeof self.zcache === "undefined") { self.zcache = { 'index.html': '' }; } // Local cache for static content. self.zcache['index.html'] = fs.readFileSync('./index.html'); }; /** * Retrieve entry (content) from cache. * @param {string} key Key identifying content to retrieve from cache. */ self.cache_get = function(key) { return self.zcache[key]; }; /** * terminator === the termination handler * Terminate server on receipt of the specified signal. * @param {string} sig Signal to terminate on. */ self.terminator = function(sig){ if (typeof sig === "string") { console.log('%s: Received %s - terminating sample app ...', Date(Date.now()), sig); process.exit(1); } console.log('%s: Node server stopped.', Date(Date.now()) ); }; /** * Setup termination handlers (for exit and a list of signals). */ self.setupTerminationHandlers = function(){ // Process on exit and signals. process.on('exit', function() { self.terminator(); }); // Removed 'SIGPIPE' from the list - bugz 852598. ['SIGHUP', 'SIGINT', 'SIGQUIT', 'SIGILL', 'SIGTRAP', 'SIGABRT', 'SIGBUS', 'SIGFPE', 'SIGUSR1', 'SIGSEGV', 'SIGUSR2', 'SIGTERM' ].forEach(function(element, index, array) { process.on(element, function() { self.terminator(element); }); }); }; /* ================================================================ */ /* App server functions (main app logic here). */ /* ================================================================ */ /** * Create the routing table entries + handlers for the application. */ self.createRoutes = function() { self.routes = { }; self.routes['/asciimo'] = function(req, res) { var link = "http://i.imgur.com/kmbjB.png"; res.send("<html><body><img src='" + link + "'></body></html>"); }; self.routes['/'] = function(req, res) { res.setHeader('Content-Type', 'text/html'); res.send(self.cache_get('index.html') ); }; }; /** * Initialize the server (express) and create the routes and register * the handlers. */ self.initializeServer = function() { self.createRoutes(); self.app = express.createServer(); // Add handlers for the app (from the routes). for (var r in self.routes) { self.app.get(r, self.routes[r]); } }; /** * Initializes the sample application. */ self.initialize = function() { self.setupVariables(); self.populateCache(); self.setupTerminationHandlers(); // Create the express server and routes. self.initializeServer(); }; /** * Start the server (starts up the sample application). */ self.start = function() { // Start the app on the specific interface (and port). self.app.listen(self.port, self.ipaddress, function() { console.log('%s: Node server started on %s:%d ...', Date(Date.now() ), self.ipaddress, self.port); }); }; }; /* Sample Application. */ /** * main(): Main code. */ var zapp = new SampleApp(); zapp.initialize(); zapp.start();
另一個例子

#!/bin/env node var express = require('express'), fs = require('fs'), io, MongoClient = require('mongodb').MongoClient, MONGODB_ITEMS_TO_LOAD_LIMIT = 50, markdown = require("markdown").markdown; var MyApp = function() { var self = this; self.setupVariables = function() { self.appname = process.env.OPENSHIFT_APP_NAME || 'rtwc'; self.ipaddress = process.env.OPENSHIFT_INTERNAL_IP || process.env.OPENSHIFT_NODEJS_IP; self.port = process.env.OPENSHIFT_INTERNAL_PORT || process.env.OPENSHIFT_NODEJS_PORT || 8082; self.dbport = process.env.OPENSHIFT_MONGODB_DB_PORT || 27017; self.dbname = self.appname; if (typeof self.ipaddress === "undefined") { console.warn('No OPENSHIFT_NODEJS_IP var, using 127.0.0.1'); self.ipaddress = "127.0.0.1"; } if (process.env.OPENSHIFT_MONGODB_DB_PASSWORD) { console.log("We are in OpenShift"); self.connection_string = process.env.OPENSHIFT_MONGODB_DB_USERNAME + ":" + process.env.OPENSHIFT_MONGODB_DB_PASSWORD + "@" + process.env.OPENSHIFT_MONGODB_DB_HOST + ':' + self.dbport + '/' + self.dbname; } else { console.log("We are in localhost"); self.connection_string = 'admin:VVkkGUKNh2by@' + self.ipaddress + ':' + self.dbport + '/' + self.dbname; } }; /** * Retrieve entry (content) from cache. * @param {string} key Key identifying content to retrieve from cache. */ self.cache_get = function(key) { return self.zcache[key]; }; /** * terminator === the termination handler * Terminate server on receipt of the specified signal. * @param {string} sig Signal to terminate on. */ self.terminator = function(sig) { if (typeof sig === "string") { console.log('%s: Received %s - terminating sample app ...', Date(Date.now()), sig); process.exit(1); } console.log('%s: Node server stopped.', Date(Date.now())); }; /** * Setup termination handlers (for exit and a list of signals). */ self.setupTerminationHandlers = function() { console.log("We are in localhost"); self.connection_string = 'admin:VVkkGUKNh2by@' + self.ipaddress + ':' + self.dbport + '/' + self.dbname; }; }; /** * Retrieve entry (content) from cache. * @param {string} key Key identifying content to retrieve from cache. */ self.cache_get = function(key) { return self.zcache[key]; }; /** * terminator === the termination handler * Terminate server on receipt of the specified signal. * @param {string} sig Signal to terminate on. */ self.terminator = function(sig) { if (typeof sig === "string") { console.log('%s: Received %s - terminating sample app ...', Date(Date.now()), sig); process.exit(1); } console.log('%s: Node server stopped.', Date(Date.now())); }; /** * Setup termination handlers (for exit and a list of signals). */ self.setupTerminationHandlers = function() { /** * Create the routing table entries + handlers for the application. */ self.createRoutes = function() { self.routes = {}; self.routes['/health'] = function(req, res) { res.send('1'); }; self.routes['/asciimo'] = function(req, res) { var link = "http://i.imgur.com/kmbjB.png"; res.send("<html><body><img src='" + link + "'></body></html>"); }; self.routes['/env'] = function(req, res) { var content = 'Version: ' + process.version + '\n<br/>\n' + 'Env: {<br/>\n<pre>'; for (var k in process.env) { content += ' ' + k + ': ' + process.env[k] + '\n'; } content += '}\n</pre><br/>\n'; res.send(content); res.send('<html>\n' + ' <head><title>Node.js Process Env</title></head>\n' + ' <body>\n<br/>\n' + content + '</body>\n</html>'); }; self.routes['/'] = function(req, res) { res.render('page'); // page.jade is our template }; }; /** * Initialize the server (express), create the routes and register * the handlers. */ self.initializeServer = function() { self.createRoutes(); self.app = express(); self.app.set('views', __dirname + '/tpl'); self.app.set('view engine', 'jade'); self.app.engine('jade', require('jade').__express); for (var r in self.routes) { self.app.get(r, self.routes[r]); } self.app.use(express.static(__dirname + '/public')); self.app.use('/docs', express.static(__dirname + '/docs')); }; /** * Initializes the sample application. */ self.initialize = function() { self.setupVariables(); /*self.populateCache();*/ self.setupTerminationHandlers(); self.initializeServer(); }; /** * Start the server (starts up the sample application). */ self.start = function() { io = require('socket.io').listen( self.app.listen(self.port, self.ipaddress, function() { console.log('%s: Node server started on %s:%d ...', Date(Date.now()), self.ipaddress, self.port); })); io.sockets.on('connection', function(socket) { socket.emit('connected', { id: socket.id }); console.log("Socket with ID %s connected on %s", socket.id, new Date()); socket.on('recognizing user', function(user) { if (user.isNewish) { socket.set('nickname', user.name); } io.sockets.emit('user recognized', user); }); MongoClient.connect('mongodb://' + self.connection_string, function(err, db) { if (err) throw err; db.collection('messages').find().sort({ $natural: -1 }).limit(MONGODB_ITEMS_TO_LOAD_LIMIT).toArray(function(err, docs) { if (err) throw err; socket.emit('messages loaded', docs.reverse()); db.close(); }); }); socket.on('set nickname', function(user) { socket.set('nickname', user.newName, function() { socket.broadcast.emit('nickname set', user); socket.emit('nickname set', user); }); }); socket.on('writing', function(data) { this.broadcast.emit('written', data); }); socket.on('send message', function(data) { data.text = markdown.toHTML(data.text); io.sockets.emit('message', data); MongoClient.connect('mongodb://' + self.connection_string, function(err, db) { if (err) throw err; db.collection('messages').insert(data, { w: 1 }, function(err, result) { if (err) throw err; console.log("Message saved:"); console.log(data); db.close(); }); }); }); socket.on('disconnect', function() { socket.get('nickname', function(err, name) { if (err) throw err; socket.broadcast.emit('disconnected', { id: socket.id, name: name }); console.log("%s (%s) disconnected. %s", name, socket.id, new Date()); }); }); }); }; }; /* End of application. */ /** * main(): Main code. */ var server = new MyApp(); server.initialize(); server.start();
參看這篇文章,以及上面的寫法:
Express細節探究(1)——app.use(express.static)
//嘗試了文中最后一句'/static'終於奇跡般的加載成功了! 最后改為常見的當前路徑'/' self.initializeServer = function() { self.createRoutes(); self.app = express.createServer(); self.app.use('/', express.static(__dirname + '/web'));
// Add handlers for the app (from the routes). for (var r in self.routes) { self.app.get(r, self.routes[r]); } }; //使用"/"表示靜態資源目錄'/web'
其實也就在openshift的sample上加了一行代碼,沒倒騰過服務器可把我坑了幾個小時。。
一般的部署教程到后面都是講數據庫,都沒人care這個簡單的問題。
html里面這么引用就可以了,不用省了/web/...還搞一個/static/...替代它。
<script src="/html/js/lib/createjs-2015.11.26.min.js"></script>
另一篇通俗的闡述了為什么不能直接讀取html中制定的資源。