I have a pdf that is hosted on an s3 server, I would like to open the pdf and take screenshots within phantomjs. Everytime I get a status of fail. I looked around and cannot seem to find an easy solution
var page = require('webpage').create();
var link = 'http://vfs.velma.com/Velma/testcard.pdf';
page.open(link, function(status) {
if (status!=='success') {
console.log(status);
phantom.exit();
}
console.log(status);
phantom.exit();
});//ends page open()
I searched the docs but found nothing regarding opening a pdf. My ultimate goal is to screenshot the pdf and injecting an overlay image with jquery. Is this possible using only phantomjs and jquery?
PDF file is not a webpage, so naturally PhantomJS will not render it. However there are projects and services that make possible rendering PDF in a browser, like Mozilla's pdf.js or Google's online PDF viewer.
Since those produce valid HTML, you could work with them in PhantomJS.
Related
I have a C# pdf comparison app hosted on azure and i just want to display the compared pdf in iframe. This is working fine in a browser but when i am integrating it to teams the compared pdf is not showing in iframe. After clicking on compare button the output pdf is downloaded automatically but nothing is being display in iframe.
This is the block of code which i am using for embedding:
success: function (Data) {
if (Data) {
var embed1 = document.getElementById('outputPdf');
embed1.src = "../../PythonFile/OutputPdf/" + Data;
$("#outputPdf").css("display", "block");
}
},
<iframe id="outputPdf" type="application/pdf" style="display:none;width:100%" height="600"></iframe>
#Asif Hussain:
In Microsoft Teams, we have only be able to download the PDF file in "Files". It's not possible to precise the download file name or the download file location.
The use of PDF's needs to be improved with Microsoft Teams. There is no official solution - we have been waiting for one for a while. As workarounds, you could always look at using the Third Party Adobe applications, or if a PDF (s) is hosted on a site, look to use a web page tab and see if the ability to manipulate on the site pulls through.
I have created a file using the FileSystem API. I can't open it from a simple link. However, I can open the page placing the URL manually in the browser (filesystem:http://localhost:8100/temporary/log.csv)
I'm testing only on google chrome for now.
window.open("filesystem:http://localhost:8100/temporary/log.csv")
I expect it to open in a new window.
UPDATE:
This issue was fixed by using window.URL.createObjectURL()
so the link will be something like blob:http://localhost:8100/7aa5685c-ca4f-485a-8bf8-d1c95e6257ab which works
If you know where in your filesystem is the root folder of your webserver (for example: d:\apache\www_root\temporary\) then copy your csv file to there.
Once its done, you should be able to open it from your Javascript by using:
window.open("http://localhost:8100/temporary/log.csv")
Same issue.
Using FileSystem API since the product is Chrome only.
How did you turn the FileEntry into the objectURL?
Figured it out
// turn fileEntry to file
fileEntry.file((f) => {
console.log(window.URL.createObjectURL(f));
});
I created a html page (stored locally) that uses Googlemaps API. My whole page is a basic google map with some customization. I want to take a screenshot every time I change some parameters in the customization so later I can easily compare.
I've found this similar answer and I got it to work on my machine. However, when I change the url from an actual webpage into my own local html file, Phantomjs only saves an entirely black image.
Here is my script.
var WebPage = require('webpage');
page = WebPage.create();
page.open('googlemaps_demo.html');
page.onLoadFinished = function() {
page.render('myScreenShot' + '.png');
phantom.exit();}
The file googlemaps_demo.html and this js script itself are in the same folder. Could someone explain to me why this code only works for an online url, but not a local html file? And how to fix it?
You probably need to specify file using a file:/// scheme and a full location of your file, e.g. file:///c:/local/page.htm
Basically I have a django app that communicates with a chrome extension. I have a bunch of functionality that interfaces with normal HTML pages that's all done by the extension. I want to allow users to have the same functionalities for PDF files. I have a python script which translates the pdf file into an html page.
The problem I run into is when the pdfs are open locally within chrome.
Like the following file:///home/wcr5048/Downloads/sample_pdf.pdf
This is my current solution, it basically gets the html and replaces all the current html, which is just an embedded pdf, and replaces it with the converted pdf(html). But I run into an issue because the "url" isn't really a url, and therefore I can't append html to something that doesn't exist.
function convert_to_html(request) {
console.log('converting to html...');
document.getElementsByTagName('html')[0].innerHTML = request.data;
chrome.runtime.sendMessage({
detail: 'refresh'
});
}
What I don't want to happen is to download a file just like the pdf but one that's been converted into html. I would rather have everything happen automatically.
I only see two possible options:
I create a unique link for the converted pdf file for every user, and then send the raw html string to populate the corresponding view.
I somehow tell the extension to use a popup to cover the entire width of the screen, and then populate it with the data.
Are there any suggested solutions that would be a better fit, and if not, which would be a better solution.
Thanks for viewing
I'm writing a Chrome extension that needs to be able to analyze the source code of a specific HTML page and all the external Javascript and CSS files it loads without loading them again via an XHR request - that is, it will be analyzing the running copies loaded by the browser.
Is that possible? I know it's possible to analyze the source of a particular open tab, but while these Javascript files will be loaded by the browser, they obviously won't be occupying their own tab or window (only the HTML loading them will be.) Please help!
Out of the box, there is no way to get the source of the resources without resorting to the chrome.experimental.devtools.resources APIs.
However, when the experimental APIs are enabled using the --enable-experimental-extension-apis switch, you can do the following to retrieve the source of each resource:
chrome.experimental.devtools.resources.onFinished.addListener(function(resource) {
resource.getContent(function(content, encoding) {
if(encoding !== 'base64') {
alert(content);
}
});
});