How to preview local files in the browser in another html page - html

i am looking for a creative solution for a new task.
my issue is we need a way to preview local files (extentions: doc, docx, ppt, pptx, pdf, tif, jpeg) in a frame or so of a different web page which provides a link.
preview should look like an image of the files or so.
we would like to prevent parsing the files to pdf in order to save time...
we are using angular 7, c# asp.net server side.
we are very limitted in most solutions, as the data is very secure and is used in an inner office net,
that is why we can't use the google docs solution.
i also understood that using iframe tag and pointing it src attribute to the file source doesn't load the page due to security resones.
in addition all users has the ability to preview the above files types when they do it straight from the document by the open with -> IE or other browsers options.
i tried :
<iframe src="file:///C:/Users/cd/Downloads/MyFile.docx"></iframe>
but:
the iframe tag doesn't open the doc file, i can see the iframe in the DOM as a new html but it doesnt have a content of anything
i tried also for images and the same, the frame is blank

If you are using chrome then chrome specifically blocks local file access this way for security reasons.
more detail is this link : here

One possible solution is, render the document pages as images and then display them on the web page i.e. using the iframe.
You may use GroupDocs.Viewer for .NET for rendering the document pages into high-fidelity images (PNG/JPG). You can then embed the images into your web page to preview the document. This is how you can get the image representation of the pages in a Word document:
using GroupDocs.Viewer.Options;
// Set output path
string OutputPagePathFormat = Path.Combine("D:\\output", "page_{0}.png");
// Render document pages
using (Viewer viewer = new Viewer("D:\\sample.docx"))
{
PngViewOptions options = new PngViewOptions(OutputPagePathFormat);
viewer.View(options);
// Rendered images will be saved in the D:\output\ directory.
}
Disclosure: I work as a developer evangelist at GroupDocs.

Related

box-api override embedded viewer to view html

Is there a way to share a complex HTML file with box? Currently when I share an HTML5 file it opens in the embedded viewer and it is not rendered correctly. It would be great if I could share a file that could be responsively rendered on all devices without the need for it to be on a hosting site.
For paid Box.com accounts only, you can use a direct link as outlined here:
https://support.box.com/hc/en-us/articles/200519908-Direct-Linking
Unfortunately, with a complex HTML file as you're describing, it may not render properly anyway depending on the browser/device, since the file is downloaded as an attachment and not viewed in the browser via box.com.

Create a Sharepoint page from HTML file with images

I'm trying to create an editable page in Sharepoint. I already have the page in HTML (it's quite large) and it has many images in it. Previously I have just created a new page in sharepoint and pasted the HTML source in, the uploaded/inserted the images manually, one at a time.
Unfortunately, I am not able to do this in a reasonable amount of time since there are many images this HTML file is using.
So, I want an editable Sharepoint page that keeps the images intact from a directory that looks like this:
thepage.html
1.png
2.png
...
...
...
343.png
etc
Any ideas?
EDIT: For more clarity - this is a specifications document in HTML form, so it has a lot of text and header integrated with images. I'd like it to be converted to an actual Sharepoint Page that is editable from Sharepoint's interface.
Seems best here to use a low-tech solution, some HTML editing and use the best way for you to upload multiple files.
Assuming
C:\mypage
-> \page.html
-> \images\1.png
-> \images\2.png
...
-> \images\100.png
Via the UI
Go to a Document or Image library, and use the "Upload Multiple files/images" (this only appears on Internet Explorer)
Lets say you uploaded it to //sharepoint/myimages
Create a new content page (say an Article page, or WebPart Page with a Content Editor WebPart)
Lets say your page resides now at //sharepoint/pages/mypage.aspx
Change your html to point from <img src="images/1.png" /> to <img src="../myimages/1.png" />
Edit the HTML for your newly created page (Ribbon > Edit HTML Source), paste your HTML code
Via SharePoint Designer
Drag and Drop all the images in your desired location
repeat the HTML steps above
To replace text in bulk, SharePoint Designer, your favorite HTML editor or event Notepad can do that well using the CTRL+H menu / Edit > Find & Replace options.
NOTE: the //sharepoint address up there is the http url for your site, SO won't let me use a full fake address as a sample.
From IE or from Word, save the page as a complete webpage so it creates an HTML file plus a folder with the images.
In network places, create web folder (WebDAV) pointing to Sharepoint. This way, you can access it from the file system in Explorer.
Open your new network place, navigate to the library where you want your HTML file to be, and drag-n-drop the file and folder into there.
The file then will be visible in browser, with the pictures, but the folder will be hidden.
If I have understood correctly your question. You can use this post answer to load list of images by javascript and php ->
Load list of image from folder.
Upload files to Share Point server and use that folder.
Or you can dynamically write c# code to read Share Point folder and display images.

Links on a webpage to either view or download a PDF

I have never thought about this before, but is there a way to control what happens when a user clicks a link to a PDF file?
My boss would like to offer two links to do the following:
1. View this PDF in the browser
2. Download the PDF
Is there a way to do this ? I don't think about these kinds of things, most modern browsers will open a PDF in the browser. If I want to download it, I right-click download. Any way to force the action ?
Thanks
You can link to an asset, or you can stream the data to the browser. Those are the only two options you have on your end.
If you link to a file: <a href="file.pdf"> whether or not it opens in the browser or not is entirely dependent on the end user's browser and operating system preferences.
You can force the download of a file, however by streaming it to the browser, which will usually trigger the browser's save as dialog.
Your best bet, though, from a user experience perspective, is to simply link to the PDF and let the user know that they are about to click on a PDF link...that way they can decide what they do with it.
How PDFs are displayed are based on the user's browser version and configuration. For example Chrome includes a PDF viewer by default, but the user has the ability to change the behavior of the plug-in ( automatically open PDFs, disable, ask the user).
One way to do this is to set the ContentType and Content-Disposition so the browser will know how to handle the request. For example in ASP.NET you would do it like this:
Response.ContentType = "application/pdf";
Response.AddHeader("Content-Disposition", "attachment;filename=filename.pdf");
Disclosure: I hijacked this code from this article
Let me know if this helps.
There are a few ways using server side technologies:
you can link to a .net / php page that serves the file to download, eg:
download pdf
or to display:
view pdf
If you are using itextsharp to generate your pdf, you can add the following to the Response object to force a download:
Response.AddHeader(
"Content-Disposition",
"attachment; filename=itext.pdf"
);
or the following to open in the same window:
Response.AddHeader(
"Content-disposition",
"inline; filename=itext.pdf");
The user can always set their adobe reader plugin to always download, in which case the browser window display won't work.

How can I display local HTML in the windows phone web browser?

I want to use a web browser to present some multimedia information with locally stored HTML files. The problem is that it just presents the static content without any HTML elements, and also doesn't show the images. The sample code is:
StreamReader reader = new StreamReader(TitleContainer.OpenStream("pathString"));
webBrowser.NavigateToString(reader.ReadToEnd());
The best way to do this is to copy your html file and images to the same directory in Isolated Storage (see: http://msdn.microsoft.com/en-us/library/ff431811(v=vs.92).aspx). Then, you call
webBrowser1.Navigate(new Uri("<Location_of_html_file_in_isolatedStorage>", UriKind.Relative)).
If the images and the html file are in the same directory in isolatedStorage, relative links to your images in this format:
<img src="../YourImage.jpg"/>
Will work correctly.
I don't suppose the WebBrowser control could get access to any images that might be stored in isolated storage, so all the content you want displayed - you would probably need to somehow embed it in a single html, which would probably require some js code (I am not a js/html expert), which needs to be enabled in the control (IsScriptEnabled if I remember correctly). Otherwise - it might be better to convert your HTML to XAML or just otherwise parse it and display it by code.

PdfSharp, GDI+ and HTML printing

I currently have a "PrintingWebService" that I call from an AJAX page with all the information that is needed to construct a highly customized PDF printout using PDF Sharp and the PDFSharp's GDI+ mode, which takes DrawString and other commands that work basically just like GDI+ only they are drawn to the PDF.
I then save the PDF file to a location on the webserver and return the file name from the web service, and the AJAX page opens a new window with the pdf file.
So far, it works well, however, there is one part of my AJAX page that I want to printout and I haven't come up with a solution for yet. I've got a string of the HTML content of a TinyMCE editor that I want to dispay in the bottom part of the PDF page.
I'm looking for some sort of tool I could use for this purpose. Even something opensource that prints to GDI+ I could use by taking the source code and translating it to use PdfSharp's GDI+ (the class names are like XGraphics, with each class having X before the GDI+ name).
If I have to I will limit what HTML can be generated by TinyMCE and write my own renderer, but that will be a big challenge, so I'm looking for other solutions first.
I've stayed away from a printer-friendly page approach because I wanted to construct a page that was a near identical of an existing WinForms printout, using my existing code. With PdfSharp I was able to convert all the code except the text area stuff (which used the RichTextBox and RTF in the WinForms version).
Tony,
I personally have used WebSupergoo's ABCPdf library with much success. You can actually render HTML directly to the PDF and it does fairly well in regards to accuracy.
Another free software that will allow you the flexibility of writing HTML to PDF that I have used in the past with much success is iTextSharp.
Otherwise, I think you'll have to write something to render HTML to GDI.
Either way, you may want to consider using an HttpHandler that you map to using your web.config to generate the PDF file. This will allow for you to render the PDF to a bytestream and then dump it directly to the user (as opposed to having to save each PDF receipt to the web server). It will also allow for you to use the .pdf extension in the page that returns the receipt (PurchaseReceipt.pdf could be mapped to a HttpHandler)... making it more cross-browser friendly. Older versions of Adobe / Browsers will not display correctly if you start throwing a PDF byte stream from an ASPX page.
Hope this helps.