Nginx reverse proxy server - node.js

I have 2 Ubuntu servers running on same location in digital ocean and the first one running as webserver(nginx) and the other one running as app-server(Nodejs)
Webserver sending request through private ip and as you guys can guess the app-server is not allow the direct requests.
My question is I have image/upload directory in the app-server such as : /srv/upload/user_images and I want to get those images from a web browser.
For example : www.myappserveripaddress.com/srv/upload/user_images/image1.jpeg
but the privilages would be the only image can be accessed from outside.None can access the /srv/upload/user_images/ to see the all images.
I dont know if its possible or not. Only if the user knows the image name , he can enter the ip.com/srv/upload/user_images/imageName.jpg . If this is possible what should I do ?

Not 100% sure I understand your question but in order to link the user to a certain set of images you could append to the name of the image the UserID.
If you have a database, each time a user uploads an image you can also save there just the name of the picture he saved, then when the image is saved in the filesystem you save it with the name {UserID}-{imageName}.jpg.
On his pictures menu he can easily see a list maybe of all the picture names he uploaded. These names are taken from the database and are not a link to a file on the server. Only when he clicks the image a request is constructed for a resource called /server/images/{UserID}-{imageName}.jpg.
The UserID here ensures you do not have duplicate image names in your server.
Hope this helps. If it is in any way wrong please let me know.

You must write an api and client between your servers. Logic is that: end user wants to access an image. Nginx (probably php) receives the request and creates a new request to nodejs. It checks the image path and returns the image to nginx, nginx returns image data to client.

Related

Where save uploaded avatar

I can't find a response to my question.
I'm building a React app using NodeJS and CRA and i need to implement an uploading avatar system. But i'm not sure where to save the uploaded image. My Node server serve a static folder 'public', so does i need to save images in /public/avatar? But each time i will make update on the app and re-build the client-side folder, this will overwrite the public folder and remove all the previous uploaded avatar ? I'm right ? So what are you suggesting me ?
Thanks,
There are multiple locations that you can store your user uploaded images, though storing them in your public is probably not the best location.
In the case where you were using a database like MongoDB, you could store the image inside Mongo using gridfs and serve the data using a route when you retrieve the user information. Similarly, you can also store in the database a path to the file, and return the path, or the file data, from the route as well.
Be careful with user uploads, however, as arbitrarily allowing uploaded data can lead to unanticipated results if you're not careful.
You could also use Gravatar (https://gravatar.com/).
User can choose an avatar assigned to their mail address hash, or use an automatically generated one by default.
Though with this solution you cannot let users change their avatar directly on your website.
It is widely used on well known websites like StackOverflow.

MEAN Stack- Where should I store images meant for particular users?

I am using the MEAN stack for my project. I read online that it is not advisable to store image in the database itself and hence I am not doing that.
For solving this issue, now I have set up a local server (Using express) and I am serving my static image files from there.
Now I am able to use that image by using the URLs, for example:
http://localhost:4200/images/a.jpg
I am planning to host this express app eventually by using some service like heroku.
In my main website, I am achieving authentication(Sign In and Sign Up) by using MongoDb and NodeJs.
I want the images to be shown according to the specific logged in user.
Should I store my images in folder named by username of that user, so that I can genarate the URL string accordingly and access the image by :
http://localhost:4200/user1/a.jpg
Is the flow of my application correct? Is this the way I should be accessing the images for particular users?
I read somewhere that there would be a security issue because anyone having the url of the image can access it. I am not much concerned with security now as this a small project which is not meant for many users. But any suggestions for a way in which there won't be such a security issue would be helpful.
I am new to this and any advice would be helpful.
Thanks in advance.
You could use firebase for this .
Its super easy
Over there you could just create a folder with any name ans save all the images.
In the database you could just save their firebase generated link which can easily be mapped using a user_id or something like it.

Smart router / proxy to containers

I have some simple project that based on 2 docker containers.
Containers are Apache servers - with static HTML files (without PHP).
Container 1: Public content.
Container 2: Private content - for registered users only.
The idea is that users enter to some link, lets say:
http://domain.com/HASH_ID
Then I need to route them to the right container. Users have tokens in their
localstorage(or cookies) - so that's way I can detect where I need to route
the user.
My problem is that I can't understand how to develop that router.
The issue is that I can't change to URL - so I can't create sub domains, URL
level or something like this... I need to allow to users copy urls and sends to
each other.
Please take a look to the attachment image bellow, maybe it will help to
understand the arch.

Forwarding an image upload request to another server

I'm trying to build a NodeJS REST API project based on the so called "micro architecture" (basically multiple smaller NodeJS projects that can run totally independent, but at the same time work together).
Currently users are able to upload images from the app, and my NodeJS backend then processes and saves them appropriately.
Now, what I want to do is the following:
User selects an image to upload from the app -> The app makes a request to the "Main API" endpoint -> The Main API endpoint then forwards this request to the "Image Service" -> Once the Image Service (which is a totally different server) has successfully finished, it should return the URL where the image is stored to the Main API server endpoint, which will then return the info back to the app.
My question is, how do I forward the image upload request from one server to another? Ideally, I don't want the Main API to store the image temporarily and then make a request to the Image Service.
What I'd like is try and forward the data the Main API receives straight to the Image Service server. I guess you could say I want to "stream" the data from one place to another without having to temporarily store on disk or memory. I literally just want it to "tunnel" from one server to another.
Is this possible and is this an efficient way? I just want 1 central point for the app to access, I don't want it to know about this Image Service server. I'd like the app to only ever make requests to the Main API, which will then call my other little services as required.
I'm using NodeJS, Express, Multer (for image uploads) and Digital Ocean hosting (if that should make any difference at all).
What you would basically be doing is setting up a proxy server that will pass requests straight through to another machine and back. There are a few libraries out there to help with this, and this article in particular http://blog.vanamco.com/proxy-requests-in-node-js/ will explain how to go about setting it up even though they are really just trying to get around HTTPS, the same concept applies here.
In short, you get the file upload POST, and then immediately just make that same request to another server and when the response is returned, immediately return it back to the front end. Your entry point can be set up as a hub, and you can proxy requests through to other servers or even just handle them on the same server if necessary.

How can you prevent direct browsing to an image in a web directory?

I'm creating an image gallery site that you have to log in to access. The site will use sessions to keep track of usernames and passwords. Logged in users will be able to search for images and see results. Presumably, this means I'll be putting images in a web directory. How do I keep non-logged in people from being able to browse directly to an image in this directory?
This is PHP-based, with MySQL.
Check for a referrer header, and require it to be from your site.
You can also check that cookies get sent to you (that they're logged in).
Your best bet is then having PHP fetch the images from a location outside of your web dir.
Also, check out the comment string: using mod_rewrite can do all this directly from apache.
Put the images in a folder that isn't accessible through a direct Url, and have the program serve the image directly
Don't put the images in a browsable directory. Better yet, store them outside of your webroot. Put some sort of custom handler in place that will load the requested image and send it back to the user, after the user has been validated and verified. This will also prevent hot-linking of your images.
Put the images in a folder outside the web site, and use a proxy page to send the image to the browser. Make a page that you use as url in your img tag, something like:
getimage.php?id=8783475
In the page you check that the user is logged in, and determine from the parameters what image to send. Set the content type of the page to the type that matches the image, for example "image/jpeg", read the image file and send directly to the response stream.
If your images are not too large, there is a very smart way of protecting them from unauthorized access.
You can you base64 econding, the same as Outlook Express attachment encoding, and put the code inside an ASP page which uses the SESSION object. SEE TUTORIALS ON ASP FOR MORE ON THIS SUBJECT.
When a user accesses the page, the asp code checks if the user is autheticated. If he isn't the script interrupts the page code, not visualizing the image.
If the user is authenticated the scripts loads the entire page and the base64 is reconstructed into a visible image.
The trick here is that you don't have a directory with plain images in it, but the image is encoded in the page html, so it is reconstructed on the fly by the script.
Since you don't have images in the directory, nobody can attempt to point the browser directly to them, since thay simply do not exist.
You can use this site to encode the images:
http://www.motobit.com/util/base64-decoder-encoder.asp
Then you have to "call" the image in the html code using this tag:
img src="data:image/gif;base64, ..............................................(here you place the code obtained from the site above)...............
You're done! Your images are not accessible if the user is not logged in.
Do not let people access your image directories directly.
Let your image gallery software forward the image to the user. Check the needed credentials.

Resources