Http調用立即取消

我有一個角色4前端CakePHP 3後端。當我使用我的瀏覽器或Rest Client向API端點發出請求時，我收到響應。但是當我發送角度服務的響應時，它立即顯示在網絡中被取消。Http調用立即取消

起初我以爲這是一個CORS問題。我曾嘗試使用和不使用CORS。我還在我的AppController.php中添加了$this->Security->csrfCheck = false;，這使我相信本地服務器永遠不會被擊中（沒有斷點）。

所以相反，我正在看等式的角度邊。我試圖設置我的標題，但也不起作用。

import { Headers, Http, Response, RequestOptions } from '@angular/http'; 

login(loginData) { 
    const headers = new Headers({'Content-Type': 'application/json'}); 

    const url:string = this.backendUrl + '/auth/login/?'; 

    return this.Http.post(
     url, 
     JSON.stringify(loginData), 
     { headers: headers } 
    ).map(
     res => res.json 
    ).map(
     response => function(response) { 
      ... 
     }, 
     error => function(error) { 
      ... 
     } 
    ); 
}

我正在從1遷移到4.所以我知道它在Angular 1中使用$ http請求工作。

function login(loginData) { 
    var = this.backendUrl + '/auth/login/?'; 

    $http.post(url, loginData).then(...); 
}

這裏是我的組件，它使用訂閱：

login = function(activeUser):ActiveUser|boolean { 
    this.isLoggingIn = true; 

    return this.LoginService.login(activeUser).subscribe(
     activeUser => function(activeUser) { 
      if (activeUser) { 
       this.activeUser = activeUser; 
      } else { 
       this.reset(); 
      } 

      return activeUser; 
     }.bind(this) 
    ).complete(
     function() { 
      this.isLoggingIn = false; 
     }.bind(this) 
    ); 
};

來源

2017-08-10 jrquick

默認情況下，角度http observables是冷的。這意味着您的登錄功能只需設置http請求。要真正發起http請求，你必須訂閱observable this.login.subscribe（）; – LLai

[Angular 2 http get not get]的可能重複（https://stackoverflow.com/questions/41381200/angular-2-http-get-not-getting） – Alex

這個問題是_slightly_不同，正在進行調用網絡和取消。我的問題似乎是沒有正確設置訂閱方法。另一個問題是完全錯過了根本不會導致任何呼叫的訂閱方法。儘管如此，它幫助我走上了正軌，謝謝！ – jrquick

問題與Angular $ http如何處理CORS請求有關。在更新的版本中，有兩個請求發送，一個OPTIONS請求，然後是實際的GET/POST請求。所以我不得不改變我的後端，在不執行命令的情況下在OPTIONS上返回200，而是在第二個請求上執行。

來源

2017-09-29 14:41:06 jrquick

我不知道爲什麼你映射了兩次。

只是爲了比較...這是我的帖子看起來像（見下文）。它發佈一個保存，但語法應該是一樣的登錄。

saveProduct(product: IProduct): Observable<IProduct> { 
     let headers = new Headers({ 'Content-Type': 'application/json' }); 
     let options = new RequestOptions({ headers: headers }); 

     return this.http.post(this.baseUrl, product, options) 
      .map(this.extractData) 
      .do(data => console.log('createProduct: ' + JSON.stringify(data))) 
      .catch(this.handleError); 
    } 

    private extractData(response: Response) { 
     let body = response.json(); 
     return body.data || {}; 
    } 

    private handleError(error: Response): Observable<any> { 
     // in a real world app, we may send the server to some remote logging infrastructure 
     // instead of just logging it to the console 
     console.error(error); 
     return Observable.throw(error.json().error || 'Server error'); 
    }

你是怎麼打這個服務的？

我的組件的代碼如下所示：

 this.productService.saveProduct(this.product) 
      .subscribe(
       () => this.onSaveComplete(`${this.product.productName} was saved`), 
       (error: any) => this.errorMessage = <any>error 
      );

請注意，這是訂閱揭開序幕的觀察到的，執行崗位。

來源

2017-08-11 00:15:59 DeborahK

當我嘗試獲取'屬性'確實'不存在'Observable''類型 – jrquick

您可以將其刪除（僅用於調試），也可以導入do操作符。 'import'rxjs/add/operator/do';' – DeborahK

我已經包含了我的調用'subscribe'的組件。我試圖刪除第二個'地圖'調用，也沒有運氣。 – jrquick

Http調用立即取消

回答

相關問題