2016-10-23 2 views
0

Я занимаюсь учебным пособием, и я должен получить список книг, чтобы отобразить его, но я получаю сообщение об ошибке «http://localhost:4200/api/books.json 404 (Not Found)».Angular on Rails API: HTTP-запрос

Console Error

Если я посещаю Localhost: 3000/API/books.json в моем браузере, я вижу посеяны информацию. Должно ли мое приложение пытаться использовать localhost: 3000 или он должен использовать localhost: 4200?

приложение/клиент/SRC/приложение/книга-лист/книга-список-component.ts

import { Component, OnInit } from '@angular/core'; 
import { Http } from '@angular/http'; 

@Component({ 
    selector: 'app-book-list', 
    templateUrl: './book-list.component.html', 
    styleUrls: ['./book-list.component.css'] 
}) 
export class BookListComponent implements OnInit { 
    books: any; 

    constructor(private http: Http) { } 

    ngOnInit() { 
    this.http.get('/api/books.json') 
     .subscribe(response => this.books = response.json()); 
    } 

} 

приложение/клиент/SRC/приложение/книга-лист/книга-список-компонент .html

<p> 
    book-list works! 
</p> 
<ul> 
    <li *ngFor="let book of books">{{ book.name }}</li> 
</ul> 

Вот остальная часть кода базы в случае, если вам нужно посмотреть на установке: https://github.com/theresaluu/tut-home-library-spike

ответ

1

Вы должны указать весь URL-адрес, если он находится в другом домене, но также вам необходимо включить CORS на сервере (подробнее о CORS здесь https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS). Угловой, вероятно, на другом сервере (я предполагаю, что вы начинаете его с ng-сервиса), и на этом сервере размещаются статические файлы + переписывание URL-адресов (если вы используете угловую стратегию HTML5), а сервер REST, который вы потребляете, находится на другом порт.

Это должно быть this.http.get('http://localhost:3000/api/books.json')

+0

указав весь URL сделал трюк! Уже обращался к CORS. Спасибо! –