Search code examples
jqueryazurecorsazure-blob-storagefine-uploader

Azure CORS Configuration


I am using the azure.jquery.fineuplaoder-4.4.0 source and am getting these errors when I try to upload:

OPTIONS http://gfbc.blob.core.windows.net/beta 403 (CORS not enabled or no matching rule found for this request.) 

XMLHttpRequest cannot load http://gfbc.blob.core.windows.net/beta. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://dev.gfbclife.org' is therefore not allowed access. 

I am using the default html template that is provided and calling FineUploader like this:

<script>
    $(document).ready(function () {
        $("#fine-uploader").fineUploader({
            request: {
                endpoint: 'http://gfbc.blob.core.windows.net/beta'
            },
            signature: {
                endpoint: '/Signature'
            },
            retry: {
                enableAuto: true
            },
            deleteFile: {
                enabled: true
            }
        });
    });
</script>

I have defined my CORS rule as:

Allowed Origin: http://dev.gfbclife.org
Allowed Methods: Get, head, Post, Put, Delete, trace, Options
Allowed Headers: *
Exposed Headers: *
Max Age: 432000

UPDATE: I have corrected the CORS rule and no longer get the previous errors. I am now getting these errors:

POST http://gfbc.blob.core.windows.net/beta 405 (The resource doesn't support specified Http Verb.) 
[Fine Uploader 4.4.0] Error when attempting to parse xhr response text (Unexpected token <) 

The response from the POST is:

<?xml version="1.0" encoding="utf-8"?><Error><Code>UnsupportedHttpVerb</Code>
<Message>The resource doesn't support specified Http Verb.
RequestId:f24c6afb-6e42-42da-aafb-3151422562cc
Time:2014-05-21T02:26:50.2758734Z</Message></Error>

Solution

  • As the error message indicates, your CORS rules are incorrect. Your allowed origins must include the domain of the URL you provided for the request.endpoint option.