iOS 11 - standalone web app link opening default reversed? (Handling PDF display in web app.)

Question

There was a lot of traffic about preventing a link in a standalone web app from opening in mobile Safari, but the iOS versions quoted were much earlier (7-9?). In iOS 11, I'm having the opposite problem: in my standalone web app, I have links to PDF files that need to be displayed. When I click on them, they open inside the web app browser instead of inside Safari, no matter what options I have given. Because of standalone mode, the result is a dead-end in the web app that requires restart of the app. (Android seems to do the right thing and pass off to a pdf viewing app.)

Click handler (javascript/bootstrap/jquery):

function openDocument(docURL) {
    window.open(docURL,'_blank');
    return false;
}

Alternatively, can one turn on the navigation inside the web app for the new page so that I can avoid the dead end? (I think no from what I'm reading; I've tried some options to window.open to no avail.) Or is it possible somehow put together a (multi-page) pdf viewer and a UI element for dismissal? Suggestions welcome.

EDIT: summarizing discussion below, iOS handles internal vs external links differently in standalone web apps. Making the links appear to be external by remapping on the server side allows the link to force Safari to open.

Answer 1

HHave an iFrame or a DIV in your page and load the PDF inside that component. Have a back button top of the iFrame to avoid dead end.

<iframe src="https://example.com/mypdf.pdf"
   width="match your parent element" height="match your parent element" >

You can see one more option here to embed PDF.

Update: If you open the PDF form a different domain or sub-domain, it will be opened in a separate window even in iOS. Say your PWA URL is https://www.example.com/myapp and if you are currently accessing pdf from "https://www.example.com/myapp/pdf/mypdf.pdf", set an alias for this URL like "https://www.pdf.example.com/myapp/mypdf.pdf".

If the domain or sub-domain changes in a PWA, it will be treated as an external link and will always open in a new window and not inside the app leading the the dead end. You can try this if the CSS hacks are not good enough.