如何在Ionic2中显示慢速互联网的警报？

Question

I want to detect slow internet in ionic2 app and handle it.

I have done google and approach to use settimeout is perferred but how can I use it when calling an api ?

I am calling api as:

   AppSettings.API_ENDPOINT = is a constant having api url.

 this.returned = this.http.post(`${AppSettings.API_ENDPOINT}login`, "email=" + email + "&password=" + password, { headers: headers }).timeout(100).map(res => res.json()).subscribe(data => {

            this.conn_error_msg = '';

            if (data.status == 200) {


            }
            else {

            }

        }, 
        error => {
            this.isDisabled = 0;
            this.conn_error_msg = 'Internet connection error. Please try again.';
            console.log(JSON.stringify(error.json()));
            loader.dismiss();
        }
        );

My timeout is working fine using this way but i am in need to show an alert ..

Here i wish to show an alert if time out

Solved:

this.http.get(url)

.timeout(1000) .map(...) .subcribe((success) => {...}, (err) => { // Deal here with timeout error. });

Hope it helps someone.

Happy coding.

Answer 1

You can set the timeout when calling the api like this:

import 'rxjs/add/operator/timeout';

return this.http.get(yourUrl).timeout(50000, new Error('Timeout!'));

Of course, the same can be done when using the post/put... methods as well.

Answer 2

You can do something like:

let returned = false;

startCallTime(slowConnectionLimit){
  setTimeout(() => {
    if(returned){
      // IS NOT SLOW
    } else {
      // IS SLOW. SHOW YOUR MESSAGE
    }
  }, slowConnectionLimit)
}

callApi = () => {
 startCallTime(30000); // WILL DETECT SLOW CONNECTION AFTER 30 SECONDS
 this.http.get().then((res) => {
    returned = true; // HERE YOU KNOW IF THE CALL HAS ENDED
 });
}

I think @sebaferreras answer is more clean, but is only useful to rxjs...