Клиент Angular TypeScript, созданный из приложения ASP.NET Core 3.1, не работает - PullRequest
Новая
       220

Клиент Angular TypeScript, созданный из приложения ASP.NET Core 3.1, не работает

1 голос
/ 23 декабря 2019

У меня проблемы с сгенерированным клиентом Swagger Angular из Asp.Net Core 3.1.

Я создал приложение ASP.NET Core и добавил следующее в TestController.cs 

[HttpGet]
[Route("TList")]
[Produces("application/json")]
public ActionResult<TestDto> TList()
{
  TestDto result = new TestDto();
  result.Title = "Title";
  result.DataList = new List<TestItem>();
  result.DataList.Add(new TestItem() { Title = "Test" });
  return Ok(result);
}

DTO был определен как: 

  public class TestDto
  {
    public string Title { get; set; }
    public List<TestItem> DataList { get; set; }
  }
  public class TestItem
  {
    public string Title { get; set; }
  }

Я генерирую файл swagger из: 

gulp.task('swagger-json', function (cb) {
 exec('node_modules\\nswag\\bin\\binaries\\NetCore30\\dotnet-nswag webapi2swagger /assembly:..\\bin\\Debug\\netcoreapp3.1\\WebApplication1.dll /output:WebApplication1.swagger.json', function (err, stdout, stderr) {
  console.log(stdout);
  console.log(stderr);
  cb(err);
 });
});

gulp.task('swagger-angular', function (cb) {
 exec('node_modules\\nswag\\bin\\binaries\\win\\nswag swagger2tsclient /input:WebApplication1.swagger.json /output:src/generated/Backend.ts /template:Angular /injectionTokenType:InjectionToken /httpClass:HttpClient /rxJsVersion:6.0', function (err, stdout, stderr) {
  console.log(stdout);
  console.log(stderr);
  cb(err);
 });
});

Я вызываю интерфейс Rest с помощью 

 public getDataWithSwagger() {
  this.testClient.tList().subscribe((data) => {
   this.myData = data;
   this.title = data.title;
  },
   () => { console.warn("Could not call REST") }
  );
 }
}

Нопеременные данные не заполняются, заголовок не определен и dataList вообще не отображается

Но работает следующий код, заголовок и dataList заполнены 

public getData() {
  this.http.get('https://localhost:44383/api/test/TList').subscribe((data: TestDto) => {
   this.myData = data;
   this.title = data.title;
  });
 }

Какие дополнительные параметры мне нужныдать в командах dotnet-nswag или nswag?

Ниже приведена часть сгенерированного кода из nswag 

tList(): Observable<TestDto | null> {
    let url_ = this.baseUrl + "/api/Test/TList";
    url_ = url_.replace(/[?&]$/, "");

let options_ : any = {
    observe: "response",
    responseType: "blob",           
    headers: new HttpHeaders({
        "Accept": "application/json"
    })
};

return this.http.request("get", url_, options_).pipe(_observableMergeMap((response_ : any) => {
    return this.processTList(response_);
})).pipe(_observableCatch((response_: any) => {
    if (response_ instanceof HttpResponseBase) {
        try {
            return this.processTList(<any>response_);
        } catch (e) {
            return <Observable<TestDto | null>><any>_observableThrow(e);
        }
    } else
        return <Observable<TestDto | null>><any>_observableThrow(response_);
}));
}

protected processTList(response: HttpResponseBase): Observable<TestDto | null> {
    const status = response.status;

const responseBlob = 
    response instanceof HttpResponse ? response.body : 
    (<any>response).error instanceof Blob ? (<any>response).error : undefined;

let _headers: any = {}; if (response.headers) { for (let key of response.headers.keys()) { _headers[key] = response.headers.get(key); }};
if (status === 200) {
    return blobToText(responseBlob).pipe(_observableMergeMap(_responseText => {
    let result200: any = null;
    let resultData200 = _responseText === "" ? null : JSON.parse(_responseText, this.jsonParseReviver);
    result200 = resultData200 ? TestDto.fromJS(resultData200) : <any>null;
    return _observableOf(result200);
    }));
} else if (status !== 200 && status !== 204) {
    return blobToText(responseBlob).pipe(_observableMergeMap(_responseText => {
    return throwException("An unexpected server error occurred.", status, _responseText, _headers);
    }));
}
    return _observableOf<TestDto | null>(<any>null);
}

1 Ответ

0 голосов
/ 03 января 2020

Проблема возникла из-за того, что созданный Swagger сервер ожидал свойства Json в Pascal Cased, но ASP.NET Core по умолчанию предоставляет camelCase. Чтобы исправить это: 

        services.AddControllersWithViews()
            .AddJsonOptions(options =>
            {
                options.JsonSerializerOptions.PropertyNamingPolicy=null;
            });

Если вы предпочитаете верблюжий чехол, может быть способ изменить это в NSwagStudio.

...