diff --git a/README.md b/README.md index 042aff26..af5c4b53 100644 --- a/README.md +++ b/README.md @@ -257,7 +257,13 @@ These are the available config options for making requests. Only the `url` is re xsrfCookieName: 'XSRF-TOKEN', // default // `xsrfHeaderName` is the name of the http header that carries the xsrf token value - xsrfHeaderName: 'X-XSRF-TOKEN' // default + xsrfHeaderName: 'X-XSRF-TOKEN', // default + + // `progress` allows handling of progress events for 'POST' and 'PUT uploads' + // as well as 'GET' downloads + progress: function(progressEvent) { + // Do whatever you want with the native progress event + } } ``` diff --git a/examples/upload/index.html b/examples/upload/index.html index 5841a1c6..57125d5a 100644 --- a/examples/upload/index.html +++ b/examples/upload/index.html @@ -26,7 +26,13 @@ data.append('foo', 'bar'); data.append('file', document.getElementById('file').files[0]); - axios.put('/upload/server', data) + var config = { + progress: function(progressEvent) { + var percentCompleted = progressEvent.loaded / progressEvent.total; + } + }; + + axios.put('/upload/server', data, config) .then(function (res) { output.className = 'container'; output.innerHTML = res.data; @@ -40,4 +46,3 @@ - diff --git a/lib/adapters/xhr.js b/lib/adapters/xhr.js index 8cba0ed1..4c88e5e6 100644 --- a/lib/adapters/xhr.js +++ b/lib/adapters/xhr.js @@ -151,6 +151,15 @@ module.exports = function xhrAdapter(resolve, reject, config) { requestData = new DataView(requestData); } + // Handle progress if needed + if (config.progress) { + if (config.method === 'post' || config.method === 'put') { + request.upload.addEventListener('progress', config.progress); + } else if (config.method === 'get') { + request.addEventListener('progress', config.progress); + } + } + // Clean up request requestData = (requestData === undefined) ? null