I am working on a web app and I want to serve users some of their own pictures that I will have stored in a database. I have a profile page view were I have some jade template. I want to load the users pictures when they click on their profile but I do not know where to start with that (I am relatively new to node). I have tried using google but no useful answers have come up. How can I load the user specific pictures from a database using nodeJS?
Any help is appreciated, thank you.
Never store image into db. It's wrong. Store path, url or other, but not Image Binary.
Retrieve url that you have stored into db and put them into your final html.
M.
Related
Hi I’m building a front end web app using reactjs, my app will map over different array of dogs/cats/animals with multiple props and a couple images each. The ui has a search box which then filters out relevant animals.
My question is if my list were to get quite large, do I need to have it stored in a back end ? Or can it all be stored in front end, there will be no sensitive information or anything. So im not worried about security. I do not need to receive any information from the users. Basically it’s just a website for people to browse through.
And my second question. Once deploying to a host, Im currently leaning towards AWS. Is updating/adding/subtracting from my arrays simple as deleting the file and adding the new one into the bucket ??
Sounds exciting! But let's first back up a bit, and take stock of what we're trying to do. Essentially: we want an app that will show a bunch of images with functionality (e.g. filtering).
All images/photos (e.g. this cat photo) are hosted somewhere. Period. So, you can be the one responsible for hosting the images, or you could just have <img /> tags in your react app and refer to an existing img src links, where the image sources are being hosted by someone else.
So to answer your question: my question is if my list were to get quite large, do I need to have it stored in a back end ?
Not necessarily - if you're just referencing a bunch of images from a site that someone else is already hosting, then you're good.
As for this point: Or can it all be stored in front end, there will be no sensitive information or anything.
This question is kinda hard to answer, because nothing is really ever 'stored' in the front-end (let's ignore caching). Images live on the server, and the client (e.g. your chrome browser) makes requests to the server to get the images.
Now: if you want to upload your own photos or let users upload their photos. That's a very different story.
You would want to use s3 buckets. They could host your images.
However, based upon your post, I really think you should start step-step, and not host your own images (i.e. not have a backend), and instead just start by using images already on the internet. Good luck :)
I want to upload the image in my website. The same image will be shown in another website. So this is the scenario where image is uploaded in one website and displayed in both website. These two websites are hosted in two different servers as well as they both have their own database.
I am using Angular JS, Entity Framework, Web API and SQL Server 2014 as backend for both of the website. Currently I am using ngFileUpload to upload the images. Please answer me on below questions:-
Should I upload the image in database(as nvarchar-max) or filesystem(FTP or local web server file system)? I read many articles and get to know that Database retrieval of image has affect on performance but it is more secured. However File System is easy in performance but complex on maintenance like back ups. So I am just not able to decide which to choose among these two as both have pros and cons. Which option will be more suitable to my requirement where same image will be displayed in both website. Please note that there can big images like upto 5 MB uploaded in the application but the number of images will not be huge as compare to any social networking or online shopping site.
How to create different size of images(thumbnail, medium, large etc) automatically upon uploading of image in website? Is there any tool or directive already available in Angular JS to achieve this?
I know my question is broad but I need suggestion to start with my requirements.
Please help.
I use the file system to host my images. If the image is displayed on someone's computer screen, they can use an image capturing software to copy it anyway. Also, while storing them to a database may be more secure, I don't need the extra overhead in my code where a simple url to retrieve the image will suffice.
As for resizing an image using Angular, check out these links:
https://www.scientiamobile.com/page/angular-image-resize
https://github.com/FBerthelot/angular-images-resizer
I am using basically the mean stack. I'm also using multer but I am trying to see what the best practices are. Using Angular I can upload photos fine and they are going to a folder on my file system. From here I can just view them. However I'm wondering what the best practices are. Should I save the image url to a database along with the size and other properties or should I just pull them from the client? I've seen some solutions but they were from about 2 years ago so I wanted to make sure I'm current.
I have used ng-file-upload upload on the angular part and Multer on the node.js part to handle images for my system.
The method is appropriate and you can go ahead without any doubt.
Most of the websites on the internet follow the same method, they save the images in the file disk system and then they save it's url in the respective database.
Using multer you can have all information required for a photo and the module is really flexible with a lot many options.
I think you should go ahead with what you have in mind. Best of luck.
You just save the image url from the directory, where image is stored. If you need any information, you can get the information from the image where image is stored (Get image from url). So just save image url into database.
I am creating a web app(run on linux, PHP). In this application, after users log in, they will able to generate a postcard with their name on it.
Since the page of postcard is html(generated by cakephp), I want to take a screenshot of the central part of that page and save as an image.
Please recommend me any tool/plugin in order to do so. Free service/plugin is prefered.
http://code.google.com/p/wkhtmltopdf/
I have used the pdf part and it works great, there is a wkhtmltoimage download there that should help you with what you asking.
WHat kind of different databases I can use to store images? And how to display these images onto web page?
You should avoid storing image in database.
You should store the image in your file system and its url in database
The answer to your question can be found at following links.
Storing image in db
http://mrarrowhead.com/index.php?page=store_images_mysql_php.php
Retrieving image
http://mrarrowhead.com/index.php?page=retreive_images_mysql_php.php
Contact if you have any doubt.