angular2呼叫远程休息api

时间:2016-05-29 22:23:18

标签: api rest angular jsonp

我是Anuglar2的初学者。我不明白如何在Angular2中使用http或jsonp调用远程rest api。

我要调用的URI是

https://securedomain:8081/api/Authentication/AuthenticationQuery?strUserName={username}&strPassword={password}&dtLocal={timestamp}&bIsImpersonating=false&strTargetServerUri={TargetURI}&strDefaultCustomerDatabase={dbname}&strVersion=Angular2%201.0.0.0&strOriginatingPlatform=Angular2&strDeviceID={deviceID}

它可以在浏览器中打开以检查结果,它以XML格式显示

<AuthenticationResult xmlns:i="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://schemas.datacontract.org/2004/07/Test.WebAPI.Models">
<CustomerServerIPAddr/>
<ErrorMessage>null</ErrorMessage>
<ForceChangePassword>true</ForceChangePassword>
<PasswordRaw/>
<SessionID>00000000-0000-0000-0000-000000000000</SessionID>
</AuthenticationResult>

我正在尝试使用http来调用API

    let header = new Headers()
    header = new Headers();
    header.append('Content-Type', 'application/json');
    header.append('Access-Control-Allow-Credentials', 'true');
    header.append('Access-Control-Allow-Origin', '*');
this.http.get(fullURI, {header: header})
      .map(res => res.json() )
      .catch(this.handleError)
      .subscribe(function (res) {
          console.log(res)
        }
      );

但我收到了错误:

  

请求时没有'Access-Control-Allow-Origin'标头   资源。因此不允许来源“http://localhost:3000”   访问。

我检查网络标题: 请求:

Request Method:GET   
Status Code:200 OK
Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Host:securedomain:8081
Origin:http://localhost:3000
Referer:http://localhost:3000/
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36

但没有响应数据

当我使用jsonp调用API时

this.jsonp.get(fullURI)
      .map(res => res.json())
      .catch(this.handleError)
      .subscribe(function (res) {
          console.log(res)
        }
      );

我收到了错误:

  

Uncaught SyntaxError:意外的令牌:   ?AuthenticationQuery strUserName中=试验&安培; strPassword = 123&安培; dtLocal =二零一六年五月三十零日   09:45:36&安培; bIsImpersonating =假安培; ST ...:1

我检查网络标题: 请求:

Request Method:GET
Status Code:200 OK
Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Host:Host:securedomain:8081
Referer:http://localhost:3000/
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36

但不同的是,resopnse中有一些数据

{"CustomerServerIPAddr":"","PasswordRaw":"","SessionID":"00000000-0000-0000-0000-000000000000","ErrorMessage":"null","ForceChangePassword":true,"CustomerDatabase":""}

我想我应该使用JSONP来调用API,但我不知道为什么它在订阅数据时显示错误。

我发现了一些关于“jsonp回调”的问题,他们说响应格式应该像jsonp中的 call_back({data:data}) 。但我没有权限更改API来扭曲这样的数据。

请帮助我了解如何从Angular2中的远程API获取数据?

0 个答案:

没有答案