upload file and metadata to azure blob storage from cordova client

I have used this example to create a working file upload from my cordova client directly into azure blob storage:
http://gauravmantri.com/2013/02/16/uploading-large-files-in-windows-azure-blob-storage-using-shared-access-signature-html-and-javascript/

So far so good, but I have custom metadata that I need to add to each file. Can I add the metadata to the file before upload such that the metadata is automatically attached to the file as it is loaded into azure blob storage? I know I could write a c# function in azure to add metadata and call the function from my client after successfully loading the file into blob storage but is there a better way? I worry that the the upload may work, but the subsequent metadata write may fail, leaving my file without its metadata.

Martin

asked Nov 21 '18 at 9:01

Martin Cooper

add a comment |

Martin

asked Nov 21 '18 at 9:01

Martin Cooper

add a comment |

Martin

asked Nov 21 '18 at 9:01

Martin Cooper

Martin

azure cordova file-upload metadata azure-storage-blobs

asked Nov 21 '18 at 9:01

Martin Cooper

asked Nov 21 '18 at 9:01

Martin Cooper

asked Nov 21 '18 at 9:01

Martin Cooper

asked Nov 21 '18 at 9:01

Martin Cooper

asked Nov 21 '18 at 9:01

Martin Cooper

add a comment |

1 Answer
1

active

oldest

votes

It's actually pretty straight forward. When you commit block list, you pass the metadata key/value pair as part of request headers.

For example, let's say you have 2 metadata key/value pairs: key1/value1 and key2/value2. This is what your commit block list code would look like:

function commitBlockList() {

  var uri = submitUri + '&comp=blocklist';

  console.log(uri);

  var requestBody = '<?xml version="1.0" encoding="utf-8"?><BlockList>';

  for (var i = 0; i < blockIds.length; i++) {

      requestBody += '<Latest>' + blockIds[i] + '</Latest>';

  }

  requestBody += '</BlockList>';

  console.log(requestBody);

  $.ajax({

      url: uri,

      type: "PUT",

      data: requestBody,

      beforeSend: function (xhr) {

          xhr.setRequestHeader('x-ms-blob-content-type', selectedFile.type);

          xhr.setRequestHeader('Content-Length', requestBody.length);

          xhr.setRequestHeader('x-ms-meta-key1', 'value1');

          xhr.setRequestHeader('x-ms-meta-key2', 'value2');

      },

      success: function (data, status) {

          console.log(data);

          console.log(status);

      },

      error: function (xhr, desc, err) {

          console.log(desc);

          console.log(err);

      }

  });

}

For reference, please see Put Block List REST API documentation: https://docs.microsoft.com/en-us/rest/api/storageservices/Put-Block-List

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

Thanks. Works a treat. It did take me a while to realise that the key must be prefixed with x-ms-meta- so xhr.setRequestHeader('x-ms-meta-key1', 'value1'); works, xhr.setRequestHeader('mykey1', 'value1'); doesn't. Over in azure the metadata name will be key1

– Martin Cooper
Nov 21 '18 at 15:26

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53408455%2fupload-file-and-metadata-to-azure-blob-storage-from-cordova-client%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

It's actually pretty straight forward. When you commit block list, you pass the metadata key/value pair as part of request headers.

For example, let's say you have 2 metadata key/value pairs: key1/value1 and key2/value2. This is what your commit block list code would look like:

function commitBlockList() {

  var uri = submitUri + '&comp=blocklist';

  console.log(uri);

  var requestBody = '<?xml version="1.0" encoding="utf-8"?><BlockList>';

  for (var i = 0; i < blockIds.length; i++) {

      requestBody += '<Latest>' + blockIds[i] + '</Latest>';

  }

  requestBody += '</BlockList>';

  console.log(requestBody);

  $.ajax({

      url: uri,

      type: "PUT",

      data: requestBody,

      beforeSend: function (xhr) {

          xhr.setRequestHeader('x-ms-blob-content-type', selectedFile.type);

          xhr.setRequestHeader('Content-Length', requestBody.length);

          xhr.setRequestHeader('x-ms-meta-key1', 'value1');

          xhr.setRequestHeader('x-ms-meta-key2', 'value2');

      },

      success: function (data, status) {

          console.log(data);

          console.log(status);

      },

      error: function (xhr, desc, err) {

          console.log(desc);

          console.log(err);

      }

  });

}

For reference, please see Put Block List REST API documentation: https://docs.microsoft.com/en-us/rest/api/storageservices/Put-Block-List

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

Thanks. Works a treat. It did take me a while to realise that the key must be prefixed with x-ms-meta- so xhr.setRequestHeader('x-ms-meta-key1', 'value1'); works, xhr.setRequestHeader('mykey1', 'value1'); doesn't. Over in azure the metadata name will be key1

– Martin Cooper
Nov 21 '18 at 15:26

add a comment |

It's actually pretty straight forward. When you commit block list, you pass the metadata key/value pair as part of request headers.

For example, let's say you have 2 metadata key/value pairs: key1/value1 and key2/value2. This is what your commit block list code would look like:

function commitBlockList() {

  var uri = submitUri + '&comp=blocklist';

  console.log(uri);

  var requestBody = '<?xml version="1.0" encoding="utf-8"?><BlockList>';

  for (var i = 0; i < blockIds.length; i++) {

      requestBody += '<Latest>' + blockIds[i] + '</Latest>';

  }

  requestBody += '</BlockList>';

  console.log(requestBody);

  $.ajax({

      url: uri,

      type: "PUT",

      data: requestBody,

      beforeSend: function (xhr) {

          xhr.setRequestHeader('x-ms-blob-content-type', selectedFile.type);

          xhr.setRequestHeader('Content-Length', requestBody.length);

          xhr.setRequestHeader('x-ms-meta-key1', 'value1');

          xhr.setRequestHeader('x-ms-meta-key2', 'value2');

      },

      success: function (data, status) {

          console.log(data);

          console.log(status);

      },

      error: function (xhr, desc, err) {

          console.log(desc);

          console.log(err);

      }

  });

}

For reference, please see Put Block List REST API documentation: https://docs.microsoft.com/en-us/rest/api/storageservices/Put-Block-List

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

Thanks. Works a treat. It did take me a while to realise that the key must be prefixed with x-ms-meta- so xhr.setRequestHeader('x-ms-meta-key1', 'value1'); works, xhr.setRequestHeader('mykey1', 'value1'); doesn't. Over in azure the metadata name will be key1

– Martin Cooper
Nov 21 '18 at 15:26

add a comment |

It's actually pretty straight forward. When you commit block list, you pass the metadata key/value pair as part of request headers.

For example, let's say you have 2 metadata key/value pairs: key1/value1 and key2/value2. This is what your commit block list code would look like:

function commitBlockList() {

  var uri = submitUri + '&comp=blocklist';

  console.log(uri);

  var requestBody = '<?xml version="1.0" encoding="utf-8"?><BlockList>';

  for (var i = 0; i < blockIds.length; i++) {

      requestBody += '<Latest>' + blockIds[i] + '</Latest>';

  }

  requestBody += '</BlockList>';

  console.log(requestBody);

  $.ajax({

      url: uri,

      type: "PUT",

      data: requestBody,

      beforeSend: function (xhr) {

          xhr.setRequestHeader('x-ms-blob-content-type', selectedFile.type);

          xhr.setRequestHeader('Content-Length', requestBody.length);

          xhr.setRequestHeader('x-ms-meta-key1', 'value1');

          xhr.setRequestHeader('x-ms-meta-key2', 'value2');

      },

      success: function (data, status) {

          console.log(data);

          console.log(status);

      },

      error: function (xhr, desc, err) {

          console.log(desc);

          console.log(err);

      }

  });

}

For reference, please see Put Block List REST API documentation: https://docs.microsoft.com/en-us/rest/api/storageservices/Put-Block-List

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

It's actually pretty straight forward. When you commit block list, you pass the metadata key/value pair as part of request headers.

For example, let's say you have 2 metadata key/value pairs: key1/value1 and key2/value2. This is what your commit block list code would look like:

function commitBlockList() {

  var uri = submitUri + '&comp=blocklist';

  console.log(uri);

  var requestBody = '<?xml version="1.0" encoding="utf-8"?><BlockList>';

  for (var i = 0; i < blockIds.length; i++) {

      requestBody += '<Latest>' + blockIds[i] + '</Latest>';

  }

  requestBody += '</BlockList>';

  console.log(requestBody);

  $.ajax({

      url: uri,

      type: "PUT",

      data: requestBody,

      beforeSend: function (xhr) {

          xhr.setRequestHeader('x-ms-blob-content-type', selectedFile.type);

          xhr.setRequestHeader('Content-Length', requestBody.length);

          xhr.setRequestHeader('x-ms-meta-key1', 'value1');

          xhr.setRequestHeader('x-ms-meta-key2', 'value2');

      },

      success: function (data, status) {

          console.log(data);

          console.log(status);

      },

      error: function (xhr, desc, err) {

          console.log(desc);

          console.log(err);

      }

  });

}

For reference, please see Put Block List REST API documentation: https://docs.microsoft.com/en-us/rest/api/storageservices/Put-Block-List

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

answered Nov 21 '18 at 10:36

Gaurav Mantri

72.6k8109134

Thanks. Works a treat. It did take me a while to realise that the key must be prefixed with x-ms-meta- so xhr.setRequestHeader('x-ms-meta-key1', 'value1'); works, xhr.setRequestHeader('mykey1', 'value1'); doesn't. Over in azure the metadata name will be key1

– Martin Cooper
Nov 21 '18 at 15:26

add a comment |

Thanks. Works a treat. It did take me a while to realise that the key must be prefixed with x-ms-meta- so xhr.setRequestHeader('x-ms-meta-key1', 'value1'); works, xhr.setRequestHeader('mykey1', 'value1'); doesn't. Over in azure the metadata name will be key1

– Martin Cooper
Nov 21 '18 at 15:26

Thanks. Works a treat. It did take me a while to realise that the key must be prefixed with x-ms-meta- so xhr.setRequestHeader('x-ms-meta-key1', 'value1'); works, xhr.setRequestHeader('mykey1', 'value1'); doesn't. Over in azure the metadata name will be key1

– Martin Cooper
Nov 21 '18 at 15:26

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

Search This Blog

Ufyukyu