角度5中的发布错误No＆＃39; Access-Control-Allow-Origin＆＃39;标头出现在请求的资源上。

Question

当我尝试使用rest方法（post）时，我在角度5中收到此错误：

对预检请求的响应没有通过访问控制检查：否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。起源＆＃39; http://localhost:4200＆＃39;因此不允许访问。

这是服务：

＆＃13;

＆＃13;

import {Injectable} from '@angular/core';
import {HttpClient, HttpHeaders} from '@angular/common/http';
import {Observable} from 'rxjs/Rx';

@Injectable()
export class ImageProvider{
    public url: string;
    
    constructor( public http: HttpClient){

        this.url='https://api.flickr.com/services/feeds/photos_public.gne?format=json&nojsoncallback=1&tags=?';
    }
    
    getImages(): Observable<any>{
                 
    
            let params = 'format=json&nojsoncallback=1&tags=?';     
                    
            let headers = new HttpHeaders().set('Content-Type','application/x-www-form-urlencoded');
             
            return this.http.post(this.url+'productos', params, {headers: headers});
    }
}

＆＃13;

＆＃13;

＆＃13;

这是组件

＆＃13;

＆＃13;

import { Component, OnInit } from '@angular/core';
import {ImageProvider} from '../../services/imageProvider';

@Component({
  selector: 'app-carousel',
  templateUrl: './carousel.component.html',
  styleUrls: ['./carousel.component.css']
})
export class CarouselComponent implements OnInit {
  public responseFlirck
  constructor(private _imageProvider: ImageProvider) { }

  ngOnInit() {
  
    this.getImagesFromFlirk();
  }


  getImagesFromFlirk(){

    this._imageProvider.getImages().subscribe(
      result => {  
        
          this.responseFlirck = result.data;
         
      },
      error => {
          console.log('Error in post');
          console.log(error);
      }
  );
  }

}

＆＃13;

＆＃13;

＆＃13;

然而，在肥皂用户界面工作正常：

有人可以修改我的代码吗？

非常感谢！

Answer 1

jonrsharpe是对的，你需要启用CORS但是如果你需要一个非常快速的临时解决方案？

例如，您需要提供演示文稿，您可以下载此Chrome扩展程序。 https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?utm_source=chrome-ntp-icon