I am facing a problem using Dropzone with an image: Dropzone is sending a file to my server that is different from the original file.
I am using the library from the CDN https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.7.0/dropzone.min.js.
The file I send is https://picciao.com/img/photo-1.jpg
The file I receive on my server is https://picciao.com/img/products/k1fDK7MRp40c3TVwPOu4FZOO.jpg
As you can see, the image hasn't the same orientation.
I do not understand where Dropzone is modifying my file.
As the problem seems related to image orientation / EXIF data, I tried to include the exif.js library but that did not solve the issue.
Do you have an idea please?
Make sure you're not using the resizeWidth or resizeHeight options. I'm using 5.7.1 and there seems to be a bug with it not correctly resizing portrait images. The orientation get messed up.
https://www.dropzonejs.com/#config-resizeWidth
Either use resizeWidth or resizeHeight NOT both options and image will resize with proper aspect ratio.
Related
Im just beginning to learn about A-Frame and Im attempting to load a local image taken with my ricoh theta into an a-frame scene. I ran into the CORS issue and attempted to use the A-Frame asset loader which adds the cors header but was told it "can't upload" the image.
Do I need to prepare the image in some way in order to have the asset loader accept the image? How do I overcome the CORS issue?
Forgive my ignorance. Im sure the answer to this question will help alot of people interested in A-frame.
The A-Frame Asset Uploader is broken because we have expired keys for UploadCare. You can host the image in other places such as GitHub Pages, or image hosting services such as imgur
This is my first time to post a question here. I was building a meteor app with image uploading functions. I found a cloudinary package for meteor https://github.com/Lepozepo/cloudinary and it works pretty well. The only and the biggest problem I have is the resizing of image. By default this package will upload the original image taken from phone, which is often 3 or 4 MB and whose size is around 2000x4000, but I only want image to a few KBs. And because of this problem, it takes so much storage and bandwidth for the app. What should I do to fix this problem ? Thank you very much.
I am not sure if anybody needs this but i was struggling with this for the past 2 days and could not find a solution. Finally i went to cloudinary dashboard and it was the simplest thing ever. Login to your cloudinary. Go to settings -> upload -> Upload presets: edit(on your project) -> upload manipulations -> Incoming Transformation: edit -> change the imcoming image as you like :D.
I uploaded an image 2mb in size and it came down to 30kb after applying incoming transformation.
Hope this helps someone :)
If you're performing client-side uploads (via Cloudinary's jQuery integration library), you can perform a client-side resize before the upload:
https://github.com/cloudinary/cloudinary_js#client-side-image-resizing-before-upload
If you're performing server-side uploads, you can apply an incoming transformation to transform (resize) the image before storing it in your Cloudinary account.
Incoming transformations can be set in upload presets too:
http://cloudinary.com/blog/centralized_control_for_image_upload_image_size_format_thumbnail_generation_tagging_and_more
I am setting up a site in Drupal 7 for a photographer which includes uploading a large number of photos to the server. My problem is that image upload is extremely unstable. Sometimes it works, sometimes it does not. It seems I am hitting some kind of memory or bandwidth limit, but I don't get any errors.
I created a custom content type for photo albums, with each category (e.g. "portrait", "wedding" etc.) as a node with a number of attached images that I display using views slideshow. Everything works on the front end.
Image upload is handled by an image field and the Media file selector widget. The problem is that sometimes during upload the page will just refresh and the image does not show up in the list of attached images.
I also tried using the Plupload widget that allows uploading several images at once. With this I get a slightly different behavior. The images will "break" after two or three images meaning that they show up as corrupted images with part of the image missing. Sometimes refreshing the page or clearing all Drupal caches will allow me to upload maybe four images at once.
It looks like this
What is strange is that the same exact image file will sometimes upload, and sometimes not.
I am not uploading huge images. They are all manually resized to less than 1600x1600px before uploading, with file sizes between 200 and 600 KB.
Drupal 7.14
Plupload library 1.5.4
Plupload integration module 7.x-1.0
Plupload widget 7.x-1.0-alpha1
PHP settings:
PHP version 5.3.10
Max upload size: 5M
Memory limit: 1024M (increased from 128M using ini_set() in settings.php)
Any help will be greatly appreciated! I have been googling for days trying to solve this.
I have set my own OSM server for providing map tiles to use in an application. For the application I use OpenLayers and came to an strange issue when ported the code from slippymap to my application. Basically I use the same code, and for local tiles I set up the url of my tile server.
The issue is that when switching to the Local layer I only see the pink layer of the map, but the src attribute of the image tag loads the actual tile. I tried with Firebug to remove the pink layer, but behind it there is no image there! Coping the url from src attribute of the img tag opens the tile as an image.
Tried this to Chrome and the Local layer is working, in IE 7,8,9 too. The problem is only with FF and I suspect something with OpenLayers, but not sure what. The Mapnik layer is working and showing tiles on all browsers. Using HTML5 by the way.
Any ideas or hints are appreciated.
There's another solution that doesn't require adding CORS headers server-side. You need to provide a "tileOptions" option to the layer config, like so:
var layer = new OpenLayers.Layer.OSM("layer name", [urls], {
"tileOptions": {
"crossOriginKeyword": null
}
});
The OpenLayers docs for Layer.OSM and Tile.Image tell you how to do this, but there's no mention of the fact that the default can cause issues in Firefox.
Hm, I almost guess it right. It was an Apache header setting that enables cross domain request for the resources provided. Here is more info for the curious https://developer.mozilla.org/en/http_access_control
This is the header setting, Include it in <Directory>, <Location> or .htaccess file and check that you have mod_headers enabled.
Header set Access-Control-Allow-Origin *
so I have a SWF file. It can generate Jpeg images. I want to get that images by url (for ex www.my.com/file.swf#image.jpeg) I want to get just clean image (no flash no sign of flash). So as if i was just calling my apache server to give me that image.
So how to do such sing with AS?
Using some PHP package like ImageMagick or GD Library should do the job.
If for some strange reason you need flash, you could use swfaddress to do
www.my.com/file.swf#image.jpeg and listen for the swf address event and generate the image.