I'm using node.js+express for serving static files (CSS+JS). At this time static dir is configured as
app.use(express.static(__dirname + '/static'));
In main templeate layout.jade I load static files as
link(href='css/bootstrap.css', rel='stylesheet')
Everything works fine with pages like /hello, /write, /:user. But when I get pages like /bob/505b6833d3835d3705000001/edit, static files cannot be found. Firebug shows Node generates the same path for static, but styles are not applied for the page. Why? Thanks in advance!
You should be using link with pre-slash.
link(href='/css/bootstrap.css', rel='stylesheet')
This should take care of it.
Related
I have very strange behavior in my application. I want to add multiply static path to my app.js file.
First for main application:
app.use(express.static(path.join(__dirname, 'public')));
And second for landing pages which located in 'ads' directory.
app.use('/ads', express.static(path.join(__dirname, 'ads')));
Folder structure:
public
- build
- ...
ads
- currency
- public
- build
- 1.css
- 2.js
- index.html
...
app.js
In my main application all JS and CSS files loading successfully, but when i get in to path /ads/currency my index.html loaded but .css, .js and images don't. However if i pass to command line /ads/currency/public/build/1.css it is loading normal.
Does someone know about it?
Screenshots was attached:
Nginx config:
It has nothing to do with your configuration but might be related to Chrome (i.e. an extension), since the error says ERR_BLOCKED_BY_CLIENT.
Check your ad blockers log. The keyword ads in the path might be blocked, since a filter might try to catch a javascript miner.
You should make sure the move the whole "ads" part into a different folder - avoiding the keyword "ads" at all. Disabling the ad blocker might work for you know, bot not for your users
I'm running self hosted Nancy web application on Owin and have troubles with static content.
Let's say my application runs from this folder:
c:/myfolder/
My Views are in here:
c:/myfolder/Manager/Views/
so in my browser I can go to http://localhost:85/Manager and my page loads.
I simply can't make it to serve static content though, all my files are in /Content folder, I tried to place it both to /myfolder and /Manager folder with no luck.
Neither http://localhost:85/Manager/Content/css/styles.css nor http://localhost:85/Content/css/styles.css urls work
How do I get it to work?
Fixed the problem by adding these lines of code to Startup :
using Microsoft.Owin.FileSystems;
using Microsoft.Owin.StaticFiles;
...
var options = new FileServerOptions()
{
RequestPath = PathString.Empty,
FileSystem = new PhysicalFileSystem("/Path/here")
};
app.UseFileServer(options);
I am working on a development platform, I have code similar to the following:
app.use('/public', express.static( config.directory.public ));
The issue is that there are many (100s) of projects each with its own directory structure. The project will be selected via the URL:
http://localhost/dev/accounts
Where accounts is a project with its own directory tree and static public directory.
I do not want to run a separate copy of node for each project. Once a project has been selected via the URL then express needs to be reconfigured to serve files for that request.
However, that approach is probably not feasible because we may be working on many projects at the same time. So every request for static files would have to be processed according to the project URL. It seems to negate the benefit of static directories.
I think what I am after is a way to put variables into the directory path
http://localhost/dev/accounts
Would set a variable called prj = "accounts" and then somehow set express so that the root directory is "c:\projects\" + prj + "\public".
If I simply issue a new app.use(..) statement for every request I imagine bad things will happen.
Maybe I am better off just manually reading the file contents for each static request and sending the contents back.
Is there another way to approach this problem?
I'm not sure if I understood your question correctly, but express serves static files in file directories automatically for you. If you have a bunch of projects in some 'path/to/public' folder, you just need to do something like
app.use('/', express.static( __dirname + '/public' ));
That way, you just need to type some url like
http://localhost/project1
or
http://localhost/project2
i have set the static web directory for use in my nodejs app:
app.use express.static(process.cwd(), 'www')
This brings up all the static files like css, images etc, when im in the root it works
http://localhost:8124/
however if i go to somewhere like /tags, it deosnt bring up the static files:
http://localhost:8124/tags/
i get 404 error on the console because its trying to access the www folder
with
/tags/www/ ....
im not sure how to solve this problem, thanks
It looks like you're referring to static assets, without leading /, this results in appending relative asset address to the current URL. Instead refer to your static assets with leading /
eg. /www/style.css rather than www/style.css
I've got a weird issue which I can't seem to figure out with expressjs. I've specified a public folder for all static files such as js, css and images. I'm using app.use(express.static(__dirname + '/public')); to specify the folder. This works perfectly except for one case.
Inside the public folder, I've got 3 folders called js, css and images. Within one of my css files, I'm doing background-image: url(/images/bg.png) no-repeat; but this url is not resolving and the image is not showing on the page.
However, if I do something like img(src='/images/bg.png') from within one of my views, the image shows. I'm assuming that this has to do with the fact that I'm linking from a static file and node/express are ignoring all routes(?) from within the static files.
How would one go about linking to images in css files located inside a static folder in express?
Your CSS urls are relitive to the STYLESHEET so the url you have is looking for the path /css/images/bg.png you want to have the url be ../images/bg.png