2017-02-20 9 views
5

8080 - Порт, где бэкенд размещается 4200 - мой Angular2 внешнего интерфейсаКонфигурация прокси не работает с угловой CLI

В моем проекте Angular2 у меня есть файл proxy.config.json с содержанием, как этот

{ 
    "/api": { 
    "target": "http://localhost:8080", 
    "secure": false, 
    "changeOrigin": "true", 
    "pathRewrite": {"^/api": ""} 
} 
} 

В Angular2 package.json Я изменил процедуру старта на "start": "ng serve --proxy-config proxy.config.json" Когда я печатаю внутри командира npm start, то в начале я вижу, что созданный прокси:/api ->http://localhost:8080. Ну, пока все хорошо, я думаю.

Я пытаюсь отправить запрос (Angular2)

constructor(private http: Http) { 
    this.getUsers(); 
    } 

    getUsers(): any { 
    return this.http.get("/api/getusers") 
     .subscribe(response => { 
     console.log(response); 
     }) 
    } 

я получаю сообщение об ошибке, что http://localhost:4200/api/getusers 404 (Not Found). Как мы видим, ничего не было проксировано. Зачем? Я сделал что-то не так?

Консоль вывода визуальной студии код

10% building modules 2/2 modules 0 active[HPM] Proxy created: /api/ -> http://localhost:8080 
[HPM] Proxy rewrite rule created: "^/api" ~> "" 
[HPM] Subscribed to http-proxy events: [ 'error', 'close' ] 
Hash: d102bcd0909a1776c844 
Time: 27041ms 
chunk {0} main.bundle.js, main.bundle.map (main) 13.6 kB {2} [initial] [rendered] 
chunk {1} styles.bundle.js, styles.bundle.map (styles) 130 kB {3} [initial] [rendered] 
chunk {2} vendor.bundle.js, vendor.bundle.map (vendor) 3.87 MB [initial] [rendered] 
chunk {3} inline.bundle.js, inline.bundle.map (inline) 0 bytes [entry] [rendered] 
webpack: Compiled successfully. 
[HPM] Rewriting path from "/api/getusers" to "/getusers" 
[HPM] GET /api/getusers ~> http://localhost:8080 

Это браузер ответ консоль:

GET http://localhost:4200/api/getusers 404 (Not Found) 
error_handler.js:54 EXCEPTION: Response with status: 404 Not Found for URL: http://localhost:4200/api/getusers 
Subscriber.js:238 Uncaught Response {_body: "<html><head><title>Apache Tomcat/7.0.47 - Error re…hade"><h3>Apache Tomcat/7.0.47</h3></body></html>", status: 404, ok: false, statusText: "Not Found", headers: Headers…} 
+0

вы пытались с полной URL HTTP:// localhost: 4200/api/getusers вместо/api/getusers – IsuruAb

+0

мой бэкенд размещен на localhost: 8080/api, поэтому я использую настройки прокси, а localhost: 8080/api/getusers работают нормально. –

+0

Что такое консольный выход? – IsuruAb

ответ

2

Я попробовал этот путь. мой файл proxy.conf.json как это:

{ 
    "/api": { 
    "target": "http://localhost:8080", 
    "secure": false, 
    "changeOrigin": "true", 
    "pathRewrite": {"^/api": ""} 
    } 
} 

и я заменил "start": "ng serve" с этим "start": "ng serve --proxy-config proxy.conf.json" в package.json

мой файл app.component.ts как это:

constructor(private http: Http) { 
    this.getUsers(); 
    } 

    getUsers(): any { 
    return this.http.get("http://localhost:4200/api/getusers") 
     .subscribe(response => { 
     console.log(response); 

     }) 
    } 

в моем API он предоставляет набор пользователей из http://localhost:8080/getusers URL

+1

Он работает хорошо. –

 Смежные вопросы

  • Нет связанных вопросов^_^