标签: angular4-httpclient

如何在删除请求中通过httpClient传递body？

请检查我的代码。有什么想法可以在删除请求中通过正文传递数据吗？没有正确的来源如何在 Angular 5 中调用此请求。

let body = removeFile;
    return this.httpClient.delete(`${apiRoot}RemoveQueryData`, {
      headers: new HttpHeaders().set('Content-Type', 'application/json').set('Authorization', `Bearer ${accessToken}`),
      observe: removeFile
    })

我正在观察那个身体。它抛出以下错误。

错误：

Error: Unreachable: unhandled observe type [object Object]}
    at HttpClient.request (http.js:1520)
    at HttpClient.delete (http.js:1546)

我有一个使用Http的工作代码,我想学习如何将其转换为使用最新的HttpClient.

我已完成以下步骤:

• 在App.module.ts中:从"@ angular/common/http"导入{HttpClientModule};
• 将HttpClientModule添加到imports数组中
• 在下面的服务文件中(见下文):从"@ angular/common/http"导入{HttpClient};
• 在构造函数中注入HttpClient而不是Http(用HttpClient替换Http.

现在,以下步骤我无法正确(如何重写return this.http.get(queryUrl)..)

有任何想法吗？

...

使用Http工作的代码:

import { Injectable, Inject } from "@angular/core";
import { Http, Response } from "@angular/http";
import { Observable } from "rxjs/Observable";
import { SearchResult } from "../models/search-results.model";

export const YOUTUBE_API_KEY = "AIzaSyCIYsOjnkrIjZhVCFwqNJxe1QswhsliciQ";
export const YOUTUBE_API_URL = "https://www.googleapis.com/youtube/v3/search";

@Injectable()
export class YoutubeSearchService {
  constructor(
    private http: Http,
    @Inject(YOUTUBE_API_KEY) private apiKey: string,
    @Inject(YOUTUBE_API_URL) private apiUrl: string,
  ) {}

  search(query: string): Observable<SearchResult[]> {
    const params: string = …

当我使用httpClient调用我的 Web 服务时，我开始在我的 Angular 服务中使用 Spring Rest 和 Angular 5 实现一个简单的分页，并获得对请求页面的正确响应，它在我的页面上正确显示数据，但控制台 Web 出现错误浏览器发现我的*ngFor循环中出现错误无法读取 undefined 的属性，尽管模板显示结果正确：

问题出在 Service 方法中：getPageClient() 和 *ngFor 指令这是我的错误日志：

这是我使用 observable 的服务：

import { Injectable } from '@angular/core';
import {Client} from '../models/Client'
import {PageClient} from '../models/PageClient'
import { Observable, of } from 'rxjs';
import { HttpClient,HttpHeaders } from '@angular/common/http';
import {catchError,map,tap} from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class ClientService {

  private url = 'http://localhost:8099/api/clients';

  private urlPage = 'http://localhost:8099/api/clients/get?page=0&size=3';

  getClient(): Observable<Client[]>{
     return this.http.get<Client[]>(this.url)
      .pipe( …

我的有角4.3.2代码正在调用我的后端服务，该服务需要2-4分钟才能返回。仅使用默认this.http.get代码，我看到默认超时在2分钟后开始。但是，当我尝试将超时时间设置为超过2分钟时，它将失败，因为它将永远不会使超时时间超过2分钟。

我尝试使用100、100000（1.7m）和114000（1.9m），并且在这些值下超时的工作方式是正确的。但是当我尝试126000（2.1m），180000（3m）和1800000（30m）时，我再次看到它在2分钟后超时。

this.http.get('myUrl')
.timeout(126000)
.map((res: Response) => this.convertResponse(res));

我也尝试了一下，.timeoutWith(126000, Observable.throw(new Error("Timed out")))但无济于事。

我正在使用HttpInterceptor新的Angular的api,HttpClientModule现在陷入困境.这是我的用例.

在我的应用程序中,如果任何服务进行http调用,我想在它之前进行另一个静默http调用,并希望在本地存储它的结果.一旦完成静默呼叫,那么只有我将继续服务的http呼叫并返回其结果.

这就是我正在做的事情.(使用HttpInterceptor)

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (req.url.match(/api\//)) { // api call
           http.post('/auth/silentCall', {user: 123}).subscribe(
                     (data) => {
                        console.log(data);
                        const clone = req.clone({ setHeaders: { 'Authorization ': tokenService.getToken() } });
                        return  next.handle(clone).do((event: HttpEvent<any>) => {
                            if (event instanceof HttpResponse) {
                                console.log('Service's call response');
                            }
                        }, (err: any) => {
                            if (err instanceof HttpErrorResponse) {
                                console.log('Network call err', err);
                            }
                        });
                     },
                     (err) => {
                        if (err instanceof HttpErrorResponse) {
                           return Observable.throw(err); 
                        }
                 ); …

我在Nodejs中制作了API,登录后我x-auth在成功登录时在响应中发送了auth-token(标题).

当我从邮递员点击web服务时,我能够看到x-auth标题但不在Angular 4中

我使用的是HttpClient,而不是Http.

createClient(client:Client){
    return this.http.post(
      Config.baseUrl+'/client/login',client,{observe:'response'});
}

然后在我的组件中

this.userService.createClient(this.signupForm.value).subscribe((data)=>{
      this.clientCreatedSuccessfully = true;
      console.log(data);
      console.log(data.headers.getAll('x-auth'));
    },(error)=>{
      this.clientExist = true;
      console.log(error);
    })

在data.headers.getAll('x-auth')返回null.

我想为用户路由实现canActivate，然后再检查访问令牌是否仍然有效。因此，我实现了这样的事情

export class AuthGuard implements CanActivate {
  data:Array<Object>;
  constructor(private base: BaseService){}

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean {

    var session: any = { token: localStorage.getItem('abc') };   

    this.base.valid(session).subscribe(result => {
      this.data=result;
      console.log(this.data); <-- first 
    });

    console.log(this.data); <-- second
    return true;
  }
}

在这里，当我进行控制台操作时，可以在subscribe方法中获取数据变量，但是在此方法之外是给定undefined值。如何在方法之外访问它。

我有一个进行两个http调用的函数，第二个http的输入取决于第一个http响应，并且我需要同时返回两个结果。我有下面的代码会引发错误

SomeMethod(): Observable<any> {
    let firstResult;
    let secondResult;

    firstResult = http.get('////').map(data => {
        console.log('first response')
     secondResult = http.get('//// + {data.UserId}').map(response => {

        console.log('second response')
     })
    })

    return forkJoin([firstResult, secondResult]);
}

CallingMethod() {
    this.SomeMethod.subscribe(([firstResult, secondResult]) =>{
     /// Some logic
    })}

收到未定义错误。需要一个 observable、promise 或 array。调试后发现第一个控制台输出正在打印，第二个 http 调用从未进行，也从未看到响应。

如何使用 forkJoin 或任何其他机制一起返回两个嵌套调用响应？

我已经创建了 HTTP_INTERCEPTOR，我需要它来处理一些特定的路由，而另一些则不需要。

一开始它在主应用程序模块文件中，然后我从那里删除它并将它添加到一些模块中，但它仍然适用于所有路由，然后我将它添加到 component.ts 中但根本不起作用。

{
            provide: HTTP_INTERCEPTORS,
            useClass: AuthExpiredInterceptor,
            multi: true,
            deps: [Injector]
},

我已经尝试了很多,但我无法将端点响应映射到我的模型.我正在使用HttpClient和Angular4.我从服务中获取了数据但是没有正确映射到我的模型类.

我有以下JSON服务正在返回:

{
    "result": [
        {
            "id": "1",
            "type": "User",
            "contactinfo": {
                "zipcode": 1111,
                "name": "username"
            }
        }
    ]
}

我在typescript中创建了一个模型,我想将其映射到json响应:

export interface result {
            zipcode: number;
            name: string;
}

这就是我调用JSON端点的方式.

result : string[] = [];

constructor(private http: HttpClient) {    }

public getList(): result[] {
        this.http.get<result[]>('url...', { headers: this.headers }).subscribe(

            data => {
             // 1. Data is returned - Working
                console.log('data: ' + data); 
                this.result= data;

                // This is the problem. My data is not mapped to my model. If …