从Angular 2中调用WCF Service

本文关键字:WCF Service 调用 Angular | 更新日期: 2023-09-27 18:08:54

我正在从Angular 2的一个服务(文件名为app.service.ts)中调用一个Web Api方法。它返回数据,我可以将这些数据绑定到我的页面。

现在我想从Angular 2的服务(名为app.service.ts的文件)中调用WCF服务。我已经对Web Api做了同样的尝试。但是它会导致Allow-Access-Origin错误。我也传递头来解决它。但问题仍然存在。

  import {Http,Response,Headers,RequestOptions} from "@angular/http"
  import { Observable } from 'rxjs/Rx';
  @Injectable()
  export class HeroService {
  Hero = [];
   baseUrl = 'http://192.168.0.4/ITM1.3/Service1.svc/Delete502/';
   constructor(private _http: Http) {
        this.loadHeroes();
   }
   loadHeroes() {
   let headers = new Headers({ 'Content-Type': 'application/json' },{'Access-Control-Allow-Origin' : '*'},{'Access-Control-Allow-Methods' : 'POST, GET, OPTIONS, PUT, DELETE'});
   let options = new RequestOptions({ headers: headers });
   return this._http.get(this.baseUrl+"Login/harshad.bhola@etatvasoft.com1/1",options)
                    .map((response: Response) => {
                        console.log(reponse);
                        let heroData = response.json();
                        return heroData;
                    })
                    .do(data => console.log(data))
                    .catch(this.handleError);
   }
}

我还准备了一个http-client类(组件),用于传递请求头,但仍然发生相同的错误。

那么谁能确切地解释一下我如何调用WCF服务并从中获取数据?

从Angular 2中调用WCF Service

Access-Control-Allow-Origin是响应头,而不是请求头。您需要将WCF配置为使用您试图从中访问它的域的Access-Control-Allow-Origin标头集进行响应。请注意,Access-Control-Allow-Origin不是服务器端安全机制。因此,如果需要的话,您仍然需要添加适当的身份验证和授权。

关于如何做到这一点的有用答案可以在这里找到。