CORS issues with PDF. Why it happens and how it can be fixed?

Modern internet browsers take security seriously! After many attacks and malpractice on the internet, many new security rules have been introduced. Among such rules is CORS (Cross-origin resource sharing), which applies for cross-domain resource access; mainly using AJAX requests.

WHY CORS occurs in DEARFLIP?

DearFlip uses PDF.js that relies on Ajax requests to fetch PDF files and then render them using HTML5. This is where CORS applies in DearFlip if the files are not in the same domain/protocol. You can check if the following conditions are met to see if you have such a situation:

CASE 1: Page is in HTTP while the PDF file is in HTTPS or vice versa.

This is a common scenario when there is improper SSL setup and the HTTP request and HTTPS request co-exist(something that should not exist). Users are advised to redirect every HTTP request to HTTPS, so that the page and requested resource same HTTPS protocol.

CASE 2: page is in xyz.com domain and the PDF file is in abcd.com domain.

This happens when users want to use PDF files from another domain. While this is possible, xyz.com domain requires proper access from abcd.com domain to access PDF files on abcd.com domain. To do so users can add proper CORS settings to the .htaccess file.

For Apache Server, add following lines in .htaccess file

Header set Access-Control-Allow-Origin "*" 
Header set Access-Control-Allow-Headers "Range" 
Header set Access-Control-Expose-Headers: "Accept-Ranges, Content-Encoding, Content-Length, Content-Range"

More Info: https://enable-cors.org/server.html

Note: CORS access settings may not be available for servers like Google Drive, One Drive, or other file sharing services. They do so to protect their bandwidth. These solutions are possible for servers that are owned by the customers or have access to such settings.

Leave a Comment