Я добавляю страницу оплаты Authorize.Net Accept Payment в приложение Ionic 3 с помощью Iframe. Iframe должен содержаться на размещенной (не локальной) странице.
Как открыть Iframe внутри Iframe с разными источниками на устройстве IOS?
Страницы Ionic приложения размещаются локально и имеют origin = "file: //"
Чтобы разрешить использование IFrameCommunicator.html, который должен быть размещен в том же домене, что и Iframe, нам пришлось добавить дополнительные слои iframe
Слои Ифрама и их происхождение:
- Внутренний Iframe для размещения страницы подтверждения. Iframe, Origin = "https // ourServer"
- Внешний Iframe необходим для того, чтобы IframeCommunicator мог ссылаться на ранее упомянутый Iframe (у нас не было проблем с этой частью). Происхождение = "HTTPS // ourServer"
- Внешняя часть Iframe Ionic App, следовательно, размещена в Origin = "file: //"
Пока что все работает нормально на устройствах Chrome и Safari (с 'ion serve') и Android.
Проблема в том, что он не работает на устройствах IOS (или симуляторах).
Первоначально, он не загружал Outermost Iframe, поэтому мы добавили
<access origin="*" />
<allow-navigation href="*" />
в config.xml, как указано в здесь
Затем он загрузил два внешних IFrames, но не страницу приема платежей.
(или страница «Принять платеж» только тогда, когда мы пытались открыть ее непосредственно в самом внешнем фрейме)
Другими словами, он работает только с одним источником.