Angular 2：JSONP 请求给出异常：状态响应：200 Ok URL

Question

我正在尝试使用 Angular 2 进行 JSONP 调用，并遵循 post 中提到的所有内容：

这是我的service.ts:

import { Injectable } from '@angular/core';
import { Http, Jsonp } from '@angular/http'
import 'rxjs';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class DataLoadService {
    private quoteApiUrl: string;
    constructor(private http: Http, private jsonp: Jsonp) { 
                    this.quoteApiUrl = `http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&jsonp=parseQuote&lang=en&callback=JSONP_CALLBACK`;
                }

    getQuotes(): Observable<any>{
        return this.jsonp.get(this.quoteApiUrl)
            .map(function(res){
                return res.json() || {};
            })
            .catch(function(error: any){
                return Observable.throw(error);
            });
    }
}

这就是我从 home.ts:

中调用 getQuotes() 方法的方式

 this.dataLoadService.getQuotes()
      .subscribe(data => {
        console.log(data);
        this.quotes.push(data);
      });

这是一个 JSONP 调用，我在 API.

的末尾添加了：&callback=JSONP_CALLBACK

调用服务时，我确实得到了有效的 JSON 响应，如 Chrome 的开发人员工具 > 网络 > 响应选项卡中所示：

parseQuote({"quoteText":"A failure is a man who has blundered but is not capable of cashing in on the experience. ", "quoteAuthor":"Elbert Hubbard", "senderName":"", "senderLink":"", "quoteLink":"http://forismatic.com/en/d74d7833cb/"})

但我也遇到以下错误：

未捕获的 ReferenceError：未定义 parseQuote
异常：状态响应：200 URL 正常： http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&jsonp=parseQuote&lang=en&parseQuote=ng_jsonp.__req0.finished

请指教。我正在使用 angular v2.2.1.

Answer 1

您的代码没有任何问题，问题出在您提供的 api 端点 url 上。显然它没有在 callback 参数中使用回调函数名称，而是在 jsonp 参数中使用回调函数名称。

用这个替换你的 url，它应该可以正常工作：http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&jsonp=JSONP_CALLBACK&lang=en

Angular 2：JSONP 请求给出异常：状态响应：200 Ok URL

Angular 2: JSONP request giving EXCEPTION: Response with status: 200 Ok for URL

jsonp

angular