Angularfire的Angular / Ionic:iOS:阻止了源为“ http:// localhost:8100”的框架

时间:2019-07-08 14:22:18

标签: angular firebase ionic3 angularfire2 angularfire

这个Ionic3(Angular 5)项目必须从旧的AngularFire 3.x升级到“ @ angular / fire”:“ ^ 5.2.1”; 由于该错误,使用设置为iPhone / iPad的“设备模式”在Chrome中运行应用程序时,会发生奇怪的行为。在Android模拟中不会发生。在某个时候(我无法确定),angularfire(我猜是吗?)似乎在body元素中添加了一个iframe:

"  C:\Users\<My User Name>\AppData\Local\Apps\2.0\MyFolder\MyFolder2\MyFolder3\ "

即使这在firebaseapp.com子域上完美运行,但localhost(在cordova中使用)仅在iOS上遇到以下问题(不是android,不是chrome)...

欢迎任何建议,这是第二天进行故障排除..!预先感谢。

一些晦涩的堆栈表明core.js:1449出现错误:

<iframe ng-non-bindable="" frameborder="0" hspace="0" marginheight="0" marginwidth="0" scrolling="no" tabindex="0" vspace="0" width="100%" 
    id="I0_1562593422051"
    name="I0_1562593422051" 
    src="https://XXXXXXXXX.firebaseapp.com/__/auth/iframe?apiKey=YYYYYYYYYYYYYY&amp;appName=ZZZZZZZZZZZZZZZ&amp;v=6.2.4&amp;usegapi=1&amp;jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.en_GB.4xsMIUspm18.O%2Fam%3DwQE%2Fd%3D1%2Frs%3DAGLTcCO_dMVTlnY55ZJNnloXSQJ2GsU_yw%2Fm%3D__features__#id=I0_1562593422051&amp;_gfid=I0_1562593422051&amp;parent=http%3A%2F%2Flocalhost%3A8100&amp;pfname=&amp;rpctoken=33463188" style="position: absolute; top: -100px; width: 1px; height: 1px;"></iframe>

我的package.json依赖项:

core.js:1449 ERROR DOMException: Blocked a frame with origin "http://localhost:8100" from accessing a cross-origin frame.
    at e (<anonymous>:1:62513)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63249)
    at e (<anonymous>:1:63075)
defaultErrorLogger  @   core.js:1449
ErrorHandler.handleError    @   core.js:1510
IonicErrorHandler.handleError   @   ionic-error-handler.js:61
next    @   core.js:5508
schedulerFn @   core.js:4342
SafeSubscriber.__tryOrUnsub @   Subscriber.js:253
SafeSubscriber.next @   Subscriber.js:191
Subscriber._next    @   Subscriber.js:129
Subscriber.next @   Subscriber.js:93
Subject.next    @   Subject.js:53
EventEmitter.emit   @   core.js:4322
(anonymous) @   core.js:4782
t.invoke    @   polyfills.js:3
r.run   @   polyfills.js:3
NgZone.runOutsideAngular    @   core.js:4708
onHandleError   @   core.js:4782
t.handleError   @   polyfills.js:3
r.runTask   @   polyfills.js:3
e.invokeTask    @   polyfills.js:3
i.isUsingGlobalCallback.invoke  @   polyfills.js:3
n   @   polyfills.js:3
setTimeout (async)      
o   @   polyfills.js:3
t.scheduleTask  @   polyfills.js:3
onScheduleTask  @   polyfills.js:3
t.scheduleTask  @   polyfills.js:3
r.scheduleTask  @   polyfills.js:3
r.scheduleMacroTask @   polyfills.js:3
(anonymous) @   polyfills.js:3
o.<computed>    @   polyfills.js:2
hostReportError @   hostReportError.js:8
setTimeout (async)      
o   @   polyfills.js:3
t.scheduleTask  @   polyfills.js:3
r.scheduleTask  @   polyfills.js:3
r.scheduleMacroTask @   polyfills.js:3
(anonymous) @   polyfills.js:3
o.<computed>    @   polyfills.js:2
AsyncObserver.scheduleEvent @   index.cjs.js:18817
AsyncObserver.next  @   index.cjs.js:18806
QueryListener.raiseInitialEvent @   index.cjs.js:16065
QueryListener.onViewSnapshot    @   index.cjs.js:16007
EventManager.onWatchChange  @   index.cjs.js:15944
(anonymous) @   index.cjs.js:16653
step    @   tslib.es6.js:99
(anonymous) @   tslib.es6.js:80
fulfilled   @   tslib.es6.js:70
t.invoke    @   polyfills.js:3
r.run   @   polyfills.js:3
(anonymous) @   polyfills.js:3
t.invokeTask    @   polyfills.js:3
r.runTask   @   polyfills.js:3
o   @   polyfills.js:3
e.invokeTask    @   polyfills.js:3
p   @   polyfills.js:2
v   @   polyfills.js:2

1 个答案:

答案 0 :(得分:0)

它与Chrome-桌面版有关。 W10和Mac在“设备模式”,模拟和iOS设备中的行为相同。当愿意监视服务器端筛选的集合时,如果执行1个或多个.stateChange调用,就会发生这种情况。随机发生-在单独的沙箱中测试。 如建议的那样,这在iOS的实际Safari上不会发生。甚至iOS版Chrome的表现也不错,因此可以将这个问题视为“与开发环境相关联”。