Excel file downloads instead of displaying in iframe - html

I have this in my controller class:
public ActionResult ExcelDoc()
{
var doc = Server.MapPath("~/Content/Sheet1.xlsx");
return File(doc, "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
}
And in my view:
<iframe src="/Centres/ExcelDoc"></iframe>
It simply DOES NOT display the file in the iframe. Instead, it begins downloading sheet1.xlsx as ExcelDoc.xlsx. Very frustrating as previous questions have helped me to develop this solution to my previous problem of trying to display a dynamically generated excel file in an iframe. I am using Google Chrome, if that is relevant.

Returning a file makes your browser try to download it, that's expected behaviour. I think it's not possible to display an excel file as-is in your browser window, unless you use something like a plug-in.

Related

Rendering a pdf file from an html view to display it on a web page as a image preview

I need to create a pdf preview that should be displayed on a web page as an image. The pdf file is just a simple report build on almost plain HTML. Essentially I had a problem with displaying checkboxes, now I replaced them with pics of checkboxes but the issue remains the same.
Here how I create the pdf report from my HTML view with help of groovy and grails:
def html = htmlRenderService.getReport(info)
ByteArrayOutputStream out = new ByteArrayOutputStream()
HtmlImageGenerator htmlImageGenerator = new HtmlImageGenerator()
htmlImageGenerator.loadHtml(html)
BufferedImage bi = htmlImageGenerator.bufferedImage
ImageIO.write(bi, "PNG", out)
byte[] bytes = out.toByteArray()
String base64bytes = encoder.encodeToString(bytes)
String src = "data:image/png;base64," + base64bytes
out.flush()
def getReport(Info info) {
return groovyPageRenderer.render(view: REPORT_VIEW,
model: [info: info])
}
Then I send the src string to my view and render it as:<img src="${src}" alt=""/>
Then my checkbox pic looks like this: <div style="/*style stuff*/ background-image: url(data:image/png;base64,LINK_TO_THE_IMAGE"></div>
In the end, I received a picture of my pdf report rendered pretty well displaying as an image on my page, BUT without checkboxes. Here is the picture of one part of it:
And here is the same part but from the pdf document which I rendered all the same way, but just downloaded directed from my webapp:
Here is an example where I combined both options(input checkbox and image checkbox) and rendered it as an image:
So what could cause this issue? Thank you in advance.
UPDATE: I came across today to this comment under another issue with HtmlImageGenerator:
HtmlImageGenerator seems to use a JEditorPane for rendering the HTML. Swing HTML support does not extend to the ability to render data images. It might be possible by digging into the HTMLEditorKit and changing the image loading element to support data images, but then you'd need to find a way to get HtmlImageGenerator to use the altered editor pane.
Seems that HtmlImageGenerator doesn't work well with images inside HTML files, but it's still unclear why it doesn't render checkbox inputs as well.
Without seeing the code you end up with after page load, check the chrome dev tools panel to see if the image has actually loaded correctly to the page which will tell you it's at least accessible to use. Then check if the url is output correctly to the div as the background-image. If it looks correct and there aren't related errors in the console, it is likely a css setting.
With background images, your container will need to contain content or else you will need to specify:
width
height
a display setting
background-position, and a
background-size
If you can upload more info, I might be able to be more specific.

How can I generate a PDF of the current web page on button click?

How can I create and download a PDF version of the current web page (which is open in browser) on button click?
I am assuming you use jquery on client-side.
$('#button_id').click(function(){
window.print();
});
Which will guide you to print menu where you can choose "Save as PDF" which will save your current view as pdf.
Did it solve your issue?
You can look at Nuget package: Rotativa http://nuget.org/packages/Rotativa. It's based on wkhtmltopdf.
Usage is really simple.
Having an action you would like to serve as Pdf, instead of Html page. You can define an action that returns an ActionResult of the type ActionAsPdf (RouteAsPdf is also available). So the code is just:
public ActionResult PrintIndex()
{
return new ActionAsPdf("Index", new { name = "Giorgio" }) { FileName = "Test.pdf" };
}
With name = "Giorgio" being a route parameter.
Look at this GitHub
If i am getting you right. You want to generate a PDF from HMTL. Rotativa plugin is a good choice. Also, mentioned by Janmejay Kumar. If you want to implement this plugin. Please ask if you have any doubt .I have used this plugin for PDF and for image generation.

How to upload attachments in browser tests using Appium?

I am trying to automate a test case in Chrome where I would like to upload an attachment to an email. I use desiredCaps['browserName'] = 'Chrome'. While clicking attachments in email, it opens the Documents in the phone, but I am unable to detect the elements in the Documents screen.
Try this.If you are using ruby
This basically goes into the directory called screenshots and finds the second picture or the document that is visible inside the directory
find_element(id: "screenshots").find_element(class: "android.widget.ImageView[2]").click
end
This captures the first document/picture visible in the gallery
find_element(id: "").find_element(class: "android.widget.ImageView").click
You can modify it as per your requirement
You shoud change context to from Chromium to 'NATIVE_APP' appium doc about it (http://appium.io/docs/en/writing-running-appium/web/hybrid/) and use Touch Actions for choose you file
In Java, you can use the below code to switch context.
Set<String> contextNames = driver.getContextHandles();
for (final String contextName : contextNames) {
if (contextName.contains("NATIVE")) {
driver.context(contextName);
System.out.println("Switched to Native Context");
}
}
in Python you can try something like this
contextNames = driver.contexts
for aContext in contextNames
if "NATIVE" in aContext:
driver.switch_to.context(aContext)

Opening a local XML file in Google Chrome

Our tool will look like below
Input an XML file.
Click Load button will do transformation of the XML file and display it in a table format.
Currently the tool is working fine in IE and Firefox. Now we have the requirement to support it for Chrome also.
Inside html file JavaScript, we are doing the XML transformation using the XSLT file. For the purpose of loading XML we are creating a DOM object for different browsers as below.
if(window.ActiveXObject) {
XMLObject = new ActiveXObject('Microsoft.FreeThreadedXMLDOM');
}
else {
XMLObject = document.implementation.createDocument("", "", null);
}
But for Chrome we are not able to find the Compatible DOM object code. While searching in web found that the below code will work in Chrome.
XMLObject =new XMLHttpRequest();
Tried with the above method , but it is throwing the error “Cross origin requests are only supported for HTTP”.
Also while loading XML file found that the browser is not giving the correct path of the filename, instead its giving like C:\fakepath\Sample.xml.
Any other way to solve this issue?
If you want to use XMLHttpRequest to access files from the local file system then you have to start Chrome with the command line option --allow-file-access-from-files.

dynamically rendering plain .html page on webmatrix

I'm trying to render a .html webpage using #Renderpage() method in Webmatrix but the .html extension is not supported by the method. I guess the method only supports cshtml extensions. Is there a way I can render html pages dynamically on my site (Webmatrix). I dont want to use an iframe because I'll definitely have issues with my jquery files.
I attempted something i feel is safe yet feels unsafe. I resolved to read the html file and inject it to the DOM manually using:
Array html = null;
var mypage = Server.MapPath(page);
if(File.Exists(mypage)){
html = File.ReadAllLines(mypage);
}
After reading the file.....i injected it to the DOM
<div class="s_content s fontfix left s_content2 downdown">
#foreach (var data in html) {
<text>#Html.Raw(data)</text>
}
</div>
All this runs on compilation time before the page is created for rendering.....I attempted some security measures by attempting to inject server-side C# code in the HTML file but was useless. Makes me feel safe atleast. Is this risky? What is the possible threat to this alternative. i wish i can still have an alternative proper solution from the house. Thanks though.
Assuming #Renderpage() doesn't support HTML files, why don't you try Jquery.load or Ajax. There are lots of tutorials based on dynamic loading of html content.
I do something similar but I don't use #Renderpage or an html file. Instead I am using the "onclick" event and a javascript function which opens a cshtml file. You just put this and the java script function in your main cshtml file in the hmtl section. It will open a file in the current directory called my_window.cshtml when clicked
<a onclick=openWin("my_window",700,850);>Open when clicked</a>
<script type="text/javascript">
function openWin(url, width, height)
{
myWindow=window.open(url,'_blank','width='+width+',height='+height);
myWindow.focus();
}
Hope this helps!