【问题标题】:Add Header to the API Http request, Angular 2, Ionic 2将标头添加到 API Http 请求,Angular 2,Ionic 2
【发布时间】:2016-10-16 22:52:28
【问题描述】:

我有一个 ionic 2 应用程序(它使用 Angular 2 Http),我有从 API 获取 JSON 的代码,但是我需要发送 app-id、app-key 和 Accept 作为标头,这是主要代码...

import {Component} from '@angular/core';
import {NavController} from 'ionic-angular';
import {Http} from 'angular2/http';

@Component({
templateUrl: 'build/pages/latest-page/latest-page.html'
 })
 export class LatestPage {
 static get parameters() {
 return [[NavController]];
}

constructor(_navController, http) {

this._navControler = _navController;
this.http = http;

this.http.get("https://twit.tv/api/v1.0/people/77").subscribe(data => {
 console.log("Got Data");
 this.items = JSON.parse(data._body).people;
}, error => {
 console.log("Error with Data");
});

 }

这就是我尝试添加标题的方式,但是它不起作用...

constructor(_navController, http) {

this._navControler = _navController;
this.http = http;

var headers = new Headers();
headers.append('app-id', '0000');
headers.append('app-key', 'abc000abc');
headers.append('Accept', 'application/json ');

this.http.get("https://twit.tv/api/v1.0/people/77"),{"Headers": headers}.subscribe (data => {
console.log("Got Data");
this.items = JSON.parse(data._body).people;
}, error => {
 console.log("Error with Data");
});

 }

有什么想法吗?

谢谢

【问题讨论】:

    标签: json api ionic-framework angular


    【解决方案1】:

    Headers必须在RequestOptions里面设置,也就是第二个参数http.get()

    此外,您的代码中有语法错误。请求选项是.get(url, {})的第二个参数,你这样写:.get(url),{}

    this.http.get("https://twit.tv/api/v1.0/people/77",{"Headers": headers}).subscribe (data => {
    console.log("Got Data");
    this.items = JSON.parse(data._body).people;
    }, error => {
     console.log("Error with Data");
    });

    创建明确的请求选项。

    let opt: RequestOptions
    let myHeaders: Headers = new Headers
    myHeaders.set('Content-type', 'application/json')
    opt = new RequestOptions({
      headers: myHeaders
    })
    
    _http.get(url, opt).

    经过一些误解,我将在这里留下你自己的代码和我的建议:

    constructor(_navController, http) {
     
    /*this isn't necessary, _navController and http are already available for "this. "*/
       this._navControler = _navController;  
       this.http = http;
     
       let opt: RequestOptions
       let myHeaders: Headers = new Headers
       myHeaders.set('app-id', 'c2549df0');
       myHeaders.append('app-key', 'a2d31ce2ecb3c46739b7b0ebb1b45a8b');
       myHeaders.append('Content-type', 'application/json')
       
       opt = new RequestOptions({
         headers: myHeaders
        })   
       
       this.http.get("https://twit.tv/api/v1.0/people/77",opt).subscribe (data => {
         console.log("Got Data");
         this.items = JSON.parse(data._body).people;
       
      }, error => {
        console.log("Error with Data");
      });
    
    }

    【讨论】:

    • 所以要添加三个标题,我做 myHeaders.set('Content-type', 'application/json') 行三次?
    • 我得到这个... SyntaxError: /Users/Carl/TwitCasts/app/pages/latest-page/latest-page.js: Unexpected token (18:10) while parsing file: /Users /Carl/TwitCasts/app/pages/latest-page/latest-page.js
    • 添加多个标题使用 headers.append()
    • myHeaders.append ??或者只是 headers.append
    • 这是原来的错误吗?正如我所提到的,您的 sn-p 中有语法错误。你纠正了吗?
    猜你喜欢
    • 1970-01-01
    • 2017-01-02
    • 2016-11-13
    • 2016-12-11
    • 1970-01-01
    • 2017-02-15
    • 1970-01-01
    • 2012-12-01
    • 2018-05-04
    相关资源
    最近更新 更多