<story><title>Amazon S3 - Cross Origin Resource Sharing Support</title><url>http://aws.typepad.com/aws/2012/08/amazon-s3-cross-origin-resource-sharing.html</url><text></text></story><parent_chain><item><author>theli0nheart</author><text>Hah, about time.&lt;p&gt;About 6 months ago I rewrote the Let&apos;s Crate (&lt;a href=&quot;https://letscrate.com&quot; rel=&quot;nofollow&quot;&gt;https://letscrate.com&lt;/a&gt;) backend to work exclusively with Amazon S3 Direct POST uploads. Getting upload progress to work with that was a royal PITA, but in the end I got it working. If you&apos;re interested in how, perhaps that&apos;s a good subject for a far more lengthy post on how to write extremely convoluted Javascript. I gave myself a pat on the back (no flash, yay!) and vowed to never do anything like that again.&lt;p&gt;As requested: Basically, the gist is that you accept the upload via a local JS file that acts as a conduit. You then turn the dropped / selected file object into a blob object and transfer that blob JS file that lives on S3 (using postMessage and a hidden iframe). That JS file on S3 is what actually performs the upload and tracks the upload progress. On progress events, I send back postMessage payloads to the local JS file to show updates to the user.&lt;p&gt;Convoluted, but it works. :)</text></item></parent_chain><comment><author>dylanpyle</author><text>I found this solution for a very similar problem, which is roughly the same approach:&lt;p&gt;&lt;a href=&quot;http://dira.ro/2011/10/17/heroku-s3-canvas-and-the-security-error-of-doom&quot; rel=&quot;nofollow&quot;&gt;http://dira.ro/2011/10/17/heroku-s3-canvas-and-the-security-...&lt;/a&gt;&lt;p&gt;Implementation here:
&lt;a href=&quot;https://github.com/dira/cross-domain-image-proxy&quot; rel=&quot;nofollow&quot;&gt;https://github.com/dira/cross-domain-image-proxy&lt;/a&gt;&lt;p&gt;And a jQuery plugin here:
&lt;a href=&quot;https://github.com/rlmattax/jquery-s3-image-proxy&quot; rel=&quot;nofollow&quot;&gt;https://github.com/rlmattax/jquery-s3-image-proxy&lt;/a&gt;&lt;p&gt;After weighing the pros and cons of proxying versus this, I settled on the postMessage strategy -- but still no fun at all, and I&apos;m so glad that CORS is finally an option.</text></comment>
<story><title>Amazon S3 - Cross Origin Resource Sharing Support</title><url>http://aws.typepad.com/aws/2012/08/amazon-s3-cross-origin-resource-sharing.html</url><text></text></story><parent_chain><item><author>theli0nheart</author><text>Hah, about time.&lt;p&gt;About 6 months ago I rewrote the Let&apos;s Crate (&lt;a href=&quot;https://letscrate.com&quot; rel=&quot;nofollow&quot;&gt;https://letscrate.com&lt;/a&gt;) backend to work exclusively with Amazon S3 Direct POST uploads. Getting upload progress to work with that was a royal PITA, but in the end I got it working. If you&apos;re interested in how, perhaps that&apos;s a good subject for a far more lengthy post on how to write extremely convoluted Javascript. I gave myself a pat on the back (no flash, yay!) and vowed to never do anything like that again.&lt;p&gt;As requested: Basically, the gist is that you accept the upload via a local JS file that acts as a conduit. You then turn the dropped / selected file object into a blob object and transfer that blob JS file that lives on S3 (using postMessage and a hidden iframe). That JS file on S3 is what actually performs the upload and tracks the upload progress. On progress events, I send back postMessage payloads to the local JS file to show updates to the user.&lt;p&gt;Convoluted, but it works. :)</text></item></parent_chain><comment><author>tectonic</author><text>I&apos;d really like to hear about how you did this.  Any chance of open sourcing it?</text></comment>