Angular 安格拉尔和昂首阔步的客户

Angular 安格拉尔和昂首阔步的客户,angular,swagger-2.0,angular-httpclient,Angular,Swagger 2.0,Angular Httpclient,也许有人能帮忙。我尝试使用组件中的默认服务与RESTAPI通信到后端python服务器。我尝试在angular中使用由swagger codegen生成的ng2客户端。Python服务器也是由swagger生成的。服务器正在工作 import { Inject, Injectable, Optional } from '@angular/core'; import { Http, Headers, URLSearchParams } from '@angular/http'; import {

也许有人能帮忙。我尝试使用组件中的默认服务与RESTAPI通信到后端python服务器。我尝试在angular中使用由swagger codegen生成的ng2客户端。Python服务器也是由swagger生成的。服务器正在工作

import { Inject, Injectable, Optional } from '@angular/core';
import { Http, Headers, URLSearchParams } from '@angular/http';
import { RequestMethod, RequestOptions, RequestOptionsArgs } from '@angular/http';
import { Response, ResponseContentType } from '@angular/http';

import { Observable } from 'rxjs/Observable';
import '../rxjs-operators';

import { InlineResponseDefault } from '../model/inlineResponseDefault';

import { BASE_PATH, COLLECTION_FORMATS } from '../variables';
import { Configuration } from '../configuration';
import { CustomQueryEncoderHelper } from '../encoder';


@Injectable()
export class DefaultService {

    protected basePath = 'http://127.0.0.1:8080/v1';
    public defaultHeaders = new Headers();
    public configuration = new Configuration();

    constructor(protected http: Http, @Optional()@Inject(BASE_PATH) basePath: string, @Optional() configuration: Configuration) {
        if (basePath) {
            this.basePath = basePath;
        }
        if (configuration) {
            this.configuration = configuration;
            this.basePath = basePath || configuration.basePath || this.basePath;
        }
    }

    /**
     * @param consumes string[] mime-types
     * @return true: consumes contains 'multipart/form-data', false: otherwise
     */
    private canConsumeForm(consumes: string[]): boolean {
        const form = 'multipart/form-data';
        for (let consume of consumes) {
            if (form === consume) {
                return true;
            }
        }
        return false;
    }


    public isJsonMime(mime: string): boolean {
        const jsonMime: RegExp = new RegExp('^(application\/json|[^;/ \t]+\/[^;/ \t]+[+]json)[ \t]*(;.*)?$', 'i');
        return mime != null && (jsonMime.test(mime) || mime.toLowerCase() === 'application/json-patch+json');
    }

    /**
     * Abort the programm in the project identified by UUID
     * @param UUID The UUID
     */
    public abortProject(UUID: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<{}> {
        return this.abortProjectWithHttpInfo(UUID, extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }

    /**
     * delete a single file at a specified path
     * @param UUID The UUID
     * @param path The path where to upload.
     */
    public deleteFile(UUID: string, path: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<{}> {
        return this.deleteFileWithHttpInfo(UUID, path, extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }

    /**
     * Testing the connection
     */
    public ping(extraHttpRequestParams?: RequestOptionsArgs): Observable<string> {
        return this.pingWithHttpInfo(extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }
app.component.ts

我尝试在contsructor中插入default.service,之后浏览器会给出消息ERROR NO PROVIDER FOR HTTP Injection ERROR。。。。。 我对ng和ts完全是新手:-(。在这之后,我定义了一个函数,用于获取控制台日志和服务器的答案

import { Component, OnInit } from '@angular/core';
import { InlineResponseDefault } from '../app/rest';
import { HttpClient, } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { Response } from '@angular/http';
import { DefaultService } from './rest/api/default.service';
import { HttpClientModule } from '@angular/common/http';



@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})


export class AppComponent {
  title = 'app';


  constructor(private defaultService: DefaultService, public http: HttpClient) {

  }

  getPing() {
    console.log(this.defaultService.ping);
      }

}

问题在于,在app.module.ts中,您要从@angular/common/http导入HttpClientModule,在您的服务中,您试图从@angular/http注入HttpClient。这些版本与http客户端不同,@angular/common/http是最新版本

将您的服务更改为:

import { HttpClient } from '@angular/common/http';
//
@Injectable()
export class DefaultService {
  constructor(protected http: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string, @Optional() configuration: Configuration) {

问题在于,在app.module.ts中,您要从@angular/common/http导入HttpClientModule,在您的服务中,您试图从@angular/http注入HttpClient。这些版本与http客户端不同,@angular/common/http是最新版本

将您的服务更改为:

import { HttpClient } from '@angular/common/http';
//
@Injectable()
export class DefaultService {
  constructor(protected http: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string, @Optional() configuration: Configuration) {

您在一个位置有
Http
,在另一个位置有
HttpClient
。我强烈建议。我假设您打算使用
HttpClient
,但如果您想改用
Http
,请参阅

default.service.ts中,更新构造函数以使用
HttpClient

constructor(protected http: HttpClient, ... other params ...)
在app.component.ts中:

  • 删除
    HttpClient
    构造函数参数:

    constructor(private defaultService: DefaultService) {}
    
  • 更新您的
    getPing()
    方法以实际调用默认服务上的
    ping()
    方法:

    console.log(this.defaultService.ping()); 
    
    如果没有
    ()
    ,它将返回函数引用而不调用函数

  • 删除HttpClientModule的导入。您只需要在app.module.ts文件中使用它

你的app.module.ts很好

事实上,我不知道默认服务将如何编译,因为它似乎调用了一大堆根本不存在的方法


正如我之前提到的,这是针对
HttpClient
。如果你想使用
Http
,你需要使用
HttpModule
。参考我上面链接的文档,但建议你使用
HttpClient
,你在一个地方有
Http
,在另一个地方有
HttpClient
。我强烈建议修复。我假设您打算使用
HttpClient
,但是如果您想使用
Http
,请参阅

default.service.ts中,更新构造函数以使用
HttpClient

constructor(protected http: HttpClient, ... other params ...)
在app.component.ts中:

  • 删除
    HttpClient
    构造函数参数:

    constructor(private defaultService: DefaultService) {}
    
  • 更新您的
    getPing()
    方法以实际调用默认服务上的
    ping()
    方法:

    console.log(this.defaultService.ping()); 
    
    如果没有
    ()
    ,它将返回函数引用而不调用函数

  • 删除HttpClientModule的导入。您只需要在app.module.ts文件中使用它

你的app.module.ts很好

事实上,我不知道默认服务将如何编译,因为它似乎调用了一大堆根本不存在的方法


正如我之前提到的,这是针对
HttpClient
。如果你想使用
Http
,你需要使用
HttpModule
。参考我上面链接的文档,但建议你使用冻结的
HttpClient
@Roddy,这是我的全部默认值。service.ts。你说如果我有这个方法,我需要c所有
this.http.post(“http://example.com/api/abortProjectWithHttpI‌​nfo“,…)
但我认为如果我ping服务器,我可以使用默认的.service进行ping。我刚刚意识到浏览器中的my angular应用程序是空的。HTML将不会显示……这令人沮丧

import { Inject, Injectable, Optional } from '@angular/core';
import { Http, Headers, URLSearchParams } from '@angular/http';
import { RequestMethod, RequestOptions, RequestOptionsArgs } from '@angular/http';
import { Response, ResponseContentType } from '@angular/http';
import { HttpClient } from '@angular/common/http';

import { Observable } from 'rxjs/Observable';
import '../rxjs-operators';

import { InlineResponseDefault } from '../model/inlineResponseDefault';

import { BASE_PATH, COLLECTION_FORMATS } from '../variables';
import { Configuration } from '../configuration';
import { CustomQueryEncoderHelper } from '../encoder';


@Injectable()
export class DefaultService {

    protected basePath = 'http://127.0.0.1:8080/v1';
    public defaultHeaders = new Headers();
    public configuration = new Configuration();

    constructor(protected http: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string, @Optional() configuration: Configuration) {
        if (basePath) {
            this.basePath = basePath;
        }
        if (configuration) {
            this.configuration = configuration;
            this.basePath = basePath || configuration.basePath || this.basePath;
        }
    }

    /**
     * @param consumes string[] mime-types
     * @return true: consumes contains 'multipart/form-data', false: otherwise
     */
    private canConsumeForm(consumes: string[]): boolean {
        const form = 'multipart/form-data';
        for (let consume of consumes) {
            if (form === consume) {
                return true;
            }
        }
        return false;
    }


    public isJsonMime(mime: string): boolean {
        const jsonMime: RegExp = new RegExp('^(application\/json|[^;/ \t]+\/[^;/ \t]+[+]json)[ \t]*(;.*)?$', 'i');
        return mime != null && (jsonMime.test(mime) || mime.toLowerCase() === 'application/json-patch+json');
    }

    /**
     * Abort the programm in the project identified by UUID
     * @param UUID The UUID
     */
    public abortProject(UUID: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<{}> {
        return this.abortProjectWithHttpInfo(UUID, extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }

    /**
     * delete a single file at a specified path
     * @param UUID The UUID
     * @param path The path where to upload.
     */
    public deleteFile(UUID: string, path: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<{}> {
        return this.deleteFileWithHttpInfo(UUID, path, extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }

    /**
     * Testing the connection
     */
    public ping(extraHttpRequestParams?: RequestOptionsArgs): Observable<string> {
        return this.pingWithHttpInfo(extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }

    /**
     * Run the programm in the project identified by UUID
     * @param UUID The UUID
     */
    public runProject(UUID: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<{}> {
        return this.runProjectWithHttpInfo(UUID, extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }

    /**
     * Send a single file to the server
     * @param UUID The UUID
     * @param path The path where to upload.
     * @param file The single file to upload.
     */
    public sendFile(UUID: string, path: string, file: Blob, extraHttpRequestParams?: RequestOptionsArgs): Observable<{}> {
        return this.sendFileWithHttpInfo(UUID, path, file, extraHttpRequestParams)
            .map((response: Response) => {
                if (response.status === 204) {
                    return undefined;
                } else {
                    return response.json() || {};
                }
            });
    }


    /**
     * 
     * Abort the programm in the project identified by UUID
     * @param UUID The UUID
     */
    public abortProjectWithHttpInfo(UUID: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<Response> {
        if (UUID === null || UUID === undefined) {
            throw new Error('Required parameter UUID was null or undefined when calling abortProject.');
        }

        let headers = new Headers(this.defaultHeaders.toJSON()); // https://github.com/angular/angular/issues/6845

        // to determine the Content-Type header
        let consumes: string[] = [
            'application/x-www-form-urlencoded'
        ];
        let canConsumeForm = this.canConsumeForm(consumes);
        let useForm = false;
        let formParams = new (useForm ? FormData : URLSearchParams as any)() as {
          set(param: string, value: any): void;
        };
        if (UUID !== undefined) {
            formParams.set('UUID', <any>UUID);
        }

        let requestOptions: RequestOptionsArgs = new RequestOptions({
            method: RequestMethod.Post,
            headers: headers,
            body: formParams.toString(),
            withCredentials:this.configuration.withCredentials
        });
        // https://github.com/swagger-api/swagger-codegen/issues/4037
        if (extraHttpRequestParams) {
            requestOptions = (<any>Object).assign(requestOptions, extraHttpRequestParams);
        }

        return this.http.request(`${this.basePath}/abort`, requestOptions);
    }

    /**
     * 
     * delete a single file at a specified path
     * @param UUID The UUID
     * @param path The path where to upload.
     */
    public deleteFileWithHttpInfo(UUID: string, path: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<Response> {
        if (UUID === null || UUID === undefined) {
            throw new Error('Required parameter UUID was null or undefined when calling deleteFile.');
        }
        if (path === null || path === undefined) {
            throw new Error('Required parameter path was null or undefined when calling deleteFile.');
        }

        let headers = new Headers(this.defaultHeaders.toJSON()); // https://github.com/angular/angular/issues/6845

        // to determine the Content-Type header
        let consumes: string[] = [
            'multipart/form-data'
        ];
        let canConsumeForm = this.canConsumeForm(consumes);
        let useForm = false;
        let formParams = new (useForm ? FormData : URLSearchParams as any)() as {
          set(param: string, value: any): void;
        };
        if (UUID !== undefined) {
            formParams.set('UUID', <any>UUID);
        }
        if (path !== undefined) {
            formParams.set('path', <any>path);
        }

        let requestOptions: RequestOptionsArgs = new RequestOptions({
            method: RequestMethod.Delete,
            headers: headers,
            body: formParams.toString(),
            withCredentials:this.configuration.withCredentials
        });
        // https://github.com/swagger-api/swagger-codegen/issues/4037
        if (extraHttpRequestParams) {
            requestOptions = (<any>Object).assign(requestOptions, extraHttpRequestParams);
        }

        return this.http.request(`${this.basePath}/delete`, requestOptions);
    }

    /**
     * 
     * Testing the connection
     */
    public pingWithHttpInfo(extraHttpRequestParams?: RequestOptionsArgs): Observable<Response> {

        let headers = new Headers(this.defaultHeaders.toJSON()); // https://github.com/angular/angular/issues/6845

        let requestOptions: RequestOptionsArgs = new RequestOptions({
            method: RequestMethod.Get,
            headers: headers,
            withCredentials:this.configuration.withCredentials
        });
        // https://github.com/swagger-api/swagger-codegen/issues/4037
        if (extraHttpRequestParams) {
            requestOptions = (<any>Object).assign(requestOptions, extraHttpRequestParams);
        }

        return this.http.request(`${this.basePath}/ping`, requestOptions);
    }

    /**
     * 
     * Run the programm in the project identified by UUID
     * @param UUID The UUID
     */
    public runProjectWithHttpInfo(UUID: string, extraHttpRequestParams?: RequestOptionsArgs): Observable<Response> {
        if (UUID === null || UUID === undefined) {
            throw new Error('Required parameter UUID was null or undefined when calling runProject.');
        }

        let headers = new Headers(this.defaultHeaders.toJSON()); // https://github.com/angular/angular/issues/6845

        // to determine the Content-Type header
        let consumes: string[] = [
            'application/x-www-form-urlencoded'
        ];
        let canConsumeForm = this.canConsumeForm(consumes);
        let useForm = false;
        let formParams = new (useForm ? FormData : URLSearchParams as any)() as {
          set(param: string, value: any): void;
        };
        if (UUID !== undefined) {
            formParams.set('UUID', <any>UUID);
        }

        let requestOptions: RequestOptionsArgs = new RequestOptions({
            method: RequestMethod.Post,
            headers: headers,
            body: formParams.toString(),
            withCredentials:this.configuration.withCredentials
        });
        // https://github.com/swagger-api/swagger-codegen/issues/4037
        if (extraHttpRequestParams) {
            requestOptions = (<any>Object).assign(requestOptions, extraHttpRequestParams);
        }

        return this.http.request(`${this.basePath}/run`, requestOptions);
    }

    /**
     * 
     * Send a single file to the server
     * @param UUID The UUID
     * @param path The path where to upload.
     * @param file The single file to upload.
     */
    public sendFileWithHttpInfo(UUID: string, path: string, file: Blob, extraHttpRequestParams?: RequestOptionsArgs): Observable<Response> {
        if (UUID === null || UUID === undefined) {
            throw new Error('Required parameter UUID was null or undefined when calling sendFile.');
        }
        if (path === null || path === undefined) {
            throw new Error('Required parameter path was null or undefined when calling sendFile.');
        }
        if (file === null || file === undefined) {
            throw new Error('Required parameter file was null or undefined when calling sendFile.');
        }

        let headers = new Headers(this.defaultHeaders.toJSON()); // https://github.com/angular/angular/issues/6845

        // to determine the Content-Type header
        let consumes: string[] = [
            'multipart/form-data'
        ];
        let canConsumeForm = this.canConsumeForm(consumes);
        let useForm = false;
        useForm = canConsumeForm;
        let formParams = new (useForm ? FormData : URLSearchParams as any)() as {
          set(param: string, value: any): void;
        };
        if (UUID !== undefined) {
            formParams.set('UUID', <any>UUID);
        }
        if (path !== undefined) {
            formParams.set('path', <any>path);
        }
        if (file !== undefined) {
            formParams.set('file', <any>file);
        }

        let requestOptions: RequestOptionsArgs = new RequestOptions({
            method: RequestMethod.Post,
            headers: headers,
            body: formParams.toString(),
            withCredentials:this.configuration.withCredentials
        });
        // https://github.com/swagger-api/swagger-codegen/issues/4037
        if (extraHttpRequestParams) {
            requestOptions = (<any>Object).assign(requestOptions, extraHttpRequestParams);
        }

        return this.http.request(`${this.basePath}/files`, requestOptions);
    }

}
从'@angular/core'导入{Inject,Injectable,Optional};
从'@angular/Http'导入{Http,Headers,URLSearchParams};
从'@angular/http'导入{RequestMethod,RequestOptions,RequestOptionsArgs};
从'@angular/http'导入{Response,ResponseContentType};
从'@angular/common/http'导入{HttpClient};
从“rxjs/Observable”导入{Observable};
导入“../rxjs运算符”;
从“../model/InlineResponseDefault”导入{InlineResponseDefault};
从“../variables”导入{BASE_PATH,COLLECTION_FORMATS};
从“../Configuration”导入{Configuration};
从“../encoder”导入{CustomQueryEncoderHelper};
@可注射()
导出类DefaultService{
受保护的基本路径http://127.0.0.1:8080/v1';
public defaultHeaders=新头();
公共配置=新配置();
构造函数(受保护的http:HttpClient、@Optional()@Inject(BASE_PATH)basePath:string、@Optional()配置:配置){
if(基本路径){
this.basePath=basePath;
}
if(配置){
this.configuration=配置;
this.basePath=basePath | | configuration.basePath | this.basePath;
}
}
/**
*@param使用字符串[]mime类型
*@return true:consumes包含“多部分/表单数据”,false:否则
*/
private canConsumeForm(使用:字符串[]):布尔值{
const form='multipart/form data';
为了(让消耗的消耗){
如果(形式===消费){
返回true;
}
}
返回false;
}
公共isjsontime(mime:string):布尔值{
const-jsontime:RegExp=new-RegExp('^(应用程序\/json |[^;/\t]+\/[^;/\t]+[+]json)[\t]*(;.*)?$,'i');
返回mime!=null&(jsonMime.test(mime)| | mime.toLowerCase()=='application/json patch+json');
}
/**
*流产