Eğik 2 http GET Ben Açısal Universal geri uç ve ön uç arasındaki iletişimi var kanıtlamak için bir POC yapıyorum 404

Question

döndürür. Ben arka uçtaModelService ön uç hizmeti almak istiyorum heroes.json adlı bir JSON dosyası var. Ben getStuff() denilen bir yöntemde bazı verileri almak için bir http isteği oluşturmak istiyorum

model.service.ts (ön uç) içinde:

Bu klasör yapısı var.

Ben model.service.ts içinde bu var: Bu hatayı alıyorum

export class HomeComponent { 

     public data: any = {}; 
     constructor(public modelService: ModelService) { 
     // we need the data synchronously for the client to set the server response 
     // we create another method so we have more control for testing 
     this.universalInit(); 
     } 

     public universalInit() { 

     this.modelService.getStuff().subscribe((data) => { 
      this.data = data; 
     }); 
     } 

: Ben ModelService.getHeroes arıyorum bir ön uç bileşeni itibaren

// domain/feature service 
@Injectable() 
export class ModelService { 
    private heroesUrl = "http://localhost:4000/src/backend/heroes.json"; // URL to JSON file 
    // This is only one example of one Model depending on your domain 
    constructor(public api: ApiService, public cacheService: CacheService, private http: Http) { 

    } 

    public getStuff(): Observable<any[]> { 
     return this.http.get(this.heroesUrl) 
        .map(this.extractData) 
        .catch(this.handleError); 
    } 

    private extractData(res: Response) { 
    let body = res.json(); 
    return body.data || { }; 
    } 

    private handleError (error: Response | any) { 
    // In a real world app, we might use a remote logging infrastructure 
    let errMsg: string; 
    if (error instanceof Response) { 
     const body = error.json() || ""; 
     const err = body.error || JSON.stringify(body); 
     errMsg = `${error.status} - ${error.statusText || ""} ${err}`; 
    } else { 
     errMsg = error.message ? error.message : error.toString(); 
    } 
    console.error(errMsg); 
    return Observable.throw(errMsg); 
    } 

    // domain/feature service 
    @Injectable() 
    export class ModelService { 
     private heroesUrl = "http://localhost:4000/src/backend/heroes.json"; // URL to JSON file 
     // This is only one example of one Model depending on your domain 
     constructor(public api: ApiService, public cacheService: CacheService, private http: Http) { 

     } 

     public getStuff(): Observable<any[]> { 
      return this.http.get(this.heroesUrl) 
         .map(this.extractData) 
         .catch(this.handleError); 
     } 

     private extractData(res: Response) { 
     let body = res.json(); 
     return body.data || { }; 
     } 

     private handleError (error: Response | any) { 
     // In a real world app, we might use a remote logging infrastructure 
     let errMsg: string; 
     if (error instanceof Response) { 
      const body = error.json() || ""; 
      const err = body.error || JSON.stringify(body); 
      errMsg = `${error.status} - ${error.statusText || ""} ${err}`; 
     } else { 
      errMsg = error.message ? error.message : error.toString(); 
     } 
     console.error(errMsg); 
     return Observable.throw(errMsg); 
     } 

GET /src/backend/heroes.json 404 3.698 ms - 46 
404 - {"status":404,"message":"No Content"} 
EXCEPTION: 404 - {"status":404,"message":"No Content"} 

/private/var/root/vepo/node_modules/rxjs/Subscriber.js:227 
      throw err; 
      ^
404 - {"status":404,"message":"No Content"} 
[nodemon] app crashed - waiting for file changes before starting... 

Yani hizmette benim url private heroesUrl = "http://localhost:4000/src/backend/heroes.json"; // URL to JSON file yanlıştır. Bu klasör yapısı göz önüne alındığında, url ne olurdu? Gerçek koşu projesi, çıktı, dist Çünkü:

Yani ModelService.heroesUrl ne koymak emin değilim. ModelService.heroesUrl hangi dize değerine sahip olmalı?

Answer 1

Eğer dist klasörü istemci içine json dosyası koymak zorunda ve http://localhost:4000/dist/heroes.json<-- destination where you are putting your json file in dist directory ben "assets" klasöre benim aynı dosyayı places.json koymak

Answer 2

ve sonra url değiştirmek zorunda set url gibi:

places = this.http.request("http://localhost:4200/assets/places.json") 

Bu bilgi birileri için yararlı olacaktır umuyoruz.