Angular 5:callbackParam在使用HTTPClient

时间:2018-04-26 07:31:26

标签: angular httpclient jsonp angular5

我认为HTTPClient jsonp方法的第二个参数不能按预期工作,或者我可能无法正确理解它。 Link

以下是我使用jsonp所做的事情:

我在app.module.ts中导入了 HttpClientJsonpModule 下面是它的代码

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule, HttpClientJsonpModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { ConstituencyStatusService } from './constituency-status.service';
import { SwitcherService } from './switcher.service'


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
   BrowserModule,
   HttpClientModule,
   HttpClientJsonpModule
  ],
  providers: [ConstituencyStatusService,SwitcherService,],
  bootstrap: [AppComponent]
})
export class AppModule { }

然后我尝试执行以下操作但得到错误

this.http.jsonp(url,'test_callback').subscribe(data => {
  console.log(data);
});

错误是ReferenceError:未定义test_callback

我的JSON输出是URL是:goo.gl/6fqXq5

test_callback({ "test_url_1": "url_1", "test_url_2": "url_2", "test_url_3": "url_3", "test_url_4": "url_4", "test_url_5": "url_5", "test_url_6": "url_6", "test_url_7": "url_7" })

我在网络标签中看到httpclient在网址后添加了?test_callback = ng_jsonp_callback_0

然后经过一些调试我尝试了这个json返回:goo.gl/cUwx93

ng_jsonp_callback_0({ "test_url_1": "url_1", "test_url_2": "url_2", "test_url_3": "url_3", "test_url_4": "url_4", "test_url_5": "url_5", "test_url_6": "url_6", "test_url_7": "url_7" })

它有效。

有人可以解释为什么它现在有效,我怎样才能将我的自定义回调函数名称传递给Angular 5中的jsonp。

1 个答案:

答案 0 :(得分:0)

请您显示url您传递给jsonp()的人吗?

作为noticed here(kcrisman评论),看起来你并不是唯一遇到此类问题的人。

如果您在请求中将回调名称指定为queryParam,则会损坏内容。不指定它,只将回调名称添加到jsonp()方法似乎有效。

您还可以查看line N°1124 of HttpClient以查看JSONP_CALLBACK的行为。