Angular2 http.get() 总是给出 404

Question

我正在尝试从文件加载虚拟 json 数据，但似乎 angular2 http.get 方法无法获取该数据。每次它提供的资源不可用，状态为 404。我正在使用下面的代码。

const obs: Observable<any> = this.http.get('http://localhost:4200/assets/mock-json/cashback.json')
    .map((res: Response) => {
      console.log('***********',res.json());
      res.json(); })
    .do((res) => this.loadedCB = res);
 if (this.loadedCB) {
     return Observable.of(this.loadedCB);
 }

即使我在浏览器中手动尝试 URL http://localhost:4200/assets/mock-json/cashback.json，它仍然有效。无法弄清楚为什么它不能与 http.get() 一起使用。

Answer 1

这个问题可能会发生，因为您从未订阅 observable 以便它可以开始执行，因此由于未发送请求，您将不会得到任何结果（您可以在某些网络选项卡中检查网络检查员）。

您应该尝试订阅 observable 以便它可以开始执行。

例子：

export class AppComponent implements OnInit {
  loadedCB: any;

  constructor(public http: Http) {
  }

  ngOnInit() {
    this.tryAndLoad();
  }

  tryAndLoad() {
    this.load().subscribe((res: any) => {
      this.loadedCB = res;
      if (this.loadedCB) {
        console.log(this.loadedCB);
        return Observable.of(this.loadedCB);
      }
    });
  }

  load() {
    return this.http.get('http://localhost:4200/assets/mock-json/cashback.json')
      .map((res: Response) => {
        console.log('***********', res);
        return res.json();
      })
  }
}

它正确地返回一个结果，然后你可以对这个值做任何你想做的事情，因为你返回一个 observable 你可以做其他事情（这个演示不处理那个）

还要将 import 'rxjs/Rx'; 添加到页面顶部，这样您就不会得到 this.http.get(...).map 错误