Saving dropzone.js files to local storage? - dropzone.js

Is it possible to store dropzone.js files in local storage? I read the docs and looked all around the web for examples but there were none, so it is even possible?

It is posible. The part that you have to understand is that dropzone.js gives you the user experience, how you handle the docs or images in your server side is something different. You can try using ajax.
For example if you are using C# you have to handle how and where is going to be saved those docs. You need to define a folder in your disk where those docs are going to be stored.

Related

create-react-app: where do I put dynamically uploaded images?

Hi I'm working with create-react-app, i've setup a file upload that allows images to be sent to the backend and saved locally (to the projects build directory). I'm able to dynamically reference images via localhost:4000/image.png so that already works (ie: i have a blog that lets me upload images that I later access via a blogList).
However i figured this probably isn't the best place to dynamically upload images to. I've read the docs on create-react-app and both the locations that mention images dont seem to work for my use case, i feel like im definitely doing something wrong but im not sure what.
docs im referring to:
Says use "import" however im loading dynamically so i cant see how this would work?
https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-images-fonts-and-files
says use public, however wouldnt that require a rebuild? since im loading dynamically that isnt possible: https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#when-to-use-the-public-folder
NOTE: i have a image uploader and backend working fine it works already using the /build directory. i can upload and dynamically reference images. I'm just looking for best practices for doing something like this. Thanks!
(if you mention "just use nginx" could you please elaborate on the implementation a little)
As a learner I struggled with this problem and tried different approaches once a while ago. For rarely used assets, using /public for client could be useful but I have an app where clients upload images and manage them. Like you, I did not like those approaches and ended up with this setup.
Create a /public directory on backend and upload images to /public/images
Serve /public directory with Express statically.
Use dynamic path variable (via a config setup) for image paths. http://localhost:backend_port/public/images for development and /public/images for production.
I don't know this is the best approach but it worked for me. Beside being best approach when I upload images before that setup CRA was refreshing (hot reloading) my app after each image upload.

How can I upload multiple files from urls directly to cloud storage

I've tried some of the services out there, including droplet, ctrlq.org/save, and some other sites that support directly fetching a file from a url and uploading it to dropbox, google drive and the like. Without the user having to store the file on a local disk.
Now the problem is none of these services support multiple urls or batch uploading, but I have quite a few urls and I really need a service where I can put them in, split them with enters or semicolons, and have the files uploaded to dropbox.(or any other cloud storage)
Any help would be gladly appreciated.
The Dropbox Saver JavaScript control allows you to save up to 100 files to the user's Dropbox in one shot. You'll need to programmatically create the button using Dropbox.createSaveButton as explained in the linked page.
It seems like the 100-file limit (at any one time) is universal, but you might find that it isn't the case when using the DropBox REST API. It looks possible to do this with NodeJS server side (OAuth and posts) or Javascript client side (automating FileReader). I'll review and try to add content so these aren't just links.
If you can leave a page open for about 20 minutes due to "technical limitations", the dropbox should be loadable 100-at-a-time like that, assuming each upload takes less than 2 seconds; it's an easy hook to add a progress indicator.
If you're preloading the dropbox once yourself or the initial load is compatible with manual action, perhaps mapping a drive and trying to unzip an archive of your links to it would work. If your list of links isn't extremely volatile then the REST API could be used to synchronize changes.
Edit: Forgot to include this page on CloudConvert, which unzips archives containing up to 100 files into DropBox. Your use case doesn't seem to include retrieving the actual content at your servers (generated zip files), sending the automation list to the browser and then having the browser extract to dropbox, but it's another option.
The Dropbox API now offers the ability to save a file into Dropbox directly via a URL. There's a blog post about it here:
https://blogs.dropbox.com/developers/2015/06/programmatically-saving-a-url-to-dropbox/
The documentation can be found here:
https://www.dropbox.com/developers/core/docs#save-url

image uploader for ruby/jruby

are there any libraries out there that will take a photo upload and push it to S3 without writing temp files to the disk? Photo upload is a main feature on our site, and we do not want diskIO to be a bottleneck.
I had my thoughts in the comments above but thinking outside the box you might have a chance of avoiding using local temp files altogether by using https://www.filepicker.io/ With them you add some javascript to your app and let them handle the io on their disks. According to their docs they push your files directly to your S3 bucket without ever going through your app's server. This might be what you're looking for but it comes with their price tag. Might be worth it if you don't want to worry about shuffling user files.
May be you are looking for these: carrierwave or dragonfly. There is an option in carrierwave see this for deleting temporary cache directories.

How to cache images and html files in PhoneGap

I need a way for cache images and html files in PhoneGap from my site. I'm planning that users will see site without internet connection like it will be with it. But I see information only about sql data storing, but how can I store images (and use later).
To cache images check out this library -of which I'm the creator-:
imgcache.js
. It's designed for the very purpose of caching images using the local filesystem. If you check out the examples you will see that it can also detect when an image fails to be loaded (because you're offline or you have a very bad connection) and then replaces it automatically with the cached image. The user of the webapp doesn't even notice it's offline.
As for html pages.. if they're html static files, they could be stored locally in the web app (file:// in phonegap).
If they're dynamically generated pages, check the localStorage API if you have a small amount of data, otherwise the filesystem API.
For my web app I retrieve only json data from my server (and process/render it using Backbone+Underscore). The json payload is stored into the localStorage. If the application gets offline, it will fetch json data from the localStorage instead of the server (home-baked fork of Backbone.dualStorage)
You then get the full offline experience: pages+images.
Caching like you might need for simple offline operation is not exactly that easy.
Your first option is the cache manifest. It has some limitations (like the size of the cache) but might work for you since it was designed to do what you want.
Another options is that you can store content on the disk of the device using the file system APIs. This has some drawbacks like security and the fact that you have to load the file from a path / url that is different than you might normally load it from on the web. Check out the hydra plugin for an example of this.
One final option might be to store stuff in localStorage (which has the benefit of being private on all platforms) and then pull it out of there when needed ... that means base64'ing all your images tho so that is a pretty big departure from just standard caching.
Caching is very much possible on Android OS. but on Apple as stated above there are limitations with the size of the images and cache size etc.
If you are willing to integrate and allow the caching on iOS you can use "cache manifest" to do so. but keep the draw backs and limitations in mind.
Also
if you want to save the file to Documents folder under my App, Apple will reject your App. The reason is the system backup all data under Documents folder to iCould after iOS6, so Apple does not allow big data like images or JSON file which could sync from your server again to keep in this folder.
So there is another work around which is good So one can use LocalFileSystem.TEMPORARY instead. It does not save the data to Library/Cache, but it save data to temp folder of App, which does not been auto backup to iCloud and not auto deleted either.
Regards
Rajeev

How do I bulkupload image BLOBs in Google App Engine?

I have a model which *I want* to contain an image blob. I have the images on my local filesystem, but due to the nature of my application, I need to get them in the datastore. Here's my model:
class JeanImage(db.Model):
type = db.StringProperty(required=True, choices=set(["main","front","back","detail"]))
image = db.BlobProperty(required=True)
I haven't tried anything yet because I'm not great when dealing with images.
How can/should I convert my images to blobs so that I can get them in my bulkupload csv file?
Mark
You can do it, just not with the bulk uploader. You need to access the remote api directly.
This site has a basic example of how to use it:
http://www.billkatz.com/2009/2/Remote-API-Hello-World
Its pretty slow and a good idea to have a retry mechanism.
A more detailed description can be found here:
http://code.google.com/appengine/articles/remote_api.html
I believe that what you are trying to achieve is not possible using the app engine bulkloader.
Instead try to create some kind of uploader yourself. For example you could upload the images as a zip file and then extract it an store it in the datastore. The code for that should be fairly straightforward if you can map your images to the datastore entity (e.g. by using a naming convention).

Resources