Webviewer linearization #80
Conversation
This is a new WebViewer sample added by Kevin Kim. He created this sample to help new users of WebViewer understand the requirements for linearization when loading a document into WebViewer.
- Added sample to `lerna.json` - Added sample to `README.md`
There was a problem hiding this comment.
Pull request overview
This PR adds a new WebViewer sample demonstrating how to implement PDF linearization for optimized web viewing. The sample includes a complete client-server setup showing range request handling for linearized PDFs.
Key changes:
- New React + Vite frontend with WebViewer integration to display and check PDF linearization status
- Express server implementing HTTP range requests for serving linearized PDFs
- Sample registered in lerna.json and root README
Reviewed changes
Copilot reviewed 15 out of 17 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| webviewer-linearization/tools/copy-webviewer-files.cjs | Script to copy WebViewer library files to the client public directory |
| webviewer-linearization/server/server.js | Express server with CORS configuration and range request handling for linearized PDFs |
| webviewer-linearization/package.json | Project dependencies and scripts for running the client-server application |
| webviewer-linearization/client/vite.config.js | Vite configuration for the React frontend |
| webviewer-linearization/client/src/main.jsx | React application entry point |
| webviewer-linearization/client/src/index.css | Global styles for the application |
| webviewer-linearization/client/src/App.jsx | Main React component with WebViewer integration and linearization check |
| webviewer-linearization/client/src/App.css | Styles for the App component |
| webviewer-linearization/client/index.html | HTML entry point for the Vite application |
| webviewer-linearization/client/eslint.config.js | ESLint configuration for code quality |
| webviewer-linearization/client/README.md | Standard Vite + React template documentation |
| webviewer-linearization/README.md | Sample-specific documentation with setup and usage instructions |
| webviewer-linearization/.gitignore | Git ignore patterns for the sample |
| lerna.json | Added webviewer-linearization to the packages list |
| README.md | Added link to the new linearization sample |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Do we need this PDF file? It is best to reference the file to the AWS files for any samples.
There was a problem hiding this comment.
I am not sure.
It looks like the code in server.js lines 31-86 is about demonstrating how to serve a linearized file that is hosted on the server.
It might be possible to use a file hosted on the AWS, but it might require changing this code extensively and perhaps altering the CORS policy as well.
I could reach out to Kevin Kim about changing it to make it like this and see if he can make the needed changes while keeping the code needed to demonstrate how to serve linearized files.
| const range = req.headers.range; | ||
|
|
||
| // Set common headers | ||
| // res.set('Access-Control-Allow-Origin', '*'); // this is not required as CORS middleware already adds the origin header |
There was a problem hiding this comment.
Is this line intended to be commented out?
There was a problem hiding this comment.
It looks like the line is commented out because the CORS policy is explicitly defined in lines 18-24 in this code using the cors npm package to allow access to the specific origin of http://localhost:5173
The line that is commented out looks like it's part of the starting Node Express server code that allows blanket access from any origin (*) so it is commented out to use the CORS policy instead.
We could perhaps remove this line instead, I am thinking.
DavidEGutierrez
left a comment
DavidEGutierrez
left a comment
There was a problem hiding this comment.
@hussam-apryse , please review comments and edit as necessary, provide a reply and ask the requester to review before we merge.
Remove unused sample document URLs from `server.js` Co-authored-by: Copilot <[email protected]>
Expanded Description of Linearization and its role in improving user experience.
Description
This is a new WebViewer sample added by Kevin Kim.
He created this sample to help new users of WebViewer understand the requirements for linearization when loading a document into WebViewer.
Resources
Jira Task: https://apryse.atlassian.net/browse/AS-127
Checklist
If you are adding a new sample
lerna.jsonwith the new sample nameIf you are removing an old sample
lerna.json