typescript - ประเภทคำขอ post ของ Angular HttpClient

เอกสารทางการของ Angular HttpClient ให้ตัวอย่างดังต่อไปนี้สำหรับการส่งคำขอ POST ไปยังเซิร์ฟเวอร์แบ็คเอนด์บางตัว

/** POST: add a new hero to the database */
addHero (hero: Hero): Observable<Hero> {
  return this.http.post<Hero>(this.heroesUrl, hero, httpOptions)
    .pipe(
      catchError(this.handleError('addHero', hero))
    );
}

แต่ฉันสับสนว่าทำไม Observable ถึงส่งคืนข้อมูล Hero หรือข้อมูลอื่นใดแทนที่จะเป็นรหัสความสำเร็จสำหรับการร้องขอ POST ฉันเข้าใจว่าทำไมการร้องขอ GET ถึงใช้การระบุประเภท แต่ไม่ค่อยเข้าใจว่ามันทำงานอย่างไร

คำตอบ #1

ใช่! นั่นเป็นความจริง, POST จะส่งกลับพร้อมโค้ดความสำเร็จ ฉันไม่รู้ว่าเหตุผลจริงๆ ที่ระบุแบบนี้ในเอกสารคืออะไร แต่ฉันจะเขียนในสิ่งที่ฉันเข้าใจ (ค่อนข้างยากที่จะเขียนในคอมเมนต์:)

การตอบสนองจากคำขอ POST จะขึ้นอยู่กับวิธีที่คุณได้ใช้งาน API ของคุณ ตัวอย่างเช่น ฐานข้อมูลของคุณมีค่ามาตรฐานที่ตั้งไว้สำหรับคำขอ POST ใด ๆ เช่น createDate ของ Hero และคุณต้องการ createDate ในแอปพลิเคชัน Angular ของคุณ คุณจะทำอย่างไร? คุณจะส่งข้อมูล Hero จาก API

ตามที่ได้มีการใช้งานในเอกสาร พวกเขากำลังใช้ mock-api หากคุณบันทึกการตอบสนอง คุณจะเห็นสถานะของ 204 โดยค่าเริ่มต้น ด้วยสถานะนี้ ร่างกายจะไม่ถูกส่ง แต่ถ้าคุณกำหนดค่าบริการจำลองของคุณเช่น:

HttpClientInMemoryWebApiModule.forRoot(InMemHeroService, {put204: false, post204: false})

คุณจะได้รับการตอบกลับ 200 พร้อมกับเนื้อหา ซึ่งจะเป็นเนื้อหา Hero

คำตอบ #2

ในตัวอย่างนั้น addHero ดูเหมือนจะเป็นส่วนหนึ่งของ "บริการ" ของฮีโร่ที่ถูกฉีดเข้าไปใน HeroesComponent จากนั้น HeroesComponent จะสมัครสมาชิกกับวิธีการของบริการนั้นและส่งฮีโร่ที่ได้รับจากเซิร์ฟเวอร์ไปยังอาร์เรย์ของฮีโร่

นี่คือ HeroesComponent ที่สมัครรับข้อมูลจาก addHero observable HeroesComponent เริ่มต้นวิธีการ POST โดยการสมัครรับ observables ที่ส่งกลับมาจากวิธีการของบริการ

this.heroesService.addHero(newHero)
  .subscribe(hero => this.heroes.push(hero));