Axios gets the upload progress error: xhr.upload.addEventListener is not a function

Error problem

Vue:xhr.upload.addEventListener is not a function

This problem is caused by mockjs changing the XMLHttpRequest object in Axios

According to the Axios source code, l is an XMLHttpRequest object

Mockjs changed the l variable from XMLHttpRequest object to MockXMLHttpRequest object

Therefore, l.upload is an empty object, which has no addEventListener method, so an error is reported

Solution:

Method 1

In the project node_modules/mockjs/dist/mock.js file, in the place where mockjs determines the conditions (search) -> / If no matching data template is found, then the native XHR is used to send the request. / is usually the location of line 8308, add the code

MockXMLHttpRequest.prototype.upload = xhr.upload;

Add a native xhr.upload method to the MockXMLHttpRequest object.

Method 2

Add the code to the project node_modules/mockjs/src/xhr/xhr.jsprototype usually on line 216

MockXMLHttpRequest.prototype.upload = xhr.upload;

This method needs to be recompiled to take effect

Similar Posts: