如何测试跨域违规？

编程问答 2022-12-23

问题描述

我正在开发一个包含在 iframe 中的小部件，有几次我碰巧部署了我的项目并在生产中意识到它无法正常工作，因为我违反了跨域策略。在本地我没有问题，因为我的主机页面和 iframe 的内容来自同一个域 (http://localhost:3000/)。

在 Cypress 中复制

现在我想设置一个测试，我的主机页面从 http://localhost:3000/ 提供，我的 iframe 内容从 http://localhost:1234/ 提供，这样我就可以有一个类似于生产的设置。>

但是，当我使用 cypress-iframe 为此编写测试时，我从 cypress-iframe 本身获得了一个跨域策略：

阻止源为“http://localhost:3000”的框架访问跨源框架。

node_modules/cypress-iframe/dist/index.js:97:40

   95 |                                 : (_a = fullOpts.url) === null || _a === void 0 ? void 0 : _a.test(contentwindow.location.toString());
   96 |                         }
>  97 |                         : function () { return contentwindow.location.toString() !== 'about:blank'; };
      |                                        ^
   98 |                     _c.label = 1;
   99 |                 case 1:
  100 |                     if (!!hasNavigated()) return [3,3];

完整堆栈跟踪

react_devtools_backend.js:2560 SecurityError: Blocked a frame with origin "http://localhost:3000" from accessing a cross-origin frame.
    at hasNavigated (http://localhost:3000/__cypress/tests?p=cypress/integration/theme_04/cross-origin-in-iframe.spec.js:249:71)
    at Object.eval (http://localhost:3000/__cypress/tests?p=cypress/integration/theme_04/cross-origin-in-iframe.spec.js:252:27)
    at step (http://localhost:3000/__cypress/tests?p=cypress/integration/theme_04/cross-origin-in-iframe.spec.js:195:23)
    at Object.eval [as next] (http://localhost:3000/__cypress/tests?p=cypress/integration/theme_04/cross-origin-in-iframe.spec.js:176:53)
    at eval (http://localhost:3000/__cypress/tests?p=cypress/integration/theme_04/cross-origin-in-iframe.spec.js:170:71)
    at new Promise (<anonymous>)
    at ./node_modules/cypress-iframe/dist/index.js.__awaiter (http://localhost:3000/__cypress/tests?p=cypress/integration/theme_04/cross-origin-in-iframe.spec.js:166:12)
    at Context.eval (http://localhost:3000/__cypress/tests?p=cypress/integration/theme_04/cross-origin-in-iframe.spec.js:231:108)
From prevIoUs event:
    at Context.thenFn (http://localhost:3000/__cypress/runner/cypress_runner.js:136206:23)
    at Context.then (http://localhost:3000/__cypress/runner/cypress_runner.js:136645:21)
    at Context.<anonymous> (http://localhost:3000/__cypress/runner/cypress_runner.js:151764:21)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:151172:15
From prevIoUs event:
    at runcommand (http://localhost:3000/__cypress/runner/cypress_runner.js:151151:8)
    at next (http://localhost:3000/__cypress/runner/cypress_runner.js:151297:14)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:151325:16
From prevIoUs event:
    at next (http://localhost:3000/__cypress/runner/cypress_runner.js:151297:34)
From prevIoUs event:
    at http://localhost:3000/__cypress/runner/cypress_runner.js:151338:37
From prevIoUs event:
    at run (http://localhost:3000/__cypress/runner/cypress_runner.js:151331:21)
    at $Cy.cy.<computed> [as visitWithMock] (http://localhost:3000/__cypress/runner/cypress_runner.js:151804:11)
    at Context.runnable.fn (http://localhost:3000/__cypress/runner/cypress_runner.js:152028:21)
    at callFn (http://localhost:3000/__cypress/runner/cypress_runner.js:107792:21)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:158033:28
From prevIoUs event:
    at Object.onRunnableRun (http://localhost:3000/__cypress/runner/cypress_runner.js:158021:17)
    at $Cypress.action (http://localhost:3000/__cypress/runner/cypress_runner.js:148112:28)
    at Test.Runnable.run (http://localhost:3000/__cypress/runner/cypress_runner.js:156163:13)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:108577:12
    at next (http://localhost:3000/__cypress/runner/cypress_runner.js:108360:14)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:108370:7
    at next (http://localhost:3000/__cypress/runner/cypress_runner.js:108272:14)
    at Hook.<anonymous> (http://localhost:3000/__cypress/runner/cypress_runner.js:108333:7)
    at next (http://localhost:3000/__cypress/runner/cypress_runner.js:157949:22)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:157976:11
From prevIoUs event:
    at onNext (http://localhost:3000/__cypress/runner/cypress_runner.js:157973:57)
    at done (http://localhost:3000/__cypress/runner/cypress_runner.js:107732:5)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:107797:11
From prevIoUs event:
    at callFn (http://localhost:3000/__cypress/runner/cypress_runner.js:107795:14)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:158033:28
From prevIoUs event:
    at Object.onRunnableRun (http://localhost:3000/__cypress/runner/cypress_runner.js:158021:17)
    at $Cypress.action (http://localhost:3000/__cypress/runner/cypress_runner.js:148112:28)
    at Hook.Runnable.run (http://localhost:3000/__cypress/runner/cypress_runner.js:156163:13)
    at next (http://localhost:3000/__cypress/runner/cypress_runner.js:108294:10)
    at http://localhost:3000/__cypress/runner/cypress_runner.js:108338:5
    at timeslice (http://localhost:3000/__cypress/runner/cypress_runner.js:102264:27)

问题

{chromeWebSecurity: false} 中的设置 cypress.json 修复了来自 cypress-iframe 的问题，也修复了我试图重现的问题（来自我的代码的跨域违规）。

有没有办法做到这一点？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

automated-testscross-domaincypressend-to-endiframeiframe