Looking into using Google Cloud Print, it seems that it is quite complicated regarding OAuth2, the various tokens/client ids etc.
What is the simplest possible way to print a PDF from a web page?
Implemented client side in Javascript with AJAX (so with CORS) or server side with Java (but preferrably not too many jars needed)
PDF document can be sent as binary or referred to as publicly available URL
Preferrably no user login, must be with some kind of "service" authorization
The same application is already using API keys for google maps geocoding. So re-using these keys, if possible, would be the ideal option.
It would be great with some pointers on how to do this in the simplest possible manner possible.
The simplest possible scenario is using the GCP Web Element, as described in: https://developers.google.com/cloud-print/docs/gadget
It boils down to including the print gadget scripts, creating a container to host the button and creating the print gadget in it:
<html>
<head>
</head>
<body>
<div id="print_button_container"></div>
<script src="https://www.google.com/cloudprint/client/cpgadget.js">
</script>
<script>
window.onload = function() {
var gadget = new cloudprint.Gadget();
gadget.setPrintButton(
cloudprint.Gadget.createDefaultPrintButton("print_button_container")); // div id to contain the button
gadget.setPrintDocument("url", "Test Page", "https://www.google.com/landing/cloudprint/testpage.pdf");
}
</script>
</body>
</html>
If you are not logged-in your GCP account you will be shown the appropriate log-in dialog and then you'll select the target printer.
Check the fiddle here:
https://jsfiddle.net/0ncsuqra/
Related
Ive tried using the js load function but as the external site does not allow CORS requests, my original GET request gets blocked.
<div id="test"></div>
<script>
$(document).ready(function () {
$("#test").load("https://mywebsite.com");
});
</script>
So it seems that my only approach is to use iframes?! Is there a way to only crawl a specific div with iframes? I dont want to display the whole website.
EDIT: Since I am using Django I was able to crawl the website with python in a view and then push the crawled and cleaned up code snippet in the html template. Nevertheless to answer my question -> There is no correct way of doing it as long as the website you are trying to access is blocking the content.
Work with the owner of the site you want to take content from.
They can set you up with an API. That avoids having to use hackey methods or risking copyright-related legal trouble.
Say I have two html pages and open them in two tabs. I'd like to make them communicate. As example when I click on a button on the first page, then it should call a function that does something on the second page.
function Test() {
document.getElementById('test').innerHTML = "Test";
}
<!DOCTYPE html>
<html>
<head>
<script src="index.js"></script>
</head>
<body>
<button onclick="Test()">Click here</button>
</body>
</html>
And the second page:
<!DOCTYPE html>
<html>
<head>
<script src="index.js"></script>
</head>
<body>
<p id="test"></p>
</body>
</html>
When I click the button on the first page it should write Test in the p tag on the second page. They can use the same JavaScript file. But how can I achieve this?
You can't do this with just JavaScript. The point is: JS is a client-side language which means that it is downloaded by a client (a browser) and is run by it (not by server). For the 2 pages to communicate, you have establish the communication somehow, via some medium. The medium can be:
web itself. 2 clients can communicate directly, but only if they know each others' address. How would they get those? By the help of the server (which brings us to the second option below) or by manual configuration which is very impractical (some more details may be found in context of WebRTC)
your server. Ok, that's the most common approach but that involves more than just JS: this requires a server-side language (PHP, Python, C++, Java, whatever)
your browser. There's a special case where you can establish such a communication: if you open your second page in the same browser from your first page in a special way so that the second one is "under control" of the first one, you can "command" the second one to do some stuff from the first one
So, if you're interested in the third option, you should read about window.open, window.opener, window.parent.
var newWindow = window.open(url, name, params);
will open a new window (say your second page) and bring you a variable newWindow which is a reference to the window object of the opened window. Try for instance
newWindow.write("haha, I'm controlling this stuff!");
Likewise, in the second window you can use
var oldWindow = window.opener;
There's also a number of methods you can use (window``.close, .moveBy, .moveTo, .resizeBy, .resizeTo etc etc).
Remember, however, that this interaction will be limited to your browser: if you change something as it is displayed in your browser (like add some text to a page) this won't affect the actual pages stored on your server because this requires your server do something via some server-side scripts.
PS to advance this technique, you may want to read about window.postMessage but that's mostly designed for communication between pages that are cross-domain.
PPS Actually, there's more!
One thing to note is localStorage and sessionStorage have setItem method which generates 'storage' events on window (try localStorage.setItem('key', 'value'); and window.addEventListener('storage', event => console.log(event.key));).
Another, like Anderson Green has noted, is Broadcast Channel API (try const channel = new BroadcastChannel('my_channel'), channel.postMessage('Hi there!') and channel.addEventListener('message', event => console.log(event))).
There's also SharedWorkers and Service Workers.
Finally, you can use some off-the-shelve solutions like tabs-router, Hermes, Visibility, Duel and SE.
Those who speak Russian may also find more useful details in this article (wow!).
Try using cookies. It's the simplest way I can think of. This website might seem helpful: https://www.w3schools.com/js/js_cookies.asp
Scenario:
I've an application made in angularJS and ionic for cordova 3.5
This application loads trough an iframe a web to make some things with a step by step form. This web is on other site.
The code for the html is:
<div id="IframeContainer">
<iframe src="URL" style="width:100%;height:90%" onLoad="checkforclose(this);"></iframe>
</div>
This step-by-step form returns a result that the cordova application needs to know what happens in the form. It can return a json, a text/plain or even an HTML that auto-post to another site (This is linked with this non-answered question: Post and redirect FROM Web Api)
Said this, in my cordova application I've a javascript function in order to close the iframe and take over again the control of my application, detecting if the url contains the word "close". This is the code:
<script type="text/javascript">
function checkforclose(pageURL) {
var urlFrame = pageURL.contentWindow.location;
if (urlFrame.href.indexOf('close') > -1) {
window.location = "#/employees/";
}
}
</script>
Question:
Trying avoid CORS (So I think I can't read the iframe content on load, or I'm wrong?),
without using jQuery (AngularJS is welcome, plain javascript even more)
Taking over the control again to the application
How can I get the data returned by the step-by-step external form?
UPDATE 1:
I tried coding a "onload" reading (CORS errors), and posting to a cordova-html page, but without any respectable result.
A possible solution is Web messaging or cross-document messaging. Here's a blog post where someone used this method to gain access to a mobile device's camera from an external page loaded in an iframe. Although this person had the opposite goal (get data from Cordova to page loaded in iframe), they were able to accomplish cross domain communication between a page in an iframe and Cordova; which is what I believe you are trying to do.
I am new to using Google Script, but it seems like a fascinating interface with the Google Doc, Calendar, and Mail software that I look forward to using!
Our group has a website that I would love to embellish with dynamic Javascript components that access Google Docs. What I hoped to do was create Functions in Google Script and call to them in the HTML of our website.
So, I made a Google Script page with two functions:
function getName(EMT_ID) {
// ...
};
function getStrikes(EMT_ID) {
// ...
};
These get data from a Google spreadsheet that we use. I won't include the details because these work fine by themselves when accessed through Google Script testing environment.
I then published this as a "Web App" so that I can gain access to these functions from other platforms.
Now, on our other webpage, I added this code (exact title removed)
<script src="https://script.google.com/macros/s/AKfy[...]65K0/exec"></script>
<script>
function strikes()
{
var EMT_ID = document.getElementById('USC ID').value
document.getElementByID('output').InnerHTML = getName(EMT_ID) + ' has ' + getStrikes(EMT_ID) + ' strikes.'
}
</script>
<input type="text" id="USC ID">
<input type="button" onclick='strikes()' value='Check Strikes'>
<p>Output here:</p><p id="output"></p>
It was my hope that the would allow me access to the Javascript functions from the Google Script page. Is this the case? If not - how else should I go about this.
Best Regards
--- EDIT
To add details - the webpage simply does not seem to respond at all to pressing the button.
Google Apps Script functions are not directly callable from external javascript in the way that you've tried. When you published your script as a web app, you were provide a URL that the app was accessible at, via HTML. It didn't expose the functions of your script.
You do have some options, though.
You can create HTML within your google script using the HTML Service, and THAT html can utilize your apps-script functions indirectly via templated HTML or directly like this:
<script>
google.script.run.doSomething();
</script>
You can use the Content Service to have your Apps Script provide feeds (RSS, JSON, JSONP).
Your published service can be written using the UI Service, with full access to your other apps script functions, forms, charts, etc.
There are variations on the above themes as well - this list isn't exhaustive.
(Rewording the question as there were very few views otherwise).
I want to build a widget that others can include on their website, and the widget itself will be hosted on my website. I am aware of just one method to build widgets that can be embedded on other websites: The website that wants to embedd the widget sources a javascript from my site, which does "document.write" on the page. Something like:
<script language="javascript" src="http://www.my-website-that-will-host-the-widget.com/javascript-emitter.php?id=1234&width=200&bordercolor=000000&bg=ffffff&textcolor=000000"></script>
Now, I want to make a particular widget accessible from only particular domains. For this, I want to know the URL of the page that is embedding my widget reliably . No-one should be able to spoof it. For example, if I have an explicit variable in the embedding code, people can change it.
How do I do it? (I also want that there minimal code to write for the person who is embedding my widget).
regards,
JP
Explanation 1:
Lets say I want to do this: If widget is accessed from 1.com, display A, else display B. How do I do it reliably. Thing is, "A" is something that should not be visible in the code unless the widget is accessed from 1.com. (Thus, if it is embedded in 2.com, I don't want to output if(location.href == 1.com) write(A) else write (B)
Note 1:
(As an aside, if someone feels my method is not good/efficient and can suggest better methods/tutorials, etc., that would be great help. Most google queries give you sites that explain how to build/obtain widget for "your site".... and usually point to websites that allow you to build widgets hosted with them, I want to understand how to build widgets that can be embedded by other websites from my site)
In javascript on the client-side, you can use location.href to get the url of the current page:
var url = location.href;
If you do not want to output any javascript at all for a forbidden domain, in your php you can check the HTTP_REFERER header with the global variable $HTTP_REFERER. In your javascript-emitter.php script try this:
<?php
echo $HTTP_REFERER;
?>
However be warned that this is not always to be trusted: it is up to the client (the browser) to send the correct REFERER header. And of course if someone really wanted to include your widget on their site, they could easily request your javascript server-side spoofing the REFERER header - that is set it to something that's on your whitelist - before forwarding it to the client.
In short there's no way you can easily and absolutely block blacklisted sites from using your widget.