Can't upload fie to Quickblox using REST API + AJAX. SignatureDoesNotMatch error

Question

I'm trying to upload file with instruction given in http://quickblox.com/developers/Content

First i'm creating file, and it always successful, then using params in response of creating file, i'm trying to upload file. And it fails with SignatureDoesNotMatch error. In source code below, i tried to show the whole algorithm. Could you please tell me what am i doing wrong?

// Got file
var file = $('#fileUploader')[0].files[0];
// crearing file in DB
$.ajax({
    url: 'http://api.quickblox.com/blobs.json',
    type: 'POST',
    dataType: 'json',
    contentType: 'application/json',
    headers: {
        'QB-Token': getCookie('QB-Token')
    },
    data: JSON.stringify({
        blob: {
            content_type: file.type,
            name: file.name
        }
    })
}).then(function (result) {
    // file always successfully created
    imgUrl2Upload = result.blob.blob_object_access.params;

    // create a FormData instance
    var fd = new FormData();
    // parsing all params from result.blob.blob_object_access.params
    var spltHost = imgUrl2Upload.split('?');
    // host before "?"
    var host = spltHost[0];
    var spltParams = spltHost[1].split('&');
    // each param devided by "&"
    for (var i = 0; i < spltParams.length; i++) {
        var kvpSplt = spltParams[i].split('=');
        var key = kvpSplt[0];
        var val = kvpSplt[1];
        // appending it
        fd.append(key, val);
    }
    // appending file
    fd.append('file', file);

    var xhr = new XMLHttpRequest();
    xhr.upload.addEventListener("progress", function(){
        console.log('progress');
    }, false);
    xhr.addEventListener("load", function(evt){
        console.log('completed',+ evt.target.responseText);
    }, false);
    xhr.addEventListener("error", function(){
        console.log('failed');
    }, false);
    xhr.addEventListener("abort", function(){
        console.log('aborted');
    }, false);
    console.log(host);
    // posting request
    xhr.open('POST', host, false);

    xhr.send(fd);
ion (err) {
    console.error('error uploading file', err);
});

Using code above i'm getting error: POST http://qbprod.s3.amazonaws.com/ 403 (Forbidden) with

<?xml version="1.0" encoding="UTF-8"?>
<Error>
<Code>SignatureDoesNotMatch</Code>
<Message>The request signature we calculated does not match the signature you provided. Check your key and signing method.</Message>
<AWSAccessKeyId>AKIAIY7KFM23XGXJ7R7A</AWSAccessKeyId>
<StringToSign>eyJleHBpcmF0aW9uIjoiMjAxNS0wNS0yNlQxNToxMzo0OVoiLCJjb25kaXRpb25zIjpbeyJidWNrZXQiOiJxYnByb2QifSx7ImtleSI6IjAwMzg2YmNhNzFlZjQ3MjE4NDg1YTA5Y2RlMGZmYjUzMDAifSx7ImFjbCI6ImF1dGhlb</StringToSign>
<SignatureProvided>LmeGj%2BRRdWS0LXBF5ZB0V%2B7iIQs%3D</SignatureProvided>
<StringToSignBytes> 6a 41 78 49 6e 31 64 66 51 25 33 44 25 33 44</StringToSignBytes>
<RequestId>D8A12CA856F3FD17</RequestId>
<HostId>i1Po/EpITRbloN+</HostId>
</Error>

in responce

Answer 1

You shall decode values after parsing params; fd.append(key, decodeURIComponent(val));