Allow requests to travel up the directory tree (../) in express.js - node.js

There might be an answer to this, but I don't know how to phrase it properly, so I'll just ask.
I use a module, called build-url. It is designed for the browser and provides an easy way to construct URLs with query parameters.
I want to store my website in a folder, called site while not having to type it in the URL. I managed to do that easily. However, when the client asks for the build-url.js file, he receives a 404.
Here's how the folder structure looks like:
node_modules
build-url
dist
build-url.js
site
index.html
In my code, I have:
app.use("/", express.static(__dirname + "/site"));
The problem
When I go to http://localhost:5000/, the index.html file is served and everything is fine. Inside, I include the script:
<script src="../node_modules/build-url/dist/build-url.js"></script>
However, in the browser console, I see:
GET http://localhost:5000/node_modules/build-url/dist/build-url.js 404 (Not Found)
The server looks for a node_modules folder inside the site folder, instead of going up the directory tree. How do I fix that?

It is not a very good idea to allow your web server to send files from outside of the specified folder because it will allow the bad guys to download anything from your server including your confidential data.
You can copy required file to static folder or you can setup gulp or any other automation tool to do it automatically.

Related

How do I use AWS S3 to host a static express/nodeJS page?

I am new to nodejs/express/coding in general so my apologies if this isn't extremely clear. I am doing a code challenge for a job.
I have most of the project done. Part of the challenge is to have it uploaded to a bucket on S3. I created a bucket, that is all done. My problem is there needs to be a index.html in the root folder of the bucket (I think). All of my html pages (three of them) sit inside of the views directory. When I try to put my index.html in the root folder on cloud9, it says index.html can't be found in the views directory (obviously, since I moved it out). Can I set the views directory to be in the root folder?
Is there a way with express/nodeJS to have all of the files in the root folder? Or is there a way to keep my views folder as it is in Cloud9 and have everything run like it does from there, except in S3? I must be missing something. I am completely lost as to how to host this app on S3. Posting on here was my last resort! Thanks for any help.
Let's make order. Amazon S3 is a cloud file storage service. It can also be used to host static assets of a website.
From what I understand, you are building something with express, using the view directory, used in general for templates and so, I suppose, you are rendering your html pages by your express application. This is called server side rendering and is fully incompatible with amazon s3 that can only serve files.
Now, how can you resolve the problem (considering that you are obliged to use s3)? It depends.
If you are using express only to render your application and to serve static assets (so no API), you should consider some refactoring: in such case, you are basically building a web application without APIs. You don't need express. Maybe you are searching for a client side framework like Vue.js, React or Angular. To be more general, you should render your application client side.
If your express server is also acting as api server, you should divide your project. From one side you have your express api server, deployed somewhere. From the other side, you have your web app, client side rendered.
There is another solution: you could use a prerender like this to generate static assets from your express application. But if you are new to web developement, I advise you not to evaluate this option
When you move your static files to S3, you will need to setup the relative paths accordingly.
Can I set the views directory to be in the root folder?
No. Instead organize your files in S3 where index.html is the root and files with paths such as js/ css/ images/ taken from the root folder.
Note: Its important to understand that you cannot run NodeJS in S3 and instead you will be using the internal web hosting from S3 to serve the static content.

Serving StyleSheet and JS with Sails

I am a newbie at working with nodeJS and especially with the framework Sails.
I did my research and found that with sails you just need to put CSS-files under the the folder "assets" and call them directly with the URL, e.g. if I put the file custom.css in the folder "assets/foo" I should be able to access it via the URL "localhost:1337/foo/custom.css".
The problem is that my local server throws a 404 Error not being able to find the files, but strangely when I deployed the app to Heroku it works perfectly and I am able to access the css files.
Why is this not working locally?
Welcome to Sails! CSS is served automatically if you put it in your assets/styles folder. Your JS should be in assets/js folder as well. This way you can access it like localhost:1337/assets/js/myjs.js.
In your view - if you don't want to serve it everywhere with a layout - just put your tag like this: <link rel="stylesheet" href="/styles/myawesomestyle.css"> or <script src="/js/mypowerfuljs.js"></script>.
Remember, everything in assets will be made publicly available.
I really recommend that you read the docs HERE.

why /public folder for static content in node.js

In node.js with express all the static content is placed in /public folder. Can someone help me understand why do we need to place it particularly in public folder? What if I want to create a folder called 'static' with in 'views' folder and keep all images, styles and script files in it. Because I want keep all thing related to views under one folder. If it is not good way of structuring project please help me in understanding reasons behind it.
You can put your content in any folder you want on the server. All that matters is how you set up your Express routes to serve that public content. You can name the local server folder /public or /static or whatever you want and you can put it anywhere in your folder hierarchy that you want too (like in some project directory). You will just need to set the path in your express.static() middleware to match where you put the content on your server so express knows where to look for it to match a given incoming request.

Redis-commander won't load static files when run in iframe

I have the following problem:
There's a server with Redis on it.
I want to be able to see Redis data and change it on my web-site. So I installed redis-commander on the server via npm. It usually listens to 8081 port.
And in my front-end part I created a button "Redis manager", which showes view with the following html:
<iframe id="frame" src="{{redisUIUrl}}" />
redisUIUrl looks like: https://example.com/redis
there's NGINX between front-end and server, which is used for reverse-proxy purpose. - it makes proxy_pass to oh_so_very_secret_syte.com:8081
So, when we make this GET, we get views from redis-commander. Everything is fine. But in this views there are links to the static of type: /css/default.css - relative ones.
And the problem is that instead of loading static via the address https://example.com/redis/css/default.css it tries to load it via https://example.com/css/default.css and fails.
I don't really understand, what is the problem and how to deal with it. So, I am asking for your help. Thank you in advance.
/css/default.css may be a relative URL, but it has an absolute path component. Which means that all references are relative to your server root.
If you require a path relative URL you need to drop the leading /.
css/default.css
will reference resources in the same directory as the current document.

URL paths work local but not on server

Most of the URL links (css, images, js files etc) in my project are absolute, but these don't work on my server.
I've located the project on my server in a subfolder, so it is going to the root.
How can I change this so the url like /images/background.jpg is going to 123.12.34.56/projectfolder/images/background.jpg instead of 123.12.34.56/images/background.jpg?
I guess it has something to do with Apache config, but I couldn't find it yet...
I'm using Laravel, so maybe there are some laraways to fix this.
Try to take the path url from the root.
If you are using PHP you can use getcwd() function and save it in a variable path root and keep all your URL as relative paths not the absolute paths.
Hope this helps.
what i usually do is create a sub domain (cdn.example.com) and point it to a directory called assets which is in the same level as the public directory. All my js, images, css are in there.
Then in the app.config add a new key value pair 'cdn' => 'http://cdn.example.com'. When i'm adding css or js files i'm using it like this.
<script src="<?php echo Config::get('app.cdn') ?>/js/jquery/1.7.1/jquery.min.js"></script>
Why do this? say if i decide to move my assets to a caching server i can easily do so by moving just the cdn.example.com

Resources