Alcumus/react-doc-viewer

CORS Issues

Opened this issue · 8 comments

milinkovitch commented

Hi,
Thanks for this usefull package.

I'm wondering about how I can add the credentials to the fetch request.
This crendentials are needed as we must be logged to have the rights access.

For the time being, I updated directly the code of fileLoader.js :
from
return fetch(documentURI, { signal: signal })
to
return fetch(documentURI, { signal: signal, credentials: 'include' })

Is there another solution to solve this issue ?

Thanks in advance

MMahendra001ScaleTech commented

@milinkovitch can you tell me when you were having this cors issues and how did you fixed it.Thanks.

MMahendra001ScaleTech commented

Okay got it :

Worked this way :
Give fileType
fileType: 'docx'

      const urlData = !!path ? [{ uri: path, fileType: 'docx' }] : [];

        <DocViewer
          className="doc-viewer"
          documents={urlData}
          config={{
            header: {
              disableHeader: false,
              disableFileName: false,
              retainURLParams: false,
            },
          }}
          pluginRenderers={DocViewerRenderers}
        />
  • 👍4
hemanth12321 commented

I have the same problem. I'm using sample pdf file and it gives me CORS error in console and the loader for pdf file keeps loading forever. Ideally it should display error message - Couldn't load pdf file.
const docs = [ { uri: "http://www.africau.edu/images/default/sample.pdf", fileType: "pdf", }, ];

  • 👍1
hienbase commented

same

Vlad1999 commented

I have the same problem, please help!!!

image
image

Oreanu commented

All you need to do is pass in the fileType and URI, I had the same issue but got it working by passing only these two. I was previously passed the URI only

abdnafees commented

fileType guys, fileType. It's a must.

  • 👎2
yusuffadil commented 
import DocViewer, { PDFRenderer } from "react-doc-viewer";

const show = () => {

    const docs = [
        { uri: "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf", fileType: "pdf", },
    ];

    return <DocViewer documents={docs} pluginRenderers={[PDFRenderer]} />

}

export default show

use this still cors

  • 👍2