Observable似乎不适用于Chrome 41

Question

我正在尝试使我的Angular 7应用程序正确地被Google抓取，但不幸的是，当我订阅它或尝试将其转换为承诺时，似乎使用HttpClient会产生一些麻烦。

使用HttpClient时，chrome 41会引发以下错误：

TypeError: Cannot read property 'call' of undefined {stack: (...), message: "Cannot read property 'call' of undefined"}
errors.ts:35defaultErrorLogger
error_handler.ts:51push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError
application_ref.ts:230next
event_emitter.ts:110push../node_modules/@angular/core/fesm5/core.js.EventEmitter.subscribe.schedulerFn
Subscriber.ts:266push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub
Subscriber.ts:208push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next
Subscriber.ts:140push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next
Subscriber.ts:100push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next
Subject.ts:71push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next
event_emitter.ts:92push../node_modules/@angular/core/fesm5/core.js.EventEmitter.emit
ng_zone.ts:296(anonymous function)
zone.js:391push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke
zone.js:150push../node_modules/zone.js/dist/zone.js.Zone.run
ng_zone.ts:218push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular
ng_zone.ts:296onHandleError
zone.js:395push../node_modules/zone.js/dist/zone.js.ZoneDelegate.handleError
zone.js:245push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask
zone.js:261push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask
zone.js:1194scheduleMacroTaskWithCurrentZone
zone.js:3371(anonymous function)
zone.js:1518push../node_modules/zone.js/dist/zone.js.proto.(anonymous function)
xhr.ts:319push../node_modules/@angular/common/fesm5/http.js.HttpXhrBackend.handle
Observable.ts:239push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe
Observable.ts:221push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe
subscribeToResult.ts:29subscribeToResult
mergeMap.ts:156push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._innerSub
mergeMap.ts:149push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._tryNext
mergeMap.ts:132push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._next
Subscriber.ts:100push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next
subscribeToArray.ts:11push../node_modules/rxjs/_esm5/internal/util/subscribeToArray.js.subscribeToArray
Observable.ts:239push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe
Observable.ts:221push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe
mergeMap.ts:111push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapOperator.call
Observable.ts:215push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe
filter.ts:72push../node_modules/rxjs/_esm5/internal/operators/filter.js.FilterOperator.call
Observable.ts:215push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe
map.ts:60push../node_modules/rxjs/_esm5/internal/operators/map.js.MapOperator.call
Observable.ts:215push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe
...
...
...

我做了一个简单的检查，取而代之的是：

  this.http.get(endpoint, this.requestHeaders).toPromise()

这样：

  this.http.get(endpoint, this.requestHeaders)

错误消失了，但我无法在水龙头内解决我的承诺，所以这对我来说并不是真的有用。知道出了什么问题吗？

Answer 1

我很确定你的订阅功能有不正确的参数..

它应该收到如下的功能。

return this.http.get(filename, {responseType: 'text'})
    .subscribe(
        data => { 
            this.log(filename, data);
        },
        error => { 
            this.logError(filename, error);
        });

更新：

请参阅Promise浏览器版本中caniuse.com的兼容性。根据这一点，Chrome 41不支持Promise类，仅支持Chrome 63。

另一点是，Chrome版本4-41也不支持ES6 classes。

Answer 2

我想到了。为了使这与chrome 41一起使用，我必须通过以下方式重写我的调用：

import {
    map,
    catchError
} from 'rxjs/operators'
import {throwError} from 'rxjs'

然后

 public fetch(): Promise<object> {
    const endpoint = `http://myendpoint`
    const headers = {}

    let result = this.http.get(endpoint, headers)
        .pipe(
                map((data: any) => {
                    return data;
                }),
                catchError((err: any) => {
                    return throwError(err);
                })
            )

        return new Promise((resolve, reject) => {
            result.subscribe((data) => {
                resolve(data)
            })
        });
}