@quasar/qpdfviewer v1.0.0-beta.2 Release!



  • https://github.com/quasarframework/app-extension-qpdfviewer/releases/tag/v1.0.0-beta.2

    • update dependencies
    • fix: issue with .git in npm package


  • Is there a way to instead of passing a URL to the component, to pass the file itself, maybe as a blob? The files in my case all live locally on a server and are not accessible via the client. I have an API endpoint where I can request the file and it gets sent back to the client. Presently, I’m forcing a download, but it would be cooler to display it using this extension.



  • If you’re curious, this is how I’m presently getting the files:

    fetchPDF (payload) {
          this.$axios.post('/inpatientPDFs/snr/download', payload, { responseType: 'blob' }).then(res => {
            // console.log('am i downloading?', res)
            const blob = new Blob([res.data], { type: res.data.type })
            const url = window.URL.createObjectURL(blob)
            const link = document.createElement('a')
            link.href = url
            const contentDisposition = res.headers['content-disposition']
            let fileName = 'unknown'
            if (contentDisposition) {
              const fileNameMatch = contentDisposition.match(/filename="(.+)"/)
              if (fileNameMatch.length === 2) {
                fileName = fileNameMatch[1]
              }
            }
            // let fileName = payload.reportName
            link.setAttribute('download', fileName)
            document.body.appendChild(link)
            link.click()
            link.remove()
            window.URL.revokeObjectURL(url)
          }).catch(err => {
            console.log('or do i have an error?', err) // TODO beef up this
            this.$q.notify({ message: 'Error downloading PDF', type: 'negative', textColor: 'white', color: 'negative', icon: 'error', closeBtn: 'close', position: 'top' })
          })
        }
    


  • Never mind. I got it. I just use the ```const url = window.URL.createObjectURL(blob)`` line and assign it to :src in the q-pdfviewer.

    I also put the q-pdfviewer inside a q-dialog and show/hide it based on other things. Thanks for the module, @Hawkeye64 !



  • @rconstantine This is good to know! Thanks for the info. ❤


Log in to reply