I am trying to display google trends on a website I am working on. I know that I can use iframes to display each individual trend, but I would like to display all of the trends. I cannot display the whole website with an iframe (not just because this error net::ERR_BLOCKED_BY_CLIENT but also because it would be plagiarism).
I am now trying to use ajax to achieve this but for some reason it is not working. I looked at this very helpful post, however I was not able to make any of their suggestions work. Here is the code I am working on so far (from the above post):
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$.ajaxPrefilter( function (options) {
if (options.crossDomain && jQuery.support.cors) {
var http = (window.location.protocol === 'http:' ? 'http:' : 'https:');
options.url = http + '//cors-anywhere.herokuapp.com/' + options.url;
}
});
$.get(
'https://www.google.com/trends/topcharts#vm=cat&geo=US&date=201611&cid',
//When I replace the trends URL with the example URL ( http://en.wikipedia.org/wiki/Cross-origin_resource_sharing ) Everything works perfect.
function (response) {
console.log("> ", response);
$("#getOutput").html(response);
});
</script>
</head>
<body>
<div id="getOutput">loading...</div>
</body>
</html>
Thanks in advance for the help!
