Search code examples
javascriptioscordovavue.jsquasar-framework

Cordova will not open iframe target links in system browser (or at all)


I have an app (built with Quasar, vue.js) that embeds a standard Google Map iframe (Google Embed API) and is then built as a standard web app, PWA, and Cordova app.

In the web/pwa versions, the "open larger map" link that Google automatically places in the view will (as I want and expect) open a brand new window. But in the Cordova version, it will not open these links in the system browser (as all my other external links do without issue). Not sure why these aren't working in the Cordova version since all that should be needed is the same target='_blank' that works to make all the other links open in the system browser (and it is present in Google's link).

I suppose it has something to do with this being inside an iframe, but it is still confusing why this works as expected in web/pwa, just not Cordova.

Here are the two versions I have pulled from the source of the Cordova and Web apps:

Web:

<iframe src="https://www.google.com/maps/embed/v1/place?key=xxx&amp;q=2925+Euclid+Avenue%2CCleveland%2COH%2C44115" allowfullscreen="allowfullscreen" style="border: 0px none; height: 400px;" width="100%" frameborder="0"></iframe>

Cordova:

<iframe width="100%" frameborder="0" src="https://www.google.com/maps/embed/v1/place?key=xxx&amp;q=2925+Euclid+Avenue%2CCleveland%2COH%2C44115" style="border: 0px; height: 250px;"></iframe>

Any ideas?


Solution

  • Well, I found one solution (that works in my limited testing on iOS):

    https://github.com/slaptoast/cordova-plugin-openblank

    Anyone else?