I am trying to make an API call to Openweathermap using their API+key. I am unable to parse the data to a CSS ID using $.getJSON in Javascript.
This is the jsfiddle: https://jsfiddle.net/n1Lz3vf0/
Code:
var weatherData = "http://api.openweathermap.org/data/2.5/weather?
q=Endicott,us&appid=API+KEY";
$.getJSON(weatherData, function(data){
var town = data.name;
document.getElementById('town').innerHTML = town;
});
And it outputs to a simple div tag
Obviously the end result will be far more involved and I will be parsing much more data, but in the jsfiddle, it should simply output my city name but it's not.
You have a mixed content error on the jsfiddle page, because it's a https website and you're trying to call a http url in your API call. You can't call an external API using http if you're over https, the request is blocked.
I tried your request with https and it works just as expected.
Related
WHY! Why is this not working. I am using the weatherbit api, and trying to simply get the uv index. Mind you, in a browser the proper link displays all the information but I can not get it to work through js, putting it through to a div.
I replaced the actual request data with (nameOfData) for privacy, I assure you that there is no problem with the parameters specific.
$getJSON('https://api.weatherbit.io/v2.0/current?lat=(Lat)&lon=(Lon)&key=(Key)', function(data) {
// JSON result in `data` variable
$(".UV").html(data.data[1].uv);
});
Please help.
It is failing because you need an API key. Using the URL in the address bar of a browser does not have that restriction.
Sometimes a workaround in this case is to use a proxy on a server. Your code queries the server, and the server mimics a browser. It depends on the web service how you will fare.
I got it working with async, somehow.
async function getData(){
let response = await fetch(weatherbitApi);
let data = await response.json()
return data;
}
getData().then (data =>
console.log(data.data[0]));
I am using PyQt5 to create a small app. At some point I need to let the user select latitude and longitude from a map. After some research, the easiest way to implement a map search seems to be using google maps through some Javascript lines.
I found this code that does pretty much what I need:
https://gis.stackexchange.com/questions/33238/how-do-you-get-the-coordinates-from-a-click-or-drag-event-in-the-google-maps-api/33246#33246?newreg=eeb7c8c7ce344710838fba3d7b111d12
However, I need to use in my python function the coordinates selected by the user. How can I pass to python the latitude and longitude selected in the Javaascript code ("latLng")? I read a bunch of similar questions on many forums but I can't figure out how to solve my problem. I would expect to find a very simple solution.
My code is something like:
def latlong_function():
html='''
<html> <head> .... ....
'''
print(coordinates)
return html
I am not an expert when it comes to doing python backends for web apps, but I do have experience with PHP and perl in a web environment.
Unless python has a specific utility/library for doing this (and based on your research it sounds like it doesn't) your best bet is to have your JavaScript submit the data via an HTTP POST request using something like Ajax and JQuery.
Something like this might work:
// Function called when an HTML button with id of "Search_Button" is clicked
$('#Search_Button').click(function () {
// Get the values of your lat/long HTML inputs
var lat = $('#Latitude_Input').val();
var long = $('#Longitude_Input').val();
// Submit the AJAX request
$.ajax({
url: "path/to/your_script.py", // Path of the python script to do the processing
method: "POST", // Method to submit the HTTP request as, usually either POST or GET
data: { // These are the POST parameters passed to the backend script
latitude: lat,
longitude: long
},
success: function (returned_data) { // Function to run if successful, with the function parameter being the output of the url script
alert('Here is the output: ' + returned_data);
},
error: function () { // Function to run if unsuccessful
alert('An error occured');
}
});
});
This should let you take the data from the HTML page and let your python script process it.
Check out this answer for handling POST/GET requests in python.
I have a Google Chrome extension for exporting entries from a website. I can't get all entries by one query and I'm using a parameter for paging, i.e. '...&p=' + pageNumber++. I do this with connecting to my web server and this is not a problem with PHP. But I found that I can generate pdf files directly using jsPDF and I decided to get rid of the server side help.
Now I want to fetch the entries with jQuery Ajax. The problem is that I don't know in advance how many pages I have to fetch.
My current solution is:
function runRecursionTest(url, pageNumber){
var currentUrl = url + '?p=' + pageNumber;
$.getJSON("http://query.yahooapis.com/v1/public/yql?"+
"q=select%20*%20from%20html%20where%20url%3D%22"+
encodeURIComponent(currentUrl)+
"%22&format=json'&callback=?"
).done(function(data) {
if(data.results[0]){
data = filterData(data.results[0]);
$('#export-target-list').append($(data).find('#entry-list').html());
runRecursionTest(url, pageNumber++);
} else {
alert('Stop! Last page: '+(pageNumber-1));
}
});
}
It seems logical, huh? But suprisingly it fails. Too much requests are sent even when I have 1 page only. Can't stop it.
Any ideas?
I've built a php API that provides data in json output, I need to get the values via a get request to then plot as a graph on the page.
The front end web component in hosted on the same server as in the api in this basic structure:
index.php
graph.php
/api/
/api/src
/api/src/api.php
My current code in graph.php is as follows:
<script>
var myJson;
$.getJson('api/src/api.php/poll/results/current/13/', function(jd){
myJson = jd.AnswerCount.1;
});
document.getElementById('jsonhere').innerHTML = myJson; //just to test
</script>
The endpoint outputs data like the following:
{"AnswerCount":{"1":5,"3":1,"2":2,"4":1,"5":5,"6":3,"7":2}}
Which I need loaded into a key-value pair array,
1:5
3:1
2:2
4:1
...
to then be put into the graphing library.
How do I fix my code/write new code to do this? I'm pretty stuck here.
EDIT:
On a hunch I logged all the get requests via wireshark, and no request is ever sent to the url in question. Even with an empty function { } ? http://grab.kfouwels.com/pmgW
You can't use a number as an identifier, to access the 1 property you have to say [1] not .1
You have to use the variable containing your data, not x which hasn't been mentioned until you try to assign it somewhere
The A in Ajax stands for Asynchronous. You have to work with your data inside your callback since the function you pass to getJson won't be called until the HTTP response arrived but the line starting document.get will run as soon as the HTTP request has been sent.
I am trying to develop a web app to leverage flixster API (Rotten Tomatoes)
I a trying to access url at : http://api.rottentomatoes.com/api/public/v1.0/movies.json?apikey=w697y3tvc9n4arza5vcnx9zt&q=alien
I am pretty sure there is a way to include this cross domain JSON or shall i simply include url of the app just like any other src/css ?
function callflixapi() {
var url ='http://api.rottentomatoes.com/api/public/v1.0/movies.json?callback=jsonprequest&apikey=w697y3tvc9n4arza5vcnx9zt&q=alien';
}
function jsonprequest(response){
console.log(response);
}
This is the code i use using jsonp. I call callflixapi on body load of document
Use JSONP support
http://developer.rottentomatoes.com/docs/read/JSON
EDIT: JSONP explanation
http://json-p.org/