Tagebuch-Eintrag #66
Flask – Webseite mit NASA Open APIs

Jetzt ist es soweit. Jetzt ist es soweit. Ich fühle mich bereit für eine umfangreiche Übung mit Flask und APIs.

Die NASA – je genau, DIE NASA, stellt Open APIs bereit um diverse Weltraum-Daten auszulesen. Und wieder Name schon sagt, sind diese APIs kostenlos. Man muss sich nur einmal dafür anmelden und man bekommt dann eine API-Key. Der Zugriff ist dadurch auf 1000 pro Stunde limitiert, aber das reicht vollkommen aus für meine Flask-Übung.

Ich bin so aufgeregt! 🙂

Grundüberlegung zum Flask-Projekt

Für meinen Flask-Webprojekt werde ich nicht alle APIs nutzen, die die NASA zur Verfügung stellt. Ich werde nach bisheriger Überlegung die folgenden APIs nutzen:

• APOD – Picture of the Day
• Mars Rover Photos
• InSight: Mars Weather Service API

Statische Dateien

Für das Layout und diverse Funktionalitäten werde ich auf Bootstrap setzen. Sowie den Slick Slider integrieren. Slick-Slider erstellt aus den Mars Rover Fotos eine Galerie.

Meine Ordner-Struktur von meinem Flask-Webseite sieht so aus:

Startseite

Die Startseite soll APOD – Picture of the Day ausgeben. Dabei wird neben das Bild selbst, auch der Title, Copyright-Info, sowie Beschreibung des Bildes zu sehen sein. Die Startseite soll keine Sidebar enthalten und dazu eine spezielle Template-Datei frontpage.html verwenden.

Und hier ist das Ergebnis der Startseite:

Der Inhalt wird komplett automatisch jeden Tag generiert, wenn ich die Seite aufrufe. Selbst das Datum wird selbstverständlich gesetzt. Zusätzlich habe ich noch einen Toggle-Button eingebaut, welches mir die dazugehörigen JSON-Daten beim Klick anzeigen/ausblenden kann.

Hier ist der dazugehörige Code für die Startseite:

@app.route('/')
def frontpage():
    """Die Startseite der NASA API Testseite. Es beinhaltet die API für Bild des Tages (APOD)"""
    # https://api.nasa.gov/planetary/apod?api_key=XXXXX
    apod_api = requests.get("https://api.nasa.gov/planetary/apod?api_key=XXXXX")
    apod = apod_api.json()
    print(apod)
    
    # Values aus dem Dictionary (JSON) extrahiert und als Variable abgespeichert
    apod_copyright = apod["copyright"] # Copyright-Info
    apod_date = str(apod["date"]) # Datum im Format YYYY-MM-DD
    apod_explanation = apod["explanation"] # Bildbeschreibung
    apod_hdimg = apod["hdurl"] # Hochauflösungdes Bild
    apod_img = apod["url"] # niedrige Auflösung: 1024px
    apod_title = apod["title"] # Bild Titel
    apod_date_split = apod_date.split('-')
    apod_date_new = apod_date_split[-1] + "." + apod_date_split[1] + "." + apod_date_split[0] # Datum formatiert zu DD.MM.YYYY
    return render_template("index.html", apod=apod, apod_copyright=apod_copyright, apod_date=apod_date_new, apod_explanation=apod_explanation, apod_hdimg=apod_hdimg, apod_img=apod_img, apod_title=apod_title)

Somit wäre die Startseite fertig in der Flask-Übung. Ich bin hier ganz zu frieden 🙂

Wetter-Daten vom Mars und Rover-Fotos

Die Wetter-Daten vom Mars auszulesen war einen Anfänger wie mich eine sehr aufwendige Sache. Die JSON-Daten besteht aus einem Mehrdimensionalen Dictionary. Nach dem ich die Dictionary entpackt habe und nur die Drei-Tage-Werte wollte, musste ich diese weiter entpacken. Ich habe gefühlt einen Tag dafür gebraucht, bis ich irgendwann am Abend es geschafft hatte die Daten korrekt anzusprechen mit dem Index-Wert oder Schlüssel des Dictionary. Eine Aufwendige Sache, die auf jeden Fall mehr Erfahrung benötigt, damit es flüssiger von Hand geht.

Aber es funktioniert, irgendwie 😀 Es ist noch etwas verbuggt. Aber insgesamt finde ich es als erste Übung gar nicht so schlecht. Es bedarf auf jeden Fall mehr Übung dazu. Einen Schritt nach dem Anderen.

Die Ausgabe der Rover-Fotos war dann etwas einfacher – naja, relativ. Es ist schon ein wenig aufwendig für einen Anfänger. Insbesondere bin ich mit dem Code für die Ausgabe der Wetterdaten bzw. auslesen der Wetterdaten noch nicht zu frieden (Zeile 25 bis 47). Hier muss ich auch weiter üben, wie ich es mit weniger Zeilen Code realisieren kann.

Ansonsten funktioniert der Code eigentlich 😀

@app.route('/mars')
def mars():
    key = "E81AtXzucGXggStxqexxGO6Zkz3S6PIuQNlFFT1x"
    """ Seite für Mars-Wetter API, sowie Mars Rover Fotos """
    mars_weather_api = requests.get("https://api.nasa.gov/insight_weather/?api_key=" + key + "&feedtype=json&ver=1.0")
    rover_opportunity_api = requests.get("https://api.nasa.gov/mars-photos/api/v1/rovers/opportunity/photos?sol=5&api_key="+ key)
    rover_spirit_api = requests.get("https://api.nasa.gov/mars-photos/api/v1/rovers/spirit/photos?sol=5&api_key="+ key)
    rover_curiosity_api = requests.get("https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos?sol=1000&api_key="+ key)
    mars_weather = mars_weather_api.json()
    rover_opportunity = rover_opportunity_api.json()
    rover_spirit = rover_spirit_api.json()
    rover_curiosity = rover_curiosity_api.json()
    print("Kontrollausgabe mars_weather:")
    print(mars_weather)
    # Für Mars Wetter brauche ich die Angaben Sol Nummer: AT: av, mn, mx, First UTC, Season:
    # Liste um die Tage und dazugehörgen Werte über einf for-Schleife zu speichern
    mars_key_value = []
    for key in mars_weather.items():
        # Abspeichern der Sol/Tages-Werte in eine Liste
        mars_key_value.append(key)
    mars_weather_today = mars_key_value[2] # Heute
    mars_weather_today_m1 = mars_key_value[1] # Heute -1
    mars_weather_today_m2 = mars_key_value[0] # Heute -2

    mars_weather_today_sol = mars_weather_today[0]
    mars_weather_today_date = mars_weather_today[1]['First_UTC']
    convert_date_today = datetime.strptime(mars_weather_today_date, '%Y-%m-%dT%H:%M:%S%z')
    formated_date_today = datetime.strftime(convert_date_today,'%A, %d. %B %Y - %H:%M:%S%Z')
    mars_weather_today_av = mars_weather_today[1]['AT']['av']
    mars_weather_today_mn = mars_weather_today[1]['AT']['mn']
    mars_weather_today_mx = mars_weather_today[1]['AT']['mx']

    mars_weather_today_m1_sol = mars_weather_today_m1[0]
    mars_weather_today_m1_date = mars_weather_today_m1[1]['First_UTC']
    convert_date_today_m1 = datetime.strptime(mars_weather_today_m1_date, '%Y-%m-%dT%H:%M:%S%z')
    formated_date_today_m1 = datetime.strftime(convert_date_today_m1,'%A, %d. %B %Y - %H:%M:%S%Z')
    mars_weather_today_m1_av = mars_weather_today_m1[1]['AT']['av']
    mars_weather_today_m1_mn = mars_weather_today_m1[1]['AT']['mn']
    mars_weather_today_m1_mx = mars_weather_today_m1[1]['AT']['mx'] 
    
    mars_weather_today_m2_sol = mars_weather_today_m2[0]
    mars_weather_today_m2_date = mars_weather_today_m2[1]['First_UTC']
    convert_date_today_m2 = datetime.strptime(mars_weather_today_m2_date, '%Y-%m-%dT%H:%M:%S%z')
    formated_date_today_m2 = datetime.strftime(convert_date_today_m2,'%A, %d. %B %Y - %H:%M:%S%Z')
    mars_weather_today_m2_av = mars_weather_today_m2[1]['AT']['av']
    mars_weather_today_m2_mn = mars_weather_today_m2[1]['AT']['mn']
    mars_weather_today_m2_mx = mars_weather_today_m2[1]['AT']['mx']
    # three_day_weather wird bei return eingtragen.
    three_day_weather = ({"Today" : [mars_weather_today_sol, formated_date_today, mars_weather_today_av, mars_weather_today_mn, mars_weather_today_mx], "Day -1" : [mars_weather_today_m1_sol, formated_date_today_m1, mars_weather_today_m1_av, mars_weather_today_m1_mn, mars_weather_today_m1_mx], "Day -2" : [mars_weather_today_m2_sol, formated_date_today_m2, mars_weather_today_m2_av, mars_weather_today_m2_mn, mars_weather_today_m2_mx]})
    # ROVER OPPORTUNITY - 9 Fotos laden
    rover_images = []
    for image in rover_opportunity['photos'][:9]:
        rover_images.append(image)
    # ROVER SPIRIT - 9 Fotos laden
    spirit_images = []
    for image in rover_spirit['photos'][:9]:
        spirit_images.append(image)
    # ROVER CURIOSITY - 9 Fotos laden
    curiosity_images = []
    for image in rover_curiosity['photos'][:9]:
        curiosity_images.append(image)
    print(curiosity_images)
    return render_template("mars.html", mars_weather=mars_weather, three_day_weather=three_day_weather, rover_opportunity=rover_images, rover_spirit=spirit_images, rover_curiosity=curiosity_images)

Hier ist dann die Seite mit der Sidebar mit den Wetterdaten und Bilder-Carousel mit Bootstrap vom Rover Opportunity. Bilder der von den anderen Rovern sind darunter. Sieht man in dem Screenshot jetzt nicht.

Und was bleibt noch übrig?

Eigentlich stellt sich mir noch die Frage, wie ich die Flask-Webseite auf einem Server hochladen und veröffentlich kann, so dass jeder auf diese Webseite zugreifen kann.

Das ist ein Thema für die Zukunft. Denn so einfach scheint es irgendwie doch nicht zu sein.

Ich werd‘ sehen. Das kriege ich bestimmt irgendwie gelöst 🙂