I have created a web application that let user view some PDF created on the fly on server side as following:
- the user clicks on a button and make an API request to the backend with some data needed to generate a dynamic PDF
- the backend generates the file, then stores it in a S3 bucket, also produces a presigned URL in reply to the client.
- the client receives back the url and then creates a temporary "a" node element which is programmatically clicked to avoid futher interactions for user
The javascript code is this:
async previewFileApi(method, url, config) { const result = await this.$axios.request({ method, url, ...config, }) const { presigned_url } = result.data const a = document.createElement('a') document.body.appendChild(a) a.style.display = 'none' a.href = presigned_url a.target = '_blank' a.click() setTimeout(() => { document.body.removeChild(a) }, 500) },This approach works perfectly in Chrome on all platforms, until the webapp is added to iOS home page as bookmark. In that case the API request takes place but the PDF is not opened at all (if the webapp is used without bookmarking, still works on iOS)On the other hand, static PDF files linked with similar "a" dom nodes and target "_blank" can be opened without problems in my webapp, both bookmarked or not.
What I'm doing wrong?