Ja, ich möchte gerne mehrere APIs in der getdata.php abfragen
Beiträge von -Linix
-
-
@Sempervivum Ich hätte da nach langer Zeit mal wieder eine Frage. Kann ich in der getdata.php mehrere API Keys eintragen?
-
Wegen dem schreibe ich das ja falls ich dies irgendwo öffentlich mache ob es dafür einen Weg gibt um dies zu schützen aber ich meine ich habe dazu schonmal ein Thema gemacht
-
Was für eine Einstellung? Ich bin einsichtig und jetzt kann man mir nicht mal mehr helfen oder was?
-
Und Wenn ich es so wie hier mache https://codepen.io/zreska/pen/wJQOGJ kann man es trotzdem noch auslesen oder
-
Ach so... Dann ist es Dir egal, dass ich mir den Key schnappen und den API Server mit ungewollten Calls über Deinen API-Key befeuere?
Dann würde ich die Seite am besten noch bekannter machen im Netz, damit es die böse Seite der Macht nicht so schwer hat, die Einladung zu übersehen.
Macht ihr euch eigentlich gar keine Gedanken zum Thema Sicherheit?!
Nun ja wenn die seite privat ist . Aber wenn dir das Thema Sicherheit so gefällt kannste mir ja einen Code dazu schicken?!
-
Die Steuerung über die verschiedenen Calls kann ich auch leicht über einen Parameter feuern, da benötige ich kein Array, das alle vorhält.
Kann man natürlich machen, aber besteht eigentlich kein Grund zu.
REST APIs sind i.d.R. immer ähnlich aufgebaut, der Aufruf erfolgt in ähnlicher Form, wie hier:
Die Daten für die Funktionen add und delete werden dann per POST übermittelt, häufig in Form von JSON.
Das alles würde ich aber PHP seitig machen und aus dem Client heraus nur die gewünschte Funktion und erforderlichen Daten übermitteln:
Auch hier wieder: Daten im POST.
Kein API-Key sichtbar!
Es geht ja nicht darum, dass man den key nicht auslesen kann ich möchte ja nur dass man den key wenn ich das script mehrmals nutze nicht immer einzeln eintragen muss
-
Du willst den API-Key also im JavaScript öffentlich hinterlegen?!
Wie meinst du das? also ich wollte nachfragen ob es eine möglichkeit gibt irgendweiene datei zu machen in der der apikey hinterlegt ist und dass man nicht wenn ich mehrere solche abfragen habe den apikey immer extra einzutragen
-
JavaScript
Alles anzeigen<script> function getThem(selHeader, selSection, url) { function populateHeader(jsonObj) { var myH1 = document.createElement('h1'); myH1.textContent = jsonObj['squadName']; header.appendChild(myH1); var myPara = document.createElement('p'); myPara.textContent = '' + jsonObj.result[1][0].Value.UserName; header.appendChild(myPara); } var header = document.querySelector(selHeader); var section = document.querySelector(selSection); var requestURL = url; var request = new XMLHttpRequest(); request.open('GET', requestURL); request.responseType = 'json'; request.send(); request.onload = function () { var superHeroes = request.response; populateHeader(superHeroes); // showHeroes(superHeroes); } } getThem('#table10', 'section', 'https://api.sped-v.de/rest/api?apikey=YOUR-API-KEY&function=getonlineusers') </script>
Kann ich irgendwie das einbauen wenn ich diesen code mehrmals auf der seite benutze z.B. eine config datei machen, dass man dort den apikey für apikey=YOUR-API-KEY eintragen kann dass man nicht überall einzeln eintragen muss
-
Dieses funktioniert im groben:
HTML
Alles anzeigen<!DOCTYPE html> <html> <head> <title>Demo API mit Vue</title> <meta charset="utf-8"> <script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.js"></script> </head> <body> <input id="vname" type="number" name="vname"> <input id="sendebtn" type="submit" value="senden"> <!-- In dem folgenden Container werden die Platzhalter in doppelten geschweiften Klammern durch die Elemente in der Antwort vom Server ersetzt, siehe auch unten im Javascript --> <div id="app"> <h1>Statistik</h1> <table> <thead> <th>Name</th> <th>Wert</th> </thead> <tbody> <tr> <td>Jobs</td> <td>{{stats.jobs}}</td> </tr> <tr> <td>Economy</td> <td>{{stats.economy}}</td> </tr> <tr> <td>Damage</td> <td>{{stats.damage}}</td> </tr> <tr> <td>Odometer</td> <td>{{stats.odometer}}</td> </tr> <tr> <td>Fuel</td> <td>{{stats.fuel}}</td> </tr> </tbody> </table> </div> <script> // Eventlistener fuer Klick auf Button registrieren // Wird der Button geklickt, wird die Funktion getData() aufgerufen document.getElementById('sendebtn').addEventListener('click', getData); // Code für das Holen der Daten von der API in eine Funktion legen: function getData() { // Name aus dem Eingabefeld auslesen: const name = document.getElementById('vname').value.trim(); url = 'https://api.vtlog.net/v1/users/' + name + '?idType=vtlog'; new Vue({ // Hier wird angegeben, in welchem Container die Daten // eingetragen werden sollen: el: '#app', data() { return { stats: null } }, mounted() { axios .get(url) // das folgende ist eine Kurzschreibweise für eine Funktion // response ist der Eingangsparameter, in diesem Fall // die Antwort vom Server .then(response => ( // das was hier unter this.stats eingetragen wird, // ist oben im HTML unter stats verfuegbar this.stats = response.data.response.stats )); } }); } </script> </body> </html>
Unschön ist noch dass beim Laden der Seite die Tabelle mit den Platzhaltern angezeigt wird. Entweder die Tabelle verbergen oder gleich die Abfrage für eine Default-ID ausführen.
Vielen Dank das mit den Platzhaltern werde ich selbst hinbekommen
-
Ließ mal die Links die Sempervivum dir gegeben hat.
Da wird erklärt wie man die Felder auslesen kann.
dann must du die userId ändern.
Weiter darfst du jetzt in den Links lesen.
Falls du gar nicht weiter kommst wird dir schon einer helfen , aber versuch mal erst dein Glück.
Die Seite hab ich mit bereits durchgelesen aber ich weis nicht genau wie ich das einsetzen muss. Mit Javascript hatte ich bisher nur wenig zu tun
-
Hier noch zwei Erklärungen, wie das funktioniert:
HTML
Alles anzeigen<!DOCTYPE html> <html> <head> <title>Demo API mit Vue</title> <meta charset="utf-8"> </head> <body> <script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.js"></script> // In dem folgenden Container werden die Platzhalter in doppelten geschweiften Klammern // durch die Elemente in der Antwort vom Server ersetzt, siehe auch unten im Javascript <div id="app"> <h1>Statistik</h1> <table> <thead> <th>Name</th> <th>Wert</th> </thead> <tbody> <tr> <td>Jobs</td> <td>{{stats.jobs}}</td> </tr> <tr> <td>Economy</td> <td>{{stats.economy}}</td> </tr> <tr> <td>Damage</td> <td>{{stats.damage}}</td> </tr> <tr> <td>Odometer</td> <td>{{stats.odometer}}</td> </tr> <tr> <td>Fuel</td> <td>{{stats.fuel}}</td> </tr> </tbody> </table> </div> <script> const userID = 8; url = 'https://api.vtlog.net/v1/users/' + userID + '?idType=vtlog'; new Vue({ // Hier wird angegeben, in welchem Container die Daten // eingetragen werden sollen: el: '#app', data() { return { stats: null } }, mounted() { axios .get(url) // das folgende ist eine Kurzschreibweise für eine Funktion // response ist der Eingangsparameter, in diesem Fall // die Antwort vom Server .then(response => ( // das was hier unter this.stats eingetragen wird, // ist oben im HTML unter stats verfuegbar this.stats = response.data.response.stats )); } }); </script> </body> </html>
HTML
Alles anzeigen<!DOCTYPE html> <html> <head> <title>Demo API mit Vue</title> <meta charset="utf-8"> </head> <body> <input id="vname" name="vname"> <input type="submit" value="senden"> <script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.js"></script> // In dem folgenden Container werden die Platzhalter in doppelten geschweiften Klammern // durch die Elemente in der Antwort vom Server ersetzt, siehe auch unten im Javascript <div id="app"> <h1>Statistik</h1> <table> <thead> <th>Name</th> <th>Wert</th> </thead> <tbody> <tr> <td>Jobs</td> <td>{{stats.jobs}}</td> </tr> <tr> <td>Economy</td> <td>{{stats.economy}}</td> </tr> <tr> <td>Damage</td> <td>{{stats.damage}}</td> </tr> <tr> <td>Odometer</td> <td>{{stats.odometer}}</td> </tr> <tr> <td>Fuel</td> <td>{{stats.fuel}}</td> </tr> </tbody> </table> </div> <script> const userID = 8; url = 'https://api.vtlog.net/v1/users/' + userID + '?idType=vtlog'; new Vue({ // Hier wird angegeben, in welchem Container die Daten // eingetragen werden sollen: el: '#app', data() { return { stats: null } }, mounted() { axios .get(url) // das folgende ist eine Kurzschreibweise für eine Funktion // response ist der Eingangsparameter, in diesem Fall // die Antwort vom Server .then(response => ( // das was hier unter this.stats eingetragen wird, // ist oben im HTML unter stats verfuegbar this.stats = response.data.response.stats )); } }); </script> </body> </html>
Wenn ich es jetzt so mit einem Feld habe muss ich das ja auch machen das const userID = 8 die id geändert wird sozudagen wenn man eine andere zahl eingibt wie kann ich das machen
-
Ok Schade, du hast ja nun die id schon angegeben eigentlich wollte ich dass man diese in einem feld eintragen kann und dann die Statistiken angezeigt werden. Kannst du ja ber später noch erklären
-
Kannst du vllt einen fertigen code schicken dass ich mir das mal anschauen kann
-
Okay aber wenn ich jetzt solch ein weiterer Prameter {userID} habewie kann ich das am besten machen
-
jetzt müsste man für den Parameter ein feld einbauen nur wie?
-
Fragen wir erstmal anders, weißt du wie man solche Apis auslesen kann ?
Das kann man mit Php oder Javascript machen.
In beiden fälle soltest du dir Json anschauen dazu.
Beim auslesen bekommst du einen JSON Code zurück.
Den kann man dann auseinander nehmen und dann anzeigen wie du möchtest.
Auch dein Feld mit einen Button ist kein problem.
Man muß dann halt mit Javascript den Code holen.
bisher habe ich es immer so gemacht
Code
Alles anzeigen<section></section> <script> function getThem(selHeader, selSection, url) { function populateHeader(jsonObj) { var myH1 = document.createElement('h1'); myH1.textContent = jsonObj['squadName']; header.appendChild(myH1); var myPara = document.createElement('p'); myPara.textContent = '' + jsonObj.result[3][0].Value.UserName; header.appendChild(myPara); } var header = document.querySelector(selHeader); var section = document.querySelector(selSection); var requestURL = url; var request = new XMLHttpRequest(); request.open('GET', requestURL); request.responseType = 'json'; request.send(); request.onload = function () { var superHeroes = request.response; populateHeader(superHeroes); // showHeroes(superHeroes); } } getThem('#table10', 'section', 'https://api.sped-v.de/rest/api?apikey=YOUR-API-KEY&function=getonlineusers') </script>
-
Hallo,
Wenn ich jetzt diese Api https://api.vtlog.net/#operation/getUsers nutze und ich https://api.vtlog.net/v1/users/{userID} soetwas habe mit {userID} wie kann ich das dann auf meiner webseite machen. Ich habe mir überlegt dass man ein feld dann macht wo man die userid einträgt aber wie geht sowas hat jemand ein beispiel?
-
Hey,
In der Index wird beim Login der Username als Session gespeichert. Dort kannst du die Id als Session abspeichern. Wenn du diese abgespeichert hast kannst du auf diese auch zugreifen solange die Session aktiv und vorhanden ist.
Grüße
Klar dadurch das die userid in der Session verwendet wird kann ich diese ausgeben aber wie kann ich es jetzt machen wenn ich die email ausgeben will des jeweilig angemeldeten users
-
https://github.com/Tutorialwor…master/PHP%20Rechtesystem
Bei diesem Loginsystem kann ich ja durch die session den username von dem angemeldeten nutzer abfragen da er sich ja damit angemeldet hat kann ich jetzt aber auch die email z.b. anzeigen lassen die in der datenbank steht
Ergänzung nach 6 Minuten
PHP
Alles anzeigen<?php session_start(); if(!isset($_SESSION['userid'])) { die('Bitte zuerst <a href="login.php">einloggen</a>'); } //Abfrage der Nutzer ID vom Login $userid = $_SESSION['userid']; echo "Hallo User: ".$userid; ?>
Da kann man ja jetzt die userid abfragen also anzeigen lassen da man mit dieser eingeloggt ist