Question

我试图从Rest Api获取数据：

我试过以下：

var headers: Headers= new Headers({  'dataType': 'jsonp'});
    let options = new RequestOptions({ headers: headers });

    return this.http.get('http://aaaddds.de/redmine/issues.json?limit=1200&callback=JSONP_CALLBACK', options)
      .map(this.extractData);

因为以下原因无法正常工作：

 No 'Access-Control-Allow-Origin' header

所以当我尝试JSONP

时

let params = new URLSearchParams();
params.set('callback', 'JSONP_CALLBACK');
params.set('project_id', '7');
params.set('key', '42d3db30ab061a9f630df1f476c4d127f98d5ad2');
params.set('limit', '1200');


return this.jsonp.get('http://aaaddds.de/redmine/issues.json', { search: params })
  .map(this.extractData);

它说：

未捕获的ReferenceError：未定义__ng_jsonp____req0finished 注入JSONP的脚本没有调用回调

当我做一个Jquery ajax时，它可以运行：

   $.ajax({

      url: url,
      type: 'GET',
      dataType: 'jsonp',
      success: function (datsa: any) {
        console.log(datsa);
      },
      error: function (e : any) { alert(e.toString) },
    });

Answer 1

我认为您为回调提供的参数不是callback。实际上，此名称取决于目标服务，可以是callback，c或其他内容......

要诊断您的问题，您应该查看浏览器中devtools的“网络”选项卡，以查看响应的内容。它应该是这样的：

__ng_jsonp__.__req0.finished({ ... })

__ng_jsonp__.__req0是Angular2内部处理的回调的名称。

Answer 2

我解决了这个问题：设置一个变量：times

export class WikipediaService {
    constructor(private jsonp: Jsonp) {
        this.times=0;}
        search (term: string) {
        let wikiUrl = 'http://en.wikipedia.org/w/api.php';
        let params = new URLSearchParams();
        params.set('search', term); // the user's search value
        params.set('action', 'opensearch');
        params.set('format', 'json');
        params.set('callback', `__ng_jsonp__.__req${this.times}.finished`);
        this.times=this.times+1;
        // TODO: Add error handling
        return this.jsonp
        .get(wikiUrl, { search: params })
        .map(response => <string[]> response.json()[1]);
    }
}

Answer 3

this._InstUrl = "your url";

let params1 = new URLSearchParams();
//params.set('search', term); // the user's search value
//params.set('action', 'opensearch');
params1.set('format', 'json');
//params1.set('callback', "ng_jsonp.__req0.finished");
params1.set('callback', "JSONP_CALLBACK");

    return this._jsonp
        .get(this._InstUrl, { search: params1 })
        .map(response => { debugger; this.Result = response.json().data })
        .subscribe(
        (data) => {
            debugger
            console.log(this.Result);
        },
        (error) => {
            debugger
            console.log(error);
        });

这是一个100％工作的PLZ检查

注入JSONP的脚本没有调用回调

3 个答案: