httpClient放置请求显示错误

Question

我想更新一些数据，例如，我使用了来自互联网的免费api。

我的浏览器出现以下错误：

出什么问题了？

  updateShortUrl(data: ShortUrl): Observable<any> {
     return this._http.put('https://jsonplaceholder.typicode.com/posts/1').pipe(map((res) => {
      return res;
    }));

  }

我的导入看起来像：

import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';
import { HttpClient, HttpParams } from '@angular/common/http';
import { map } from 'rxjs-compat/operator/map';
import { map, Observable } from 'rxjs/operators';
import 'rxjs/add/operator/delay';
import 'rxjs/add/operator/switchMap';

Answer 1

问题是您使用的是 POST 请求，而在发布请求时，您需要发送多个参数。如果您注意到您正在将参数传递给updateShortUrl方法，但也从未使用过它。

updateShortUrl(data: ShortUrl): Observable<any> {
     return this._http.put('https://jsonplaceholder.typicode.com/posts/1', YOUR_PARAMETER_HERE).pipe(map((res) => {
      return res;
    }));   
  }

此外，记住不要使用“ any”。通过使用 .pipe ，您将始终返回可观察到的信息，因此无需重复输入任何内容。另一件事是，如果您对返回的请求不做任何事情，则无需使用管道。你可以有这样的东西：

updateShortUrl(data: ShortUrl) {
         return this._http.put('https://jsonplaceholder.typicode.com/posts/1', YOUR_PARAMETER_HERE);
      }

最佳做法是为您创建一个模块，该模块指定要获取的Observable类型

export class Post {
     userId: number,
     id: number,
     title: string,
     body: string

     constructor(private userId: number, private id: number, private title: , private body: string) {
      this.userId= userId;
      this.id= id;
      this.title = title
      this.body = body
     }
}

然后按以下方式使用它：

updateShortUrl(data: ShortUrl) Observable<Post> {
   return this._http.put('https://jsonplaceholder.typicode.com/posts/1', YOUR_PARAMETER_HERE);
}

此外，我注意到您正在使用该jsonplaceholder来测试您的应用程序。您可以随时使用JSON-SERVER https://www.npmjs.com/package/json-server