Angular6 配置代理

• 添加proxy.config.json

{
  "/api": {
    "target": "http://127.0.0.1:8080/",
    "logLevel": "debug",
    "changeOrigin": true,
    "pathRewrite": {
      "^/api": ""
    }
  }
}

• 配置package.json 使用npm start启动

"scripts": {
    "start": "ng serve --proxy-config proxy.conf.json --open"
}

• app.module.js添加HTTP模块

import { HttpClientModule } from '@angular/common/http' //引入HttpClientModule 模块
import { HttpClientModule } from '@angular/common/http' //引入HttpClientModule 模块
@NgModule({
  declarations: [
    AppComponent,
    HeroesComponent,
    HeroDetailComponent,
    MessagesComponent
  ],
  imports: [BrowserModule, FormsModule, HttpClientModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

• 具体组件引入HTTP

import { Component, OnInit } from '@angular/core'
import { HttpClient } from '@angular/common/http' //这里是HttpClient

@Component({
  selector: 'app-heroes',
  templateUrl: './heroes.component.html',
  styleUrls: ['./heroes.component.css']
})
export class HeroesComponent implements OnInit {

  constructor(private heroService: HeroService, private http: HttpClient) {}

  ngOnInit() {
    this.http.get('api/test/hello').subscribe(res => {
      console.log(res)
    })
  }
}