it was my first time implementing data upload (jpeg files) on nodeserver.
let say i use this RESTapi to store uploaded data.
http://localhost:3000/uploads/
when i was serving my app in localhost (with ng serve command), it works fine. but i got confused while i try to build the project. i mean i store the files on nodejs directory but my angular only read files on it's dist folder.
i just realizing that both nodejs app and angular app has different directory.
my question is, is it right syntax to do this all? should i made http call to read the desired files or should i change upload path to go to my angular assets path?
Related
I have created sample angular application to test GitHubPages deployment..
Backend has a node js code which is connected to MongoDB Atlas.
Frontend has angular which is working fine when starting backend and frontend both.
When I build project, it has fully angular component only.. So I moved to backend into frontend folder and which is now
still when I build and I need to copy paste the database component and dist in one single folder.
If I do that npm install and node index.js it is working fine..
The same i am trying to do in GitHubPages using Actions. until dist folder is fine.. How to move database backend files in to ghPages to up the service. without db files i except html page but showing 404. How to copy db files from master to ghpages branch.
My repository is given https://github.com/changan1111/UserManagement
Any help would be really appreciated.
Github pages can only serve static files (HTML,CSS, js, images, etc.)
It might serve your bundled Angular application, but your API calls will need to be done to a hosted backend.
You can check Google Cloud, AWS, Heroku, Azure for hosting the backend.
Be sure to set CORS properly.
I want to use Amazon S3 to serve my static files (images, fonts,...) to client rather than storing them directly in the web host. I've created a bucket and uploaded my files. I've read other questions and tutorials on how to do this and I got confused since I haven't served files from external storage before.
How do I do this in a secure and standard way? I don't know if this should be done in frontend by directly including URLs to objects or having the server request the files using SDK or other options...
I'm using Node, Express and React.
It is very simple.
configure your bucket to be used to serve static content. You can find the steps here.
configure your build process to add your static files to the react bundle.
build your react app and upload the dist/build folder to the root of the bucket.
That will allow you to serve your static files and your Rect App from S3. Your URL will be a little bit ugly: it will be something like: http://bucket-name.s3-website-region.amazonaws.com.
If you want to have a special URL, like www,yourappname.com you'll need to perform a few more steps:
You'll need to create an SSL public certificate.
You'll need to configure a CloudFront Distribution.
Here you can find more info about these extra steps.
IMPORTANT: S3 does not support Express/Node. For that, you'll need a web server.
I have an API maded with express allowed in a EC2 container.
Also theres an app that use this API to get some post or users data.
When they upload images i use multer to save them in a folder in the project, and save the name of image in a MySQL databa, but i dont know how to send the image to front app, o how they can get the image from container.
This is my folders arch:
use express-static on images directory https://expressjs.com/en/starter/static-files.html on images directory or installing nginx or apache and serve images directory
i have an upload method that store my image in a folder in backend. I'm trying to display it in the frontend but it says to me that it can't accomplish my request becouse folder is out of src. How can i avoid this issue?
Is there any kind of method that allow me to access to the path of that folder?
I'm using react and node js.
You have to serve static files with express, here explains how to do that.
I hope that it works for you!
My goal is to upload a profile picture. I did this in development mode using multer in Node.js. Multer asks for a path where to save the new picture.
In development mode, my Angular frontend and my Node.js backend were in the same file (see below for the project structure). The destination path used in Multer worked for development mode.
I then deployed my backend and frontend separately and now this path doesn't work. How can I make sure that the uploaded profile pictures end up in the same map as it did in development?
This is the structure in development mode. SRC map contains the Angular frontend code and backend contains the Node.js backend.
This is the path I used to store uploaded profile pictures with Multer. The problem now is that I deployed my backend and frontend separately to Heroku and so this path doesn't work anymore.
How can I change my path so that my uploaded profile pictures still get added to this assets/images/profile-pictures map?
The filesystem that Heroku provides is ephemeral: any changes you make to it will be lost the next time your dyno restarts. This happens frequently (at least once per day).
Instead of storing uploaded files on the local filesystem, Heroku recommends storing them on a third-party service like Amazon S3. The multer-s3 library should let you do that fairly easily.
Once the files have been stored you can access them via Amazon's SDK or, if you've configured your uploads accordingly, via HTTP. Regular HTTP access can be authenticated or anonymous.