You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Angular应用嵌入React应用时a11y.es5.js相关报错排查

背景

我们开发了一款支持嵌入第三方网站的Angular应用,构建时会将所有输出的JS bundle合并为单个JS文件。接入方仅需在页面中通过script标签引入该JS文件,再在body节点内添加匹配应用主组件选择器的自定义元素即可完成嵌入。过去几年间,该嵌入方案在所有接入的页面、应用中均运行正常。

问题描述

近期我们尝试将该Angular应用嵌入React应用时,抛出了多个与a11y.es5.js文件相关的错误。

第一个错误发生在a11y.es5.js中,从调用链路来看由RxJs依赖触发,错误信息与调用栈如下:

ERROR TypeError: Cannot read properties of undefined (reading 'addEventListener')
  at _global.<computed>.<computed> [as addEventListener) (ally.es5.js:1847:1)
  at Observable._subscribe (compiler..js:9840:16)
  at webpackJsonp../node_modules/rxjs/_esm5/Observable.js.Observable._trySubscribe (pairwise.js 620)
  at webpackJsonp../node_modules/rxjs/_esm5/Observable.js.Observable.subscribe (onErrorResumeNext.js:137:1)
  at subscribeToResult (timeoutWith.js:9:1)
  at webpackJsonp../node_modules/rxjs/_esm5/operators/mergeMap.js.MergeMapSubscriber._innerSub (IntervalObservable.js:1:14)
  at webpackJsonp../node_modules/rxjs/_esm5/operators/mergeMap.js.MergeMapSubscriber._tryNext (embed.bundle.js:181269:14)
  at webpackJsonp../node_modules/rxjs/_esm5/operators/mergeMap.js.MergeMapSubscriber_.next (IfObservable.js:49:1)
  ...
  at webpackJsonp../node_modules/rxjs/_esm5/Observable.js.Observable.subscribe (onErrorResumeNext.js:137: 1)
  at webpackJsonp../node_modules/@ngx-translate/core/src/translate.service.js.TranslateService.getTranslation (core.js:47:1)
  at webpackJsonp../node_modules/@ngx-translate/core/src/translate.service.js.TranslateService.retrieveTranslations (core.js:31:1)
  at webpackJsonp../node_modules/@ngx-translate/core/src/translate.service.js.TranslateService.use (core.js:4:1)
  at webpackJsonp../src/app/components/embed-main/embed-main.component.ts.EmbedMainComponent.initLang (main.ts:109:2) 
  at webpackJsonp../src/app/components/embed-main/embed-main.component.ts.EmbedMainComponent.ngOnInit (main.ts:109:2)
  at checkAndUpdateDirectiveInline (forms.js:6068:1)
  at checkAndUpdateNodeInline (forms.js:7595:1)
  at checkAndUpdateNode (forms.js:7538:1)
  at debugCheckAndUpdateNode (autocomplete.es5.js:212:18)
  at debugCheckDirectivesFn (autocomplete.es5.js:153:1)
  at Object.eval [as updateDirectives] (EmbedMainComponentt.ngfactory.js:21:5)
  at Object.debugUpdateDirectives [as updateDirectives] (autocomplete.es5js:138:1)
  at checkAndupdateView (forms.js.7504:1)
  at callWithDebugContext (autocomplete.es5.js:539:1)
  at Object.debugCheckAndupdateView [as checkAndUpdateView] (autocomplete.es5.js:76:1)
  at webpackJsonp../node_modules/@angular/core/esm5/core.js.ViewRef_.detectChanges (forms.js:5272:1)
  at core.js:16520:1
  at Array.forEach (<anonymous>)
  at webpackJsonp../node_modules/@angular/core/esm5/core.js.ApplicationRef.tick (core.js:16520:1)
  at webpackJsonp../node_modules/@angular/core/esm5/core.js.ApplicationRef._loadComponent (core.js:16586:1)
  at webpackJsonp../node_modules/@angular/core/esm5/core.js.ApplicationRef.bootstrap (core.js:16474:1)

第二个错误发生在Google Maps Javascript文件中,从调用链路来看由a11y.es5.js文件内的逻辑异常触发,错误信息与调用栈如下:

Unhandled Promise rejection: Cannot read properties of undefined (reading 'l') : Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read properties of undefined (reading "l")
  at js?key=abc:199:85
  at webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (ally.es5.js:871:17)
  at webpackJsonp../node_modules/zone.js/dist/zone.js.Zone.run (ally.es5.js:631:1)
  at ally.es5.js:1295:17
  at webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke Task (ally.es5.js:904:13)
  at webpackJsonp../node_modules/zone.js/dist/zone.js.Zone.runTask (ally.es5.js:671:1)
  at drainMicroTaskQueue (ally.es5.js:1064:1)
  at z (<anonymous>:55:81) TypeError: Cannot read properties of undefined (reading 'l')
  at https://maps.googleapis.com/maps/api/?key=abc:199:85
  at webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (https://ourproducthost/embed.bundle.js:8809:26)
  at webpackJsonp../node_modules/zone.js/dist/zone.js.Zone.run (https://ourproducthost/embed.bundle.js:8569:43)
  at https://ourproducthost/embed.bundle.js:9233:57
  at webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke Task (https://ourproducthost/embed.bundle.js:8842:31)
  at webpackJsonp../node_modules/zone.js/dist/zone.js.Zone.runTask (https://ourproducthost/embed. bundle.js:8609:47)
  at drainMicroTaskQueue (https://ourproducthost/embed.bundle.js:9002:35)
  at z (<anonymous>:55:81)

内容的提问来源于stack exchange,提问作者Aaron T

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.29 04:57:07