Using jquery dropzone plugin, I am trying to alert an error message when users attempt to upload more than one file and then stop/reset the dropzone.
I found this helpful post which got me where I am:
How to limit the number of dropzone.js files uploaded?
Fortunately, I was able to get an alert message to appear when maxfilesexceeded is reached, however I am unable to stop the upload of the single file. It seems dropzone will still attempt to upload one of the files if multiple files are sent.
What would be the best way to force an error so none of the files are uploaded and the dropzone element can reset? Thanks!
I haven't tested it, but you could set autoProcessQueue: false on the initial configuration, and then upload when you are certain there's only one file with .processQueue().
Related
I've got a MERN application that stores images to MongoDB. however, when trying to read the database and display the image back in the client application I keep getting the broken image icon.
I'm using Multer to successfully upload and store the images in the "/images" folder on the API side. I'm able to SEE the files being uploaded into that folder. I'm also using Path to declare the /images folder as a static folder.
on the client side I'm able to query the posts, get back the appropriate filename in the post.photo attribute and build up the source file location using a hard-coded PF constant (public folder). I'm logging out to the console that URL and when I copy and paste that built URL directly into a browser with the server running I'm able to see the picture successfully.
however, when using the URL for the image "src" I'm getting a broken image icon as shown.
I'll try to include a VERY watered down version of the code showing only relevant parts. any help would be greatly appreciated.
[Server Side][1]
[1]: https://i.stack.imgur.com/HkDbs.jpg
[Client Side][2]
[2]: https://i.stack.imgur.com/fJnXg.jpg
[Console App][3]
[3]: https://i.stack.imgur.com/KSunR.png
After weeks of wrestling with this I was finally able to get images to show in my client app! hopefully this helps someone else who might be having the same issue.
removed Helmet from the server side index.js file (it was part of a video instruction that I was following)
added a space-separated WHITELIST environment variable in the server-side .env file (ex: WHITELIST=http:http://localhost:3000)
then added the following code to my index.js code
code sample
Finally, somewhere along in the process I started getting "net::ERR_UNSAFE_PORT" errors showing up in my console. I wound up having to explicitly note my server ports like this "--explicitly-allowed-ports=5000,6000" in my browsers shortcut property by following the instructions noted here
https://superuser.com/questions/188006/how-to-fix-err-unsafe-port-error-on-chrome-when-browsing-to-unsafe-ports
that seemed to fix the issue for me!
Iam using filepond pond for uploading files to backend , uploading is working perfectly , but i want to block that current tab in the page until completion of uploads. for that i want to know that which event is handling for uploaded files. is there any event for checking is all files uploaded or not?
You can use the onprocessfiles callback which is called when all files in the list have been processed.
More info: https://pqina.nl/filepond/docs/patterns/api/filepond-instance/#callbacks
Would it be possible using this library? I've used this one for uploading a single file or a batch of files but it only creates a single http request, just like the samples in its github page. What I'm looking for is have an upload queue for the user's upload files so that he/she can still select another file for upload while previous file is still in uploading.
You can just have an array (queue) in your javascript code that holds all the files and once a new file is selected start uploading it and push it to the array.
Alternatively you could achieve this by adding ngf-keep="true" directive which will keep adding the new files to the model while holding the previous ones.
with ng-file-upload you can do multiple file select dialog for async file uploads. It then gives the upload progress of all files during the concurrent file uploads.
e.g. file 1 - 50%
file 2 - 75%
I can vouch for this because Ive done it.
See usages ...
https://github.com/danialfarid/ng-file-upload#usage
can't see any reason why u could not allow the user to select another file whilst the files were uploading.
Just click the upload button again!
Hi i'm trying to upload some mp3s as blobs using the Complete Sample App code provided in the App Engine tutorial here and i'm getting the following error `HTTP ERROR 404
Problem accessing /_ah/upload/ag5jb2xsZWN0aXZlZ3dhcHIbCxIVX19CbG9iVXBsb2FkU2Vzc2lvbl9fGHQM. Reason:
No upload session: ag5jb2xsZWN0aXZlZ3dhcHIbCxIVX19CbG9iVXBsb2FkU2Vzc2lvbl9fGHQM`
Anyone have any ideas why i'm getting this? Tried running locally and even tried deploying the App and still having issues!
Do not press the back botton and try to upload file.Use to hit the url in browser every time.
For each upload of file to the blob, the blob url is unique. For the first time, when you upload a file, you might be creating one blob url, using
blobstoreService.createUploadUrl("/yourServerURL");
Now, when you try to upload next file, you are clicking back button and you are trying to use the same blob session which you have created for the first file. That is the reason, you are facing the "No upload Session" error.
The solution could be, you can create a new blob url when you click the back button. Do some work around to create a new blob url upon clicking the back button.
Hope this helps.
Thanks.
Seems to be a bug with SDK 1.4.3
This seems to work just fine with SDK 1.4.2
Does this resolve your problem?
I was working on a very simple and fast image uploader for CKEditor. It works all like a charm, the only problem now is the actual upload. I thought it would all be easy, but now I am stuck.
I have the CK file-field and figured I could just run an ajax request to my php uploading script, the problem is now: how do i get the file data to upload it. The Ajax does not have the post values, so I am lost.
Please lead me into the right direction.
Thanks very much.
When you use Ajax to post the form, your file upload function should be able to get the values from the form as usual.
For example, see this article: http://www.finalwebsites.com/forums/topic/php-ajax-upload-example
Well, i now used an iFrame with the form in it. Using uplodify in the iframe it put the path to the file in a hidden input which I can extract from the frame and use as the src form my image in CKEditor.