How to Convert Webpage to PDF Using .NET and Review in JavaScript
It's 3 am, and you just finished coding the last pieces of the new home page for your organization. You have spent countless hours getting this done and now need to ensure accuracy and compliance with your organization's marketing and sales policies and build out the SEO strategy for this new page. You have a large team that needs to review your work, but you don't want to slow things down by sending individual copies to each team member, then find a way to bring together all the changes without missing anything.
This is always a challenging stage for any project, but with GrapeCity's tools, this process is much easier. In this blog, we'll show you how to simplify this process and centralize the notes and changes related to the work done, all with just a few steps.
To summarize those steps, view your new page in a browser, convert the new page to a PDF file, and open the PDF file in GcPdfViewer for editing and collaboration with all the users. The last step is to open this document, then code your team's suggested/agreed-upon changes.
Ready to Try it Out? Download GrapeCity Documents for PDF Today!
Full Demonstrations
This process has three steps, all of which are completed with a few GrapeCity tools. This blog discusses specific pieces of these processes but doesn't have full code sets. The full code sets can be found in the following locations:
- For the first step - Converting a web page to a PDF using a URL
- The next step is to set up the GcPdfViewer for editing
- Lastly, set up the GcPdfViewer for sharing and collaboration
Once these steps have been completed, you now have an end-to-end solution for quick review and update of HTML pages, which includes comments, notes, edits, markup, and, if required, signatures and sign-offs of the work.
Let's take a closer look at this using an example.
First, the complete example (without the NuGet Packages) can be downloaded here.
After starting up Visual Studio 2022, follow these steps to get started:
Create a new project
Click on Create a new project, then select "Asp.NET Core Web App (Model-View-Controller)
Click "Next"
Name the application "HTML2PDF", and adjust the location if necessary.
Click "Next"
Then select ".NET 6.0 (Long-term support)" as your target framework:
Click "Create", then run the application to ensure the setup occurred correctly and the templated application runs as expected.
If you see this screen, congratulations; your application is ready for modifications!
Modify the Index.cshtml file to include the following code:
Rerun the application to make sure the changes have taken effect. The new page should look like this:
Close the application and open up the "HomeController.cs" file.
Right-click on "Dependencies" and select "Manage NuGet Packages". Browse for "Grapecity.Documents.Html" and install the NuGet Package:
Add the following using statements to the top of the "HomeController.cs" file (if not already there):
Add the following code within the "Homecontroller.cs" file within the namespace brackets:
Run your application, and you should see a screen similar to the following:
Click the "Create PDF" button, and a new file download should start (there could be a slight delay, so be patient) - the file will be downloaded to your local drive based on the settings within the specific browser you are using.
Open the downloaded file, and you should have a PDF that looks remarkably similar to the web page and can now be used for the team to do markup utilizing GrapeCity's PDF reader.
To open in Grapecity's PDF Reader and test, you can either stand up your own local GcPdfViewer instance or load the downloaded file into our demonstration GcPdfViewer site here.
Opening in the GcPdfViewer, the saved document will look like this, and the ability to comment, annotate and modify will be available (depending on GcPdfViewer Settings and privileges):
Don't hesitate to contact us with any questions, and happy coding!
Download this full example here.
GrapeCity’s .NET PDF API Library and JavaScript PDF Viewer
This article only scratches the surface of the full capabilities of the GrapeCity Documents for PDF (GcPdf) and the client-side JS PDF Viewer (GcPdfViewer). Review our documentation to see the many available features, and check out our GcPdf and GcPdfViewer demos to see the features in action with downloadable sample projects. Integrating this .NET PDF server-side API into a desktop or web-based application allows developers to programmatically import/export, create AcroForms (PDF Forms), and deploy PDFs across desktop and web applications at scale. The JavaScript PDF viewer allows users to read and edit PDFs on the web, and open and print across browsers and frameworks. To learn more about GcPdf and GcPdfViewer’s latest features, check out our release blog.
Ready to Try it Out? Download GrapeCity Documents for PDF Today!
Related Blogs
Try Our .NET PDF Document API
