Tippspiel WM Spielergebnisse automatisch bekommen

Michael.r.

Well-Known Member
#1
Hallo,

wollte fragen ob jemand weiß wie man Spielergebnisse automatisch für ein Tippspiel bekommt und dann eben mit den eingetragenen Tipps vergleicht und die Punkte zuweist, aber wenn möglich nur in Javascript muss aber nicht sein.

MfG
 

JR Cologne

Well-Known Member
c-b Experte
#2
Um die Spielergebnisse zu erhalten, gibt es mit Sicherheit eine API, mit etwas Glück sogar völlig kostenlos und öffentlich.

Such doch einfach mal auf Google nach einer entsprechenden API, die zu deinen Zwecken passt. Hast du eine gefunden, kannst du dich gerne wieder hier melden und dann wird dir auch beim weiteren Vorgehen geholfen, soweit das nötig ist.
 

Michael.r.

Well-Known Member
#3
Um die Spielergebnisse zu erhalten, gibt es mit Sicherheit eine API, mit etwas Glück sogar völlig kostenlos und öffentlich.

Such doch einfach mal auf Google nach einer entsprechenden API, die zu deinen Zwecken passt. Hast du eine gefunden, kannst du dich gerne wieder hier melden und dann wird dir auch beim weiteren Vorgehen geholfen, soweit das nötig ist.
Nach was für eine API müsste ich dann suchen, kenne mich in diesen Gebiet leider nicht aus.
 

JR Cologne

Well-Known Member
c-b Experte
#5
Nach was für eine API müsste ich dann suchen, kenne mich in diesen Gebiet leider nicht aus.
Am besten wäre wohl eine (REST-)API, die dir eine einfache URL anbietet, wo du einen Request hinsenden kannst und dann die geforderten Daten im JSON-Format zurückgeliefert bekommst.

Kommt aber natürlich auf deine exakten Anforderungen an. Musst dich also vermutlich leider selbst auf die Suche begeben.
 

JR Cologne

Well-Known Member
c-b Experte
#7
Hm, ich weiß nicht, ob das das Richtige ist. Das ist ja eigentlich keine richtige API...

Schau dir vielleicht mal das an: http://livescore-api.com/worldcup/

Da musst du dich zwar registrieren, aber dafür sollte die besser geeignet sein.

Bin ehrlich gesagt überrascht, dass es so wenige vernünftige APIs gibt...
 

JR Cologne

Well-Known Member
c-b Experte
#9
Oh, ja. Da hast du recht... Dann musst du wohl doch auf deine Vorschläge zurückgreifen.

Also, dein Problem ist jetzt, wie du die Daten abgefragt bekommst, richtig?

Das geht mittels einem XMLHttpRequest.

Hier ist ein schnelles Beispiel:

Javascript:
var api_url = 'https://raw.githubusercontent.com/lsv/fifa-worldcup-2018/master/data.json';

var request = new XMLHttpRequest();

request.open('GET', api_url, true);

request.addEventListener('load', function() {
    console.log(JSON.parse(request.response));
});

request.send();
Die Daten gemäß deinen Anforderungen zu verarbeiten, überlasse ich erstmal dir. :p
 

JR Cologne

Well-Known Member
c-b Experte
#11
Du bekommst doch ein normales Objekt von JSON.parse() geliefert, dass du dann auseinander nehmen kannst.

Infos rund um Objekte in JS gibt es z.B. hier: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Basics

Einen Wert kannst du dann mit der Funktion innerText() bzw. innerHTML() ins HTML einfügen und somit anzeigen. Da gibt es zwar auch noch viele andere Möglichkeiten und Funktionen, aber das sind praktisch die Classics.

Infos dazu hier: https://developer.mozilla.org/de/docs/Web/API/Element/innerHTML, https://www.w3schools.com/jsref/prop_node_innertext.asp
 

JR Cologne

Well-Known Member
c-b Experte
#13
Verstehe ich nicht, was du willst?

Also nochmal: Die API liefert dir Daten im JSON-Format. Das JSON wird mittels JSON.parse() in ein JS-Objekt umgewandelt.
Nun hast du die Möglichkeit, auf die Daten zuzugreifen.

Ein Beispiel, das den Namen des ersten Stadions ausspuckt:

Javascript:
var data = JSON.parse(request.response);
console.log(data.stadiums[0].name);
Der Code muss natürlich oben in die Callback-Funktion des Event Listeners eingefügt werden.
 

Michael.r.

Well-Known Member
#14
Also kann ich es damit in den local Storage abspeichern:

Javascript:
localStorage.setItem(JSON.parse('Daten',request.response));
 

Michael.r.

Well-Known Member
#16
So...?

Javascript:
 api_url = 'https://raw.githubusercontent.com/lsv/fifa-worldcup-2018/master/data.json';

var request = new XMLHttpRequest();

request.open('GET', api_url, true);

request.addEventListener('load', function() {
    console.log(JSON.parse(request.response));
});

request.send();

var i=localStorage.setItem('i', JSON.parse(request.response));
 

dominikb

Well-Known Member
#17
Es funktioniert, von daher kann es nicht so falsch sein. ^^

2 Sachen sind mir aufgefallen:

Vorher habe ich geschrieben, wie die richtige Syntax aussieht. Allerdings können im Localstorage nur Strings gespeichert werden. Du kannst also direkt den String request.response als Item speichern, ohne vorher mit JSON.parse() ein Objekt daraus zu machen. Auch die Variable i kannst du dir sparen, weil setItem() nichts zurückgibt:

Javascript:
localStorage.setItem('i', request.response);
Und: Wenn du kein Firebug verwendest, aber den geparsten String wie in Zeile 8 als Objekt loggen möchtest, kannst du das mit console.log("%o", JSON.parse(request.response)); machen.
 

asc

Well-Known Member
c-b Experte
#18
Vielleicht den localStorage Part noch in den "load" Eventhandler packen.
Und wenn das immer JSON ist, kann man auch das JSON.parse weglassen in dem man "responseType" auf "json" setzt.

Javascript:
let request = new XMLHttpRequest();
request.open('GET', api_url, true);
request.responseType = 'json';
request.addEventListener('load', function () {
  console.log(request.response); // object { ... }
});
request.send();
 

JR Cologne

Well-Known Member
c-b Experte
#20
Ja, würde dann so aussehen:

Javascript:
var request = new XMLHttpRequest();

request.open('GET', api_url, true);

request.responseType = 'json';

request.addEventListener('load', function () {
  localStorage.setItem('data', request.response);
});

request.send();
 
Oben