Angular 9从起源'http：// localhost：4200'对“ my_api”处的XMLHttpRequest的访问已被CORS策略阻止：否'Access-Control-Allow-Origin

Question

我正在研究Angle 9以制作新闻应用程序。我正在使用印度时报RSS Feed API https://timesofindia.indiatimes.com

NOTE：我没有使用任何服务器。我只是使用angular 9发出请求，使用Times of India Api来获取我的json数据响应

/ rssfeedstopstories.cms？feedtype = sjson。获取JSON响应，我不知道哪里出了错，因为我对angular非常陌生

这是我的stackblitz链接https://stackblitz.com/github/mehulk05/Newsapp

当我从我的角度应用程序发出请求以获取数据时，它给了我错误

Access to XMLHttpRequest at 'https://timesofindia.indiatimes.com/rssfeedstopstories.cms?feedtype=sjson' 
from origin 'http://localhost:4200'
 has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

[当我复制此json数据并尝试从本地文件夹中获取它时，它成功给出了响应。此外，当我从邮递员发出请求时，我也在获取数据

这是我的代码

newsservice.ts

 getNewsList():Observable<any>{

    return this.http.get('https://timesofindia.indiatimes.com/rssfeedstopstories.cms?feedtype=sjson',
    { responseType: 'text' } )
  }

news-list.ts

ngOnInit() {
      this.ns.getNewsList().subscribe(data=>{
        console.log(data)
        err => {
          console.log(err);
        }
      })
    }

Answer 1

创建src / proxy.conf.json文件并添加以下内容：

{
"/api/*": {
    "target": "http://localhost:4200",
    "secure": false,
    "logLevel": "debug"
}
}

向proxy.json添加proxyConfig键

"architect": {
   "serve": {
    "builder": "@angular-devkit/build-angular:dev-server",
     "options": {
      "browserTarget": "your-application-name:build",
       "proxyConfig": "src/proxy.conf.json"
     },

确保运行ng serve命令。