Edit
To anyone coming here in the future, I solved this problem by indicating a value for PUBLIC_URL in my .env file.
In my case, I set PUBLIC_URL=/ui and now the static assets are being served from .../ui/static/...
Whenever I build my app and launch it, the browser requests content from the static directory, such as this:
Is it possible to somehow change this? I took a look here, but I didn't have any luck. I tried different combinations of express.static(. . .) to no avail.
Instead of http:///static/bundle123, I want it to request http:///custom/static/bundle123.
I've tried moving my build/static directory into build/custom/static and doing something like this, but it didn't work:
app.use('/static', express.static(path.join(__dirname, './custom')))
What am I doing wrong?
The first argument determines the URL path and the second part determines where the files are located on the file system.
So if your static files are located in the public directory (or in sub directories) and you want to access then on the https://.../static URL, you can use:
app.use('/static', express.static(path.join(__dirname, 'public')));
In your case, assuming you run the server from the build directory, using the following should work:
app.use('/custom/static', express.static(path.join(__dirname, 'static')));
Now if you request an URL https:///custom/static/foo Express will look for a file named foo in the static folder.
Related
I add static CSS,
and this file exists in source code of the page,
but CSS not applied...
In console wrote "blocking CSS because MIMO type does not define correctly"
In link tag type='text/css' exist.
Ask is how I can define 'Content-type' in express automatically?
You can create public folder and add all the client side files.
In your server side you must use it :
app.use(express.static(path.join(__dirname, 'public')));
with path module :
npm install path
I had the same issue yesterday and solved it.
So first node uses folder path to get files.
That means that if you're at http://localhost:3000/ you are at the root of your directory. also you can access your stylesheet via http://localhost:3000/public/css/style.css.
But, you can modify the path using routes and express.static().
You may have an url which is http://localhost:3000/user/index. So he is seeking for the css file such as http://localhost:3000/user/public/css/style.css which does not exist.
the solution might be to use different route files like this :
app.use('/', indexRouter);
app.use('/users', usersRouter);
I set my /public folder as the static directory with express...
app.use(express.static('public'));
I need to include a script tag in my html linking to a file that is located outside of the public directory. (The script itself is a JS file that I installed with npm and is located in node-modules folder).
How do I escape the public directory in my html? I've tried all kinds of variations of ../ but it won't let me out of public.
Maybe there is a better way to handle this rather than trying to link to a script that is located in my node-modules folder?
Any help is appreciated
You don't escape the public directory with express.static(). That is done for security reasons so people can't make up URLs and go poking around your server hard drive.
Instead, you need to make a new route for that script file. If it's a single file and it's in a node_modules directory below where your source file is, you can make just a simple single route:
app.get("/myscript.js", function(req, res) {
res.sendFile(path.join(__dirname, "node_modules/someModule/somescript.js"));
});
Note in this example that the URL you use does not have to be the same as the file's actual name. Unlike with express.static(), they are independent when making a custom route like this so you can make the URL filename be whatever you want as long as it doesn't conflict with other routes you have.
If there are multiple files in that same directory that you want public, but you don't want others in that directory hierarchy to be public, then you can't really use another express.static() to only target a couple files in that directory so you'd either have to move the public files to their own directory or make an individual route for each file.
Here are some other examples:
How to include scripts located inside the node_modules folder?
How to add static file from `node_modules` after declare the `public` as static in express?
You could download just the script and then store it in your public folder.
At Plesk server there are nodejs and reactjs build on hit url the build run but when we hit the nodejs file url of js files it open directly on browser means nodejs files are not secure.
So, it sounds like you are using express.static(), yet the user is able to fetch your server files that are not meant to go to the client. That apparently means that you've pointed express.static at a directory that contains your server files. Instead, you need to point express.static() at a directory hierarchy that ONLY contains files meant to be sent to the client. That means it has to be a separate directory from your server files and it has to not be above your server files directory.
There are many possible places to put it. Here are a couple ways to organize things:
projectDirectory
serverFiles
server.js
clientFiles
index.html
login.html
Then, when running server code from the serverFiles directory, you would use an express.static() like this:
const path = require('path');
app.use(express.static(path.join(__dirname, "../clientFiles")));
Or, you can do it like this:
projectDirectory
serverFiles
server.js
clientFiles
index.html
login.html
const path = require('path');
app.use(express.static(path.join(__dirname, "clientFiles")));
The idea is that the clientFiles directory hierarchy contains only client-side files and express.static() by default will not allow ../ syntax in the URLs to go above it.
Using app.use(express.static('public')) serves the files located under public folder
But if my files are outside the public folder in my application root directly how to serve them.
If you want to serve files in a folder outside of the current working directory, './../<dir_name>' is the way to go.
If you want to serve individual files instead of a directory, then you can use either,
app.use("/<some_url>", express.static(__dirname + '<path_to_file>'));
or
res.sendFile('<path_to_file>');
or use a simple library like, https://www.npmjs.com/package/connect-static-file.
I recommend the first approach though.
Note: replace the <text> with your file names and path names as required.
You can use ./../ to go the parent of the current folder. If you have the following structure:
project
- public
- app_folder
-- app.js
You can use './../public' as the static folder.
I have a test node.js/angular app that uses the yeoman angular-generator. However, I am having problems serving back the rendered .js files from the original .coffee files.
The js files are being rendered and saved to APP_ROOT/.tmp, but any requests for the js files results in a 404.
What is needed (within the Gruntfile?) to allow for the js files to be returned?
Thanks for the help.
Things are working now. The end fix was something was to add an additional static middleware to the app.js file, which was something I had already tried, but it is possible that the path was off causing the fix not to work.
app.js
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.static(path.join(__dirname, '.tmp')));
When I first added ~line 2 the app.js folder was moved into the app_root/server folder with the following
app.use(express.static(path.join(__dirname, '..', '.tmp')));
which for some reason wasn't working. That teaches me for moving files around