angular的跨域

1.在根目錄下建立一個proxy.config.json文件

proxy.config.json

{

    "/api":{

        "target":"http://192.168.1.116:3000/mock/41",//你所要跨域的地址

        "secure":false,//是否開啓跨域保護 https的時候 使用該參數

        "logLevel":"debug",//日誌級別的調試

        "changeOrigin":true,//是否跨域

        "pathRewirte":{//重寫路徑

            "^/api":""

        }

    }

}

 

2.在package,json文件中配置或是在angular.json文件中配置

packae.json

在"scripts"中的"start"的值後面加

--proxy-config proxy.config.json

在angular.json中的"serve"下的"options"下加

"proxyConfig":proxy.config.json,

」disableHostCheck「:true

 

3.在app.module.ts中引入

import { HttpClientModule } from '@angular/common/http'

在imports中注入

imports:[

　　HttpClientModule

]

 

4.在組件的 組件.component.ts中引入http

import {HttpClient} from '@angular/common/http'

在contructor中聲明

constructor(private http:HttClient){

}

在ngOnInit生命週期使用

例如

contructor(private http:HttpClient){}

ngOnInit(){

　　let url = '/api/files';

　　this.http.get(url).subscribe((data:any)=>{

　　　　console.log(data);//data就是獲取過來的數據

　　})

}