Comments (13)
@sahibalejandro I've tried this.The beforeSend's arguments is a request object,But it's property xhr is null
from vue-resource.
Yes, it's possible to add a abort() function to the promise object, which the HTTP request function returns. This will allow a syntax similar to jQuery.
from vue-resource.
@steffans that's great news!
Always prefer the pragmatic approach over some dream of ideal architectural purity π
from vue-resource.
The way it currently works will have to be refactored a bit.
We now don't have access to the xhr
outside the resolver function. If we are to augment the promise with an abort
function, we'll need access to the underlying xhr
object.
Probably something like this:
var request;
var promise = new Promise((resolve, reject) => {
request = xhr(url, options, resolve, reject);
});
promise.abort = request.abort.bind(request);
from vue-resource.
Any examples about how to use this feature? I'm trying to use it but get abort is not a function
error.
from vue-resource.
You could use the beforeSend
callback to access the request object and a add your code to abort the current request.
this.$http.post('url', function (data) {}, {beforeSend: function(xhr) {
// use XMLHttpRequest and add xhr.abort callback
}});
from vue-resource.
Nice, it works! I ended with something like this:
beforeSend(xhr) {
if (globalXhr) {
globalXhr.abort();
}
globalXhr = xhr;
}
from vue-resource.
@WilliamDu1981
I've just had the same issue and looked at the request object, it has a cancel function which aborts the request behind the scenes for you. The code below is working for me
beforeSend(xhr) {
if (this.lastRequest) {
this.lastRequest.cancel()
}
this.lastRequest = xhr
},
from vue-resource.
@BrockReece I've tried your code:
this.$http.get('/users',{},{
beforeSend(xhr){
debugger;
if (this.lastRequest) {
this.lastRequest.cancel()
}
this.lastRequest = xhr
}
});
but throw an error below:
App.vue?0940:60 Uncaught (in promise) TypeError: this.lastRequest.cancel is not a function(β¦)
The lastRequest object has not a method named cancel,and it is not a xhr(instance of XMLHttpRequest) object,it's a request object. why?
from vue-resource.
I don't know sorry.
The source shows the object should have a cancel method
Can you console.log the lastRequest obj?
from vue-resource.
@BrockReece I've watched expression and screenshots,can you upload screenshots of your whole code
from vue-resource.
@WilliamDu1981 This is my code that works, what version of vue resource are you using?
this.$http.post(this.url, data, {
beforeSend(xhr) {
if (this.lastRequest) {
this.lastRequest.cancel()
}
this.lastRequest = xhr
},
}).then(response => {
...
}
from vue-resource.
@BrockReece I install it via npm,It should be the newest versionγ
I find the code in xhr.js:
var xhr = new XMLHttpRequest(), response = {request: request}, handler;
request.cancel = () => {
xhr.abort();
};
I add breakpoints in this code and beforeSend,I found it execution after beforeSend,so when the beforeSend execution,the cancel method is not defined yet;
from vue-resource.
Related Issues (20)
- IE11 issue with executor.bind
- Update got dependency?
- uploadProgress is not triggered?
- Please mark the repository as not maintained or give it to the community HOT 3
- How to prevent a console.error on certain GET requests?
- Vue Resource Always throwing in error callback in firefox
- change the url in Vue.http.interceptors with asynchronous methods
- IE11 xhr.send(undefined) sends 'undefined' string as POST payload
- Setting root does not take effect HOT 6
- request.abort() is not there
- Is this package still being maintained? HOT 2
- Catch is not recognized in promise
- Error firefox IPV6 VUE.JS vue-resource.common.js XMLHttpRequest
- Upgrade got HOT 3
- Trying to get in touch regarding a security issue
- how use vue-resource in composition API HOT 1
- Any plans for Vue 3 support? HOT 3
- The field is converted to undefined HOT 1
- Can I use this package for SEO optimisation tasks?
- HTTP-semantics high vulnerability - update got dependency
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vue-resource.