上传到Azure Blob时,请求的资源上不存在"Access-Control-Allow-Origin"标头

mik*_*ebz 3 azure azure-storage-blobs cors

我一直在努力争取这一天约一天.我正在直接测试Azure Blob存储上传并获得可怕的CORS问题."XMLHttpRequest cannot load https://tempodevelop.blob.core.windows.net/tmp/a4d8e867-f13e-343f-c6d3-a603…Ym0PlrBn%2BU/UzUs7QUhQw%3D&sv=2014-02-14&se=2016-10-12T17%3A59%3A26.638531. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8000' is therefore not allowed access. The response had HTTP status code 403."

我已经尝试过的事情:

  1. 将CORS设置为所有主机: 在此输入图像描述
  2. 尝试在本地和heroku上托管我的应用程序
  3. 确保我可以使用其他工具上传文件(Azure存储资源管理器)
  4. 将我的AccessPolicy配置为'rwdl',我肯定会获得访问签名(在单元测试中验证).

整个代码可以在这里找到:https://github.com/mikebz/azureupload

但相关部分在这里,前端上传:

<script>

    /* 
     * not a true GUID, see here: http://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript
     */ 
    function guid() {
        function s4() {
            return Math.floor((1 + Math.random()) * 0x10000)
            .toString(16)
            .substring(1);
        }
        return s4() + s4() + '-' + s4() + '-' + s4() + '-' +
            s4() + '-' + s4() + s4() + s4();
    }

    function startUpload() {   
        var fileName = guid();

        jQuery.getJSON("/formfileupload/signature/" + fileName , function(data) {
                console.log("got a signature: " + data.bloburl);
                uploadFile(data.bloburl, data.signature);
            })
            .fail(function(jqxhr, textStatus, error) {
                console.log( "error: " + textStatus + " - " + error );
            })
    }
    
    function uploadFile(bloburl, signature) {        
        var xhr = new XMLHttpRequest();
        fileData = document.getElementById('fileToUpload').files[0];
        xhr.open("PUT", bloburl + "?" + signature);
        xhr.setRequestHeader('x-ms-blob-type', 'BlockBlob');
        xhr.setRequestHeader('x-ms-blob-content-type', fileData.type);
        result = xhr.send(fileData);
    }
</script>
Run Code Online (Sandbox Code Playgroud)

python中的签名生成代码在这里:

def generate_access_signature(self, filename):
    """
    calls the Azure Web service to generate a temporary access signature.
    """
    blob_service = BlobService(
        account_name=self.account_name, 
        account_key=self.account_key
    )

    expire_at = datetime.utcnow()
    expire_at = expire_at + timedelta(seconds = 30)
    access_policy = AccessPolicy(permission="rwdl", expiry=expire_at.isoformat())

    sas_token = blob_service.generate_shared_access_signature( 
        container_name="tmp",
        blob_name = filename, 
        shared_access_policy=SharedAccessPolicy(access_policy)
    )
    return sas_token
Run Code Online (Sandbox Code Playgroud)

Tom*_*SFT 5

根据错误消息[响应具有HTTP状态代码403],可能是服务未启用CORS,或者没有CORS规则与预检请求匹配.详细信息请参阅Azure存储服务跨源资源共享(CORS)支持.或者可能是SAS签名不正确.请尝试进行故障排除

  1. 尝试在Blob服务下检查Azure门户上的CORS设置.因为还有其他服务,如表,队列,文件. 预期

  2. 此外Azure的探索 工具,你可以用它来生成SAS令牌 在此输入图像描述

获取SAS并尝试使用生成的SAS对其进行调试 演示代码 在此输入图像描述