1a)GET Abfrage localhost per Angulareberhart.media/pdfs/slim/1.slim3rk.pdf · Verwendung einer...
Transcript of 1a)GET Abfrage localhost per Angulareberhart.media/pdfs/slim/1.slim3rk.pdf · Verwendung einer...
Verwendung einer eigenen API - erstellt mit SLIM 3
Inhalt:
1a) GET localhost
1b) GET hetzner.de
2a) POST localhost
2b) POST hetzner.de
1a)GET Abfrage localhost per Angular
C:\xampp\htdocs\slim3rk
Datenbank: schueler
db.php:
Öffne die „index.php“.
Ändere auf „schueler“ und verwende nur drei Elemente aus den Datensätzen nämlich
s_id
Vorname
Nachname
Info: Man kann nicht alles (*) selektieren, da auch ein Bild (blob) vorkommt und damit aber nichts
ausgegeben werden kann. Somit würde nichts angezeigt werden.
Ergebnis:
Diese URL kann nun auch im Beispiel mit Angular verwendet werden, nämlich für die Abfrage der
Anzeige der „Schüler“.
Öffne daher die „service.ts“ und ändere den Code in Zeile 14 von
http://digbizmistelbach.at/angular/angular_schueler.php
auf diese URL der api2:
ABER: Fehler
Keine Anzeige möglich, da „Cross-Origin“ die Anfrage blockiert.
Lösung: Die .htaccess (im Ordner public )muss noch einen Code erhalten, nämlich folgenden:
# Set the headers for the restful api Header always set Access-Control-Allow-Origin http://localhost:4200 Header always set Access-Control-Max-Age "1000" Header always set Access-Control-Allow-Headers "X-Requested-With, Content-Type, Origin, Authorization, Header always set Access-Control-Allow-Origin "*" Header always set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Access-Control-llow-Origin" Header always set Access-Control-Allow-Methodes "PUT, GET, POST, DELETE, OPTIONS" Ergebnis:
Jetzt passt es:
1b)GET-Abfrage SLIM auf Hetzner Server http://digbizmistelbach.at/slim3rkhetzner/public/api/schueler Upload des SLIM-Ordners per FTP auf den Hetzner-Server:
Details zur Get-Abfrage: Daten von der Datenbank:
Öffne die „db.php“
Beachte:
Auf Hetzner heißt die ID nicht „s_id“ sondern nur „id“. Daher muss die GET-Abfrage in „index.php“ geändert werden.
Ergebnis:
Funktioniert auch direkt als URL:
2a) POST localhost (SLIM) Das Formular der Rotes Kreuz-Anwendung soll Schüler in die Datenbank „schueler“ schreiben. Öffne die Angular-Seite mit dem Formular:
Hier sind vor allem die Elemente „name“ wichtig, da diese in die Datenbank wandern. Hier gibt es daher folgende Felder:
vorname
nachname
geschlecht
klasse
gehalt
Das sind auch die aus der Datenbank:
Geburtsdatum und Foto wird nicht befüllt. Öffne den Editor „visual studio code“ und dann den SLIM Ordner „slim3rk“. Dann die „index.php“. Danach kopiere das fertige Skript aus der Site: https://applerinquest.com/how-to-create-the-rest-api-with-slim-framework/ Dort genau jenen Teil der POST betrifft.
Füge es in der „index.php“ ein, nachdem der Code von der GER-Abfrage fertig ist. Nun müssen ein paar Änderungen vorgenommen werden: Hier das Original noch
Füge darunter statt „name“ und „address“ folgende Elemente ein, nämlich die, die auch im Formular vorkommen und in die Datenbank wandern sollen:
Darunter muss man alle nochmals verwenden:
Dann nochmals darunter ändere wieder den Code mit den neuen Elementen:
Statt dem englischen Text kann man einen besseren eingeben: Test mit POSTMAN: http://localhost/slim3rk/public/api/postForm/add
Ergebnis mit POSTMAN testen http://localhost/slim3rk/public/api/schueler
2b)POST mit SLIM auf hetzner.de Öffne den Ordner „slim3rkhetzner“. Da die „db.php“ bereits aktualisiert wurde, müssen jetzt manche Elemente der POST-Abfrage in der „index.php“ angepasst werden. Öffne die „index.php“.
Testen auf POSTMAN:
Ergebnis:
Info: