Разместил файлы Angular-2 на хостинге не работает http://localhost (json server)
Всем привет!
Разместил проект по Angular 2 на сайте. Репозиторий проекта на GitHub: https://github.com/freestyle2018/angular-ivan
"scripts": {
"server": "json-server --watch file.json --port 3000",
"start": "concurrently --kill-others \"ng serve\" \"npm run server\""
},
На localhost все прекрасно отрабатывает Json Server. После выполнения команды "ng build" программа генерирует файлы в папку dist, которые можно залить на сайт. document.service.ts
getDocument(): Observable<Document[]> {
return this.http.get<Document[]>(`http://localhost:3000/documents`);
}
addDocument(document: Document, max_id, today) {
const body = {id: max_id, name: document.name, text: today, autor: document.autor};
return this.http.post(`http://localhost:3000/documents`, body);
}
deleteDocument(document: Document) {
const body = {id: document.id, name: document.name, text: document.text, autor: document.autor};
return this.http.delete(`http://localhost:3000/documents/`+ document.id);
}
updateDocument(document: Document) {
const body = {id: document.id, name: document.name, text: document.text, autor: document.autor};
return this.http.put(`http://localhost:3000/documents/`+ document.id, body);
}
сам file.json
{
"documents": [
{
"id": 478,
"name": "Букварь вер",
"text": 1517577886502,
"autor": "Сергей Лимонов"
},
{
"id": 498,
"name": "Документ",
"text": 1517577886502,
"autor": "Влада Комкова"
},
{
"id": 501,
"name": "Документ",
"text": 1517577886502,
"autor": "Иван Пономаренко"
},
{
"id": 505,
"name": "Мостовой кран",
"text": 1517765343574,
"autor": "Дмитрий Хрусталев"
}
]
}
---------------------------------- На самом хостинге Get запрос отрабатывает поскольку несколько изменил код: 1.
[{
"id": 478,
"name": "Букварь вер",
"text": 1517577886502,
"autor": "Сергей Лимонов"
},
{
"id": 498,
"name": "Документ",
"text": 1517577886502,
"autor": "Влада Комкова"
},
{
"id": 501,
"name": "Документ",
"text": 1517577886502,
"autor": "Иван Пономаренко"
},
{
"id": 505,
"name": "Мостовой кран",
"text": 1517765343574,
"autor": "Дмитрий Хрусталев"
}]
main.bundle.js
DocumentService.prototype.getDocument = function () {
return this.http.get("file.json");
};
Большая просьба, подскажите, как сделать, что на отработал Json Server? |
import 'rxjs/add/operator/map';
...
return this.http.get("file.json").map(response => response['documents'])
|
Спасибо за оперативный ответ!
Большая просьба подскажи, как заменить эти строки кода:
DocumentService.prototype.addDocument = function (document, max_id, today) {
var body = { id: max_id, name: document.name, text: today, autor: document.autor };
return this.http.post("http://localhost:3000/documents", body);
};
и
DocumentService.prototype.deleteDocument = function (document) {
var body = { id: document.id, name: document.name, text: document.text, autor: document.autor };
return this.http.delete("http://localhost:3000/documents/" + document.id);
};
Пробовал в первом случае вставить код:
return this.http.post("file.json").map(response => response['documents']).subscribe(data => this.body=data);
Но не отрабатывает. Мучался полдня. Я в Angular 4 новичок. Буду очень признателен за помощь. |
Иван2017,
Чтобы делать put, post, delete запросы нужно либо ставить на хостинг node.js и поднимать также json-server, либо использовать сторонние сервисы. Как видите, json-server под капотом поднимает express-сервер, и создает middleware для ключей в файле json. |
| Часовой пояс GMT +3, время: 06:40. |