It's a first time I'm doing this so got some trivial (I think) problems with files upload.
I have a pair: Angular 7 app + NodeJS (express) backend. I successfully uploading files (images) through the Angular page, NodeJS save it with correct format, but I don't know what can I do to be able to target just uploaded images in my web-service and where should I store new files. Should it be : src/app/uploads or only src/app ? Can someone explain the idea behind.
Do I need to do any extra actions in Angular? Because it shows me 404 page if I try to target something out of scope of the app.
Thanks!
I think that src directory should store only source code (or something change when you update your version of code)
In my opinion, uploaded file shouldnt be stored in src directory.
Maybe
Root dir
- docs
- migrations
- node_modules
- src
- tmp
- uploaded
.......
Related
I'm building a nodejs + angular application. On the server-side I have a function that uploads a new image to my angular folder under assets/images/uploads, it also saves the path of where i have uploaded it to a database.
In my angular I want to be able to show that image right after I have uploaded it. I'm trying to do this by saying:
<img mat-card-image src="../../{{users.profilePicture}}" alt="Test">
my users.profilePicture contains the correct path to where my image is stored. This doesn't work because the path is not found. However, if i restart my angular application with "ng serve" the picture will be found and displayed as desired.
I've drawn the conclusion that this must be because the assets of my application are loaded once the application starts, and cannot detect that new ones have been added while the server is already running. Is there any way to bypass this, so that I can get my angular to reload my assets folder and detect that there has been added a new picture to the folder, while the application is already running?
Ng serve loads your app in memory, so newly added items won't include in your compiled app.
You can find some solutions in this SO post:
Serve assets as they are dynamically added
I am having trouble displaying an image which is in my angular folder app.
here is my folder structure:
I am accessing it from the contact.component folder; I have tried accessing directly like src="../images/DNS.jpg" and relatively to the index.html file src="./app/images/DNS.jpg" and it doesn't work.
How can I reference this?
Put all your images in assets folder and Try this :
<img src="assets/DNS.jpg" />
As, angular recommends to put all your resources in the assets folder including images/fonts etc and access from there.
I have created a small web application with NodeJS Express. Basically a webserver that has a 'webserver.properties' file. With a very basic app.yaml file.
After deploying it to Google Cloud by use of 'gcloud app deploy' I get the everything up and running.
However...when I open the following URL in the browser: https://webserverurl.com/webserver.properties , the webserver.properties file can be approached and is in turn downloaded immediately.
How can I prevent this from happening and make sure that such properties files are inaccessible from outside?
The problem is that when you use this line:
app.use('/', express.static(__dirname + '/'));
you are giving access to your root directory. See this for a definition of __dirname. If you want to give access to a specific folder you can do this:
Lets say your root directory is src and you fave a dir with static files called src/myfiles. In order to give acces to files in myfiles you can use this line:
app.use('/mypathname', express.static('myfiles'));
where:
'/mypathname' is the part pertaining your URL. In your case it would be https://webserverurl.com/mypathname/any-file-name.jpg
express.static('myfiles') is the name of your local dir.
See this guide.
Hope this helps
I'm uploading files from Angular 2 with ngx-uploader and storing them on backend (nodejs/feathers) with multer. Now I'm having trouble to reach and display them, for now im just trying to display image, but actually i just need to see how paths work so i can reach the .pdf files.
As a file path im getting this: resources\\uploads\\quality-docs\\FILENAME so i tried to reach them like this: http://localhost:3030/resources/uploads/quality-docs/FILENAME but it doesnt work, it gives me 404. Just realised when i put files in static, public folder, i can reach it like http://localhost:3030/FILENAME ... but is there a way for it to not be in public?
This is how my backend structure looks like:
Any ideas/sugestions are welcome, is this even a right way to go? Plus if any of you have idea how to delete files from server?
Assuming that you are using express in your node app, you need to include a static route to the resources/uploads directory (express static routes) like the following:
app.use(express.static('resources/uploads'))
For deleting files from a node application use unlink fs.unlink
I am working on meteor framework and trying to upload images in one of my app using the code from the link
https://gist.github.com/3922137
Everything works good , except that it uploads the empty file in my public folder of app .
I checked console and it shows 503 error there after I select a file to upload
Here is the console screenshot
http://img40.imageshack.us/img40/2956/consolewl.jpg
It keeps on looping and the number of errors keeps on adding in console
I am using meteor on windows .
Does anyone has managed to get file uploads work in meteor on windows platform ? and if yes can you please share the code which worked for you .
Thanks
Aman
The reason you are getting a 503 is that when anything in the public folder changes meteor reloads. Because your uploads are going there the server is resetting. Change your code not to save it to public but rather somewhere else and you should see the error go away.