Archiwa tagu: Szafbook

Spring Boot: autoryzacja użytkowników w oparciu o bazę danych

O logowaniu użytkowników pisałam wcześniej w następujących postach:

Dzisiaj dodałam do mojej raczkującej aplikacji funkcjonalność logowania użytkowników zapisanych wcześniej w bazie danych.

Poniżej przedstawiam zmiany, które musiałam w tym celu wprowadzić do mojej aplikacji.

a)  Wersja podstawowa

W klasie User, która od teraz ma być nie tylko klasą przechowującą dane, ale także bazą do autoryzacji użytkowników, muszę zaimplementować interfejs UserDetails:

W klasie SecurityConfiguration opisuję nowy sposób logowania:

Brakuje mi odpowiedniej metody do pobrania obiektu użytkownika po jego nazwie (getUserByUsername) w klasie UserRepository. Do tej pory szukałam użytkowników jedynie na podstawie confirmationId (co opisałam tutaj: Aktywacja konta poprzez email). Na szczęście dzięki Spring Data nie muszę jej nawet implementować, wystarczy, że dodam następującą linię:

b) Wersja rozszerzona. Przecież ja szyfruję hasła!

W tym celu muszę zarejestrować odpowiedni bean szyfrujący:

Jego właśnie muszę użyć do zaszyfrowania hasła przy tworzeniu nowego użytkownika:

Należy też wspomnieć o nim w konfiguracji:

Klasa BCryptPasswordEncoder implementuję metodę matches z interfejsu PasswordEncoder, która sprawdza, czy hasło w czystej postaci pasuje do jego zahaszowanej wersji przechowywanej w bazie danych.

Już.

PS. Podczas testowania mój dostawca domeny i serwera zablokował mi konto email, przekonany, że ktoś się na nie włamał i rozsyła spam

Maven ➝ Pivotal. Automatyczne wdrożenie w chmurze

Pisałam już o tym, jak uruchomić aplikację w chmurze Pivotal oraz jak podłączyć do niej bazę danych. W tym odcinku pokażę, jak ułatwić sobie życie i bez wysiłku wdrażać nowe wersje aplikacji zaraz po ich poprawnym zbudowaniu. Wykorzystam do tego plugin Cloud Foundry Maven (Cloud Foundry ≈ Pivotal).

Cel

Wdrożenie nowej wersji w chmurze po wydaniu jednego polecenia. Spoiler – w tym wypadku będzie to:

Realizacja celu

Plugin w pom.xml

Pierwszy tutorial, jak znalazłam w archiwach Cloud Foundry, twierdził, że pluginu nie ma w głównym repozytorium Mavena – konieczne miało być dodanie wpisu w sekcji pluginRepositories pliku pom.xml. Od tego czasu sytuacja uległa zmianie (https://mvnrepository.com/artifact/org.cloudfoundry/cf-maven-plugin) i nie trzeba już zawracać sobie tym głowy.

Konfiguracja pluginu w pom.xml

W moim wypadku wygląda tak:

Czym jest mycloudfoundry-instance? O tym poniżej.

Dane logowania

Dane logowania można podać w konsoli (ale wtedy nie będzie to wdrożenie za pomocą jednego polecenia!), w treści pom.xml (ale wtedy trafią one do systemu kontroli wersji, być może publicznego!), albo zdefiniować je w przeznaczonym dla Mavena pliku settings.xml na własnym dysku. Więcej o samym pliku settings.xml można poczytać tutaj. Szukać go należy (lub utworzyć) na jednej z dwóch ścieżek:

  • ${maven.home}/conf/settings.xml (dla całej instalacji Mavena)
  • ${user.home}/.m2/settings.xml (per użytkownik)

U mnie wpis wygląda tak:

id to nadana przeze mnie nazwa, za pomocą której mogę odwołać się do tej konfiguracji w pliku pom.xml (linia 6 w listingu z konfiguracją).

Więcej informacji

Więcej informacji na temat korzystania z pluginu można znaleźć na stronie https://docs.run.pivotal.io/buildpacks/java/build-tool-int.html.

Napotkane problemy

Wcześniej musiałam tylko raz wyklikać powiązanie pomiędzy aplikacją a usługą MongoDB (mLab). Przy wdrożeniach przez konsolę cf konfiguracja ta była zachowywana. Dlatego początkowo pominęłam definicję serwisów w konfiguracji pluginu (linie 13-21). Błąd! – baza danych była przez to “odczepiana” od aplikacji przy wdrożeniu.

Kod

Jak zwykle w GitHub.

PS.

Wiedziałam, że po zakończeniu konkursu Daj się poznać wrócę do swojego projektu, ale nie byłam pewna, czy chcę na ten temat blogować. Co mnie przekonało? To, że kiedy zapomniałam, jakie czynności należy wykonać w celu podłączenia bazy danych do aplikacji w chmurze, nie musiałam szukać daleko. Zerknęłam jedynie we własne wcześniejsze teksty! W ten sposób zostałam swoim najwdzięczniejszym czytelnikiem.

Aktywacja konta poprzez email

Poprzedni wpis poświęciłam kwestii wysyłania maili przez aplikację napisaną w Javie.

Kontynuując, teraz chcę upewnić się, że świeżo zarejestrowany użytkownik to człowiek (a nie bot) i że podał poprawny adres email. Poniżej opisuję kroki prowadzącego do tego celu.

Krok 1: nieaktywny użytkownik z wygenerowanym kodem

Po wypełnieniu formularza rejestracyjnego obiekt reprezentujący użytkownika jest zapisywany w bazie danych jako nieaktywny. Razem z nim zapisywany jest losowo wygenerowany kod do aktywacji konta. Na tym etapie użytkownik nie może się logować, nie zna też przypisanego mu kodu.

Krok 2: email z linkiem aktywacyjnym

Aplikacja wysyła na adres podany przez użytkownika wiadomość zawierającą link aktywacyjny. Kod wygenerowany losowo w poprzednim kroku jest doklejony do adresu jako parametr URL.

Krok 3: obsługa linku aktywacyjnego

Wejście pod adres podany w mailu powoduje uruchomienie servletu weryfikacyjnego. Aplikacja szuka w bazie danych obiektu użytkownika, któremu przypisano kod podany jako parametr. Jeśli taki użytkownik istnieje, jest oznaczany jako aktywny. Od tej chwili może się już logować, ponieważ potwierdzono (czy raczej zwiększono prawdopodobieństwo), że to rzeczywista osoba.

Krok 4: usunięcie nieaktywnych kont

Należałoby usunąć zbyt długo przechowywane nieaktywne konta. Ale jeszcze się za to nie zabrałam 🙂

Ciekawostka: wyszukanie użytkownika w bazie

Oto ilość pracy, którą włożyłam w wyszukanie użytkownika w bazie danych MongoDB po wartości confirmationId:

Resztę robi za mnie Spring Data, parsując nazwę metody!

Więcej informacji na ten temat można znaleźć tutaj.

PS.

To ostatni techniczny wpis w ramach konkursu Daj się poznać 2016. Jutro postaram się napisać krótkie podsumowanie. O ile wieczorem na spotkaniu młodych mam nie poleje się za dużo wina.

 

Baza danych w chmurze Pivotal (photo story)

Pokazywałam już, jak wdrożyć aplikację webową w chmurze PaaS Pivotal Web Services:

  1. Wdrażam moją aplikację (która nadal nic nie robi) w chmurze Pivotal Web Services

Pisałam też co nieco o nierelacyjnej bazie danych MongoDB:

  1. Jak zacząć z MongoDB?
  2. MongoDB + Spring Data
  3. Zapisuję dane użytkowników w bazie i robię głupie błędy podczas walidacji formularza

Jak zapewnić sobie dostęp do serwera bazodanowego działającego w chmurze?

Do tej pory uruchamiałam aplikację tylko lokalnie. Przed odpaleniem pliku .jar z wbudowanym serwerem Tomcat musiałam najpierw uruchomić lokalny serwer bazy danych.

W serwisie Pivotal istnieje tzw. Marketplace, w którym można kupować dodatkowe usługi. Wygląda to tak:

Lista dodatkowych serwisów Pivotal
Lista dodatkowych serwisów Pivotal

Odnalazłam na liście interesujący mnie element:

MongoDB w chmurze Pivotal
MongoDB w chmurze Pivotal

Moim celem jest teraz włączenie serwisu i powiązanie go z moją aplikacją Szafbook.

Mogę zrobić to z wiersza poleceń przy użyciu narzędzia cf (muszę wówczas użyć poleceń cf create-service, cf bind-service i ewentualnie cf-restage), mogę też wyklikać swoje wymagania w przeglądarce, na stronie Pivotal:

Banalnie prosta konfiguracja usługi
Banalnie prosta konfiguracja usługi

W przypadku wielu dodatkowych serwisów muszę wybrać pomiędzy kilkoma “planami” – najczęściej jeden z nich jest darmowy i dość ograniczony (np. 5 jednoczesnych połączeń, 20MB pojemności), a kolejne są coraz mocniejsze i coraz droższe. MLab na razie ma tylko darmową wersję.

Po kilkunastu sekundach mam już działające połączenie pomiędzy bazą a aplikacją:

Powiązanie serwisu MLab (MongdoDB as a service) z aplikacją w chmurze Pivotal Web Services
Powiązanie serwisu MLab (MongdoDB as a service) z aplikacją w chmurze Pivotal Web Services

Wszystko działa!

Działająca aplikacja :)
Działająca aplikacja 🙂

Chmura jest w stanie samodzielnie podmienić źródło danych aplikacji w taki sposób, by odwoływało się do nowoutworzonego serwisu. Programista nie musi nawet znać adresu tej usługi! Choć, oczywiście, może go sobie podejrzeć:

Więcej informacji na temat instancji MongoDB podpiętej do mojej aplikacji (na stronie dostawcy usługi)
Więcej informacji na temat instancji MongoDB podpiętej do mojej aplikacji (na stronie dostawcy usługi)

W rzeczywistości, jak zwykle, nie obyło się bez błędów:

  1. Opierając się o tutorial, wyklikałam dostęp do serwisu ElephantSQL, czyli bazy relacyjnej bazy PostgreSQL zamiast do MLab czyli MongoDB.
  2. Rozdzieliłam właściwości projektu pomiędzy kilka plików dla różnych profili (np. application-development.properties), po czym zapomniałam zmienić profil (z development na cloud) przy budowaniu na potrzeby wdrożenia.

 

 

Zapisuję dane użytkowników w bazie i robię głupie błędy podczas walidacji formularza

Zapis danych użytkowników w MongoDB

O MongoDB pisałam już w dwóch wcześniejszych postach: Jak zacząć z MongoDB? i MongoDB + Spring Data.

Dzisiaj postanowiłam zaimplementować wreszcie zapis danych z formularza użytkownika w mojej nierelacyjnej (dokumentowej) bazie danych.

W poprzednim tekście pokazałam, jakich adnotacji należy użyć w klasie User, żeby jej instancje zostały poprawnie zapisane w bazie danych. Żeby faktycznie zapisać dane z formularza, musiałam tylko dopisać kilka linii w kodzie kontrolera:

Co zrobić z hasłami?

Zależało mi na spełnieniu trzech warunków:

  1. Użytkownik podaje hasło dwa razy, żeby zmniejszyć ryzyko literówki.
  2. Wpisywane hasło jest niewidoczne.
  3. Hasło w bazie danych nie jest przechowywane w postaci jawnej.

Dwa hasła

Dodałam następujące pola do klasy reprezentującej użytkownika:

Specjalnie zaznaczyłam adnotację @Transient. Dzięki jej użyciu wskazane pola (w tym wypadku hasła zapisane jawnym tekstem) nie zostaną zapisane w bazie danych.

Ukrycie literek

Pola musiałam również dopisać do formularza. Użyłam pola input w wersji password, żeby zamiast liter wyświetlić gwiazdki (czy tam kropki).

Funkcja hashująca

Wreszcie, hasła. Nie powinny być przechowywane w bazie danych w postaci jawnej. Powodów jest wiele. Na przykład taki: ludzie często używają tych samych haseł w wielu miejscach. Gdyby administrator bazy danych miał wgląd w hasła do aplikacji, mógłby podjąć próbę zalogowania się na konta użytkowników w innych serwisach (np. gmail) przy użyciu tego samego hasła i adresu email.

Oprócz pokazanych już dwóch pól do wprowadzenia hasła roboczego, klasa User przechowuje jeszcze następujące dwie wartości:

passwordSalt to losowa wartość doklejana do hasła przed jego “zaszyfrowaniem” (dzięki niej w bazie danych nie będzie widać, że dwa użytkownicy przypadkowo użyli tego samego hasła), passwordEncrypted to wynik szyfrowania.

Losowanie i szyfrowanie realizuje następujący pomocniczy serwis, wywoływany z kontrolera dzięki adnotacji @Autowired:

Kontroler wygląda tak:

Błąd 1: strona błędu zamiast komunikatu o błędzie w formularzu

Podanie niepoprawnych danych w formularzu z nieznanego mi powodu zaczęło przenosić mnie na moją własną stronę błędu (zamiast wyświetlenia komunikatu przy polu formularza, które spowodowało problem).

Co się okazało?

W pewnym momencie zmieniłam sygnaturę metody kontrolera z:

na:

ponieważ chciałam dopisać informacje do modelu.

Okazuje się, że parametr reprezentujący BindingResult musi następować bezpośrednio po parametrze, przez który przekazywany jest dotyczący go obiekt (co ma sens, gdy jeden formularz obsługuje wiele obiektów).

Formularz zaczął działać poprawnie po zamianie kolejności parametrów:

Błąd 2: Error during execution of processor ‘org.thymeleaf.spring4.processor.attr.SpringErrorsAttrProcessor’

Kolejny błąd zaskoczył mnie, kiedy testowałam sytuację, w której użytkownik wpisze dwa różne hasła. Okazało się, że poczyniłam złe założenia na temat parametrów metody rejectValue, za pomocą której chciałam przekazać do formularza informację o wykryciu problemu. Napisałam:

zakładając, że drugi parametr to komunikat o błędzie. Tymczasem – to kod błędu. Komunikat można przekazać dopiero w trzecim parametrze (poprawny kod widać na listingu z metodą processPasswords). Błąd wynikał zatem z braku komunikatu o błędzie, który był wymagany w szablonie.

Wreszcie działa

Kod jest dostępny w moim repozytorium GitHub.

Komunikat o niepasujących do siebie hasłach
Komunikat o niepasujących do siebie hasłach
Wyświetlenie informacji o pierwszym lepszym użytkowniku z bazy
Wyświetlenie informacji o pierwszym lepszym użytkowniku z bazy

 

Własny formularz logowania Spring Security

W poprzednim wpisie pokazałam, jak zabezpieczyć stronę lub widok hasłem. Korzystałam tam z domyślnego formularza logowania, który wyglądał tak:

Standardowy formularz logowania
Standardowy formularz logowania

Zawsze fajnie dostać coś za darmo, ale nie pasuje to wyglądem do reszty strony.

Co zrobiłam, żeby wymienić formularz na ładniejszy?

  1. Dopisałam odpowiednie fragmenty w metodzie configure wprowadzonej w poprzednim wpisie klasy SecurityConfiguration:
  2. Zdefiniowałam formularz w pliku login.html:
  3. Dodałam najprostszy możliwy kontroler:

Efekt wygląda tak:

Ulepszony formularz logowania
Ulepszony formularz logowania

Spring Boot: Bezpieczeństwo 101

Pora zabezpieczyć stronę – niektóre jej części chcę pokazywać tylko zalogowanym użytkownikom.

Ukrycie całej strony za hasłem

Ukrycie całej strony za hasłem jest wyjątkowo proste. Wystarczy dodać do pom.xml następującą zależność:

Strona wygląda wtedy tak:

Cała strona ukryta za hasłem
Cała strona ukryta za hasłem

Skąd wiem, jakiego podać użytkownika i hasło?

  • Jeśli nic dodatkowo nie konfigurowałam, mogę zalogować się przy użyciu nazwy użytkownika User oraz hasła zapisanego w logach serwera:
  • Mogę też podać dane logowania w pliku application.properties:

Zabezpieczenie na poziomie stron i metod

Dodaję do swojego kodu następującą klasę konfiguracyjną:

W metodzie configureAuth uzyskuję dostęp do obiektu AuthenticationManagerBuilder i definiuję parę użytkowników i nadajemy im role (użytkownika lub administratora).

W metodzie configure podaję, kto ma mieć dostęp do której części aplikacji. I tak:

  • Do adresów wymienionych w linii 17 dostęp mają wszyscy, a więc nie tylko zalogowani użytkownicy.
  • (18) Do stron pod adresem /admin i poniżej dostęp ma tylko użytkownik o prawach administratora.
  • (19) Do stron pod adresem /user i poniżej dostęp ma tylko użytkownik w roli USER.
  • (20) Do reszty stron dostęp mają tylko zalogowani użytkownicy, niezależnie od roli.
  • Włączam dodatkowo standardowy formularz logowania (21) i ustawiam adres / jako domyślne miejsce lądowania po udanym zalogowaniu bądź wylogowaniu.

Dodam jeszcze następujący fragment kodu do mojego szablonu strony:

Uwaga! Żeby silnik szablonów Thymeleaf odpowiednio przetworzył ten fragment, w pom.xml muszę dodać zależność do artefaktu thymeleaf-extras-springsecurity4.

Jak to wygląda na stronie?

Strona główna, niewymagająca logowania
Strona główna, niewymagająca logowania
Standardowy formularz logowania
Standardowy formularz logowania
Użytkownik zalogowany
Użytkownik zalogowany

Dodatkowo mogę definiować wymagania bezpieczeństwa w kodzie, przy każdej metodzie kontrolera, np.:

Kod jest dostępny w GitHubie.

Co dalej?

Historie komórkowe

Ten tekst miał nazywać się “Mobilna wersja strony: podejście 2” w nawiązaniu do Mobilna wersja strony w Spring Boot. Potrzebowałam do niego zrzutu ekranu z mojego telefonu, a jedno spojrzenie na niego wyzwoliło całą lawinę wspomnień… Które również zamieszczam poniżej.

@media

Najpierw krótko o konkretach: w poprzednim wpisie pokazywałam, jak Spring Boot pozwala stworzyć mobilną wersję strony i zarządza jej wyświetlaniem. Wychodzi jednak na to, że w dzisiejszych czasach istnieją lepsze metody. Prym wśród nich wiodą CSS3 i reguły @media. Logika odpowiedzialna za formatowanie informacji trafia w tym modelu dokładnie tam, gdzie powinna: do arkusza stylów. W arkuszu stylów, przy użyciu reguł @media, możemy podjąć decyzję na temat sposobu wyświetlania informacji w zależności od tego, jakie urządzenie korzysta ze strony (np. ekran czy drukarka?), jaką ma orientację (pozioma czy pionowa?) bądź rozdzielczość.

Prosty przykład ze strony W3Schools:

Kolor tła zostanie zmieniony na magentę (ekhem, fuksję), jeśli szerokość wyświetlacza wyniesie co najmniej 480 pikseli.

W swojej konkursowej aplikacji postanowiłam pójść po najmniejszej linii oporu – znalazłam darmowy szablon CSS implementujący ten mechanizm 🙂 Wygląda to obecnie tak:

Przeglądarka na PC
Przeglądarka na PC
Strona wyświetlona na ekranie Samsung Galaxy Xcover 3
Strona wyświetlona na ekranie  urządzenia mobilnego o niskiej rozdzielczości

Telefony 🙂

Co do kiepskiej jakości urządzeń mobilnych… Jestem specyficznym typem użytkownika: masowo rozbijam telefony. Nie rzucam nimi ze złości (od dobrych paru lat). Same wypadają: z kieszeni, z torebki, z samochodu. Kąpią się w wannie i w napojach. Psują się.

Przedstawiony powyżej zrzut ekranu pochodzi z mojego Samsung Galaxy Xcover 3. A było tak.

W połowie ubiegłego roku doszłam do wniosku, że nie stać mnie na kupowanie co dwa miesiące nowego dobrej klasy smartfona (w obliczu śmiertelnego wypadku poprzednika). Zdecydowałam się wtedy na zakup urządzenia niskiej klasy, za to w metalowej obudowie. Przesadziłam – nie działało na nim nawet quizzwanie. Na szczęście, problem szybko rozwiązał się sam. Pierwszego dnia telefon wypadł mi z ręki, kiedy przechodziłam przez przedpokój na piętrze. Pięknym lobem poszybował w stronę krętych schodów, po czym szybem w rogu spadł aż do samej piwnicy. Kiedy bez większych nadziei zeszłam na dół, okazało się, że urządzenie nadal działa, chociaż róg ma zauważalnie wgnieciony. Nabrałam do niego nowego szacunku. Dwa dni później wypadł mi z tylnej kieszenie spodni, kiedy szukałam kluczy na podjeździe – i zbił się na amen.

Wtedy wpadłam na radykalnie odmienny pomysł: kupić drogie i dobre urządzenie, o które będę drżeć i którego wobec finansowych rozterek z pewnością nie upuszczę na podłogę. Wybrałam najnowszy model Galaxy Note. Telefon był piękny, wygodny, szybki… Tyle że trafiłam na wadliwy egzemplarz, który restartował się w losowo wybranych momentach kilka razy dziennie. Przegapiłam (tygodniowy) termin na oddanie telefonu bez wyjaśnień w lokalnym Brand Store, ponieważ od razu pojechałam z nim na wakacje. Po powrocie najpierw wmawiano mi, że wyłączyłam telefon podczas aktualizacji i dlatego działa źle. Potem kilka razy zwracano mi go jako naprawiony – pierwszą rzeczą, jaką robił po włączeniu (najpierw w domu, potem już w sklepie), był restart. Pikanterii sprawie dodawał fakt, że byłam wtedy w bardzo zaawansowanej ciąży i brak sprawnego telefonu był coraz bardziej ryzykowny. Po około miesiącu użyłam na piśmie magicznego sformułowania “Miejski Rzecznik Konsumentów” i odzyskałam pieniądze. Nie chciałam już innego egzemplarza (o który dopominałam się od początku, ustaliwszy szybko, że problem jest sprzętowy i dotyczy konkretnej sztuki w ogólności dobrego modelu), bo nie miałam ochoty na jeszcze jedno spotkanie z serwisem.

Lato 2015, Mazury. Dawid i Gałgan ćwiczą pracę wodną. Ja łapię zasięg i reinstaluję Androida
Lato 2015, Mazury. Dawid i Gałgan ćwiczą pracę wodną. Ja łapię zasięg i reinstaluję Androida

Potem chciałam tanio i dobrze kupić One Plus. Powstrzymało mnie to, że właśnie pojawił się nowy model. Kosztował dokładnie tyle, co stary, ale do zakupu wymagane było posiadanie zaproszenia. Kto normalny kupiłby starą wersję, jeśli nowa kosztowała tyle samo?! A zaproszenie ciągle nie nadchodziło…

Wtedy wygasła umowa na usługi komórkowe w organizacji, do której należę i pojawiła się możliwość uzyskania bez dopłaty cuda w postaci Samsung Galaxy Xcover 3. Na kolana powala przede wszystkim rozdzielczość (480 x 800px), ale pancerny telefon nadal działa po dziesiątkach upadków, kąpieli i ugryzień. I takiego doświadczenia życzę wszystkim!

Wdrażam moją aplikację (która nadal nic nie robi) w chmurze Pivotal Web Services

Co to za aplikacja?

W ramach konkursu Daj się poznać pracuję nad aplikacją Szafbook, na którą pomysł został naszkicowany tutaj. Moim celem jest przede wszystkim nauczenie się nowych rzeczy, dlatego sama aplikacja solidnie kuleje i, jak w tytule, naprawdę nic jeszcze nie robi. Ale już da się wdrożyć!

Co to jest Pivotal Web Services?

Pivotal to firma z, oczywiście, San Francisco. Jeden z jej produktów to chmura i oprogramowanie Pivotal Cloud Foundry . Pivotal Web Services to ich instancja dostępna publicznie. Umożliwia łatwe wdrażanie aplikacji napisanych w następujących językach i frameworkach: Java, Grails, Play, Spring, Node.js, Ruby on Rails, Sinatra, Go.

Zachęcająca grafika ze strony Pivotal Web Services
Zachęcająca grafika ze strony Pivotal Web Services

Moja aplikacja jest napisana w Spring Boot. A więc do dzieła!

Jak wdrożyć aplikację?

  1. Wchodzimy na stronę http://run.pivotal.io/. Wita nas przyjazny komunikat o 87 dolarach w prezencie od firmy na cele testowania.

    1
    Bierzemy!
  2. Rejestrujemy się w serwisie. Musimy podać numer telefonu, żeby przepisać otrzymany kod.
  3. Firma uprzejmie prowadzi nas za rękę. Teraz pora na instalację PWS CLI, czyli konsoli do zarządzania aplikacją. Po instalacji logujemy się w sposób pokazany na stronie. 2
  4. Wdrażamy!

  5. Podglądamy efekt na stronie.

    Wdrożone!
    Wdrożone!
  6. Uczymy się korzystać z konsoli tekstowej oraz z widoku www.

Ile to kosztuje?

Cena to $0.03 za GB RAM na godzinę. Na stronie http://run.pivotal.io/pricing/ mamy wygodny suwak do obliczania kosztów:

Szacunkowe koszty utrzymania aplikacji
Szacunkowe koszty utrzymania aplikacji

$87 dostałam za darmo, na chwilę powinno wystarczyć.

Co dalej?

Przydałoby się to wdrażać automatycznie z GitHuba przez jakiś serwer ciągłej integracji.

PS.

  1. Dziękuję Marcinowi M. za podpowiedzi dotyczące wdrożenia w komentarzach pod pierwszym wpisem konkursowym.
  2. Poświęciłam wcześniej chwilę na rozpoznanie chmury OpenShift, ale dokumentacja była (dla mnie) znacznie mniej czytelna.

 

 

Mobilna wersja strony w Spring Boot

Moja konkursowa aplikacja właściwie nic jeszcze nie robi – ot, wyświetla kilka widoków. Dzisiaj przetestowałam nowy drobiażdżek: wyświetlanie innej wersji strony na urządzeniach mobilnych.

Jak to zrobić? W Spring Boot to naprawdę prosta sprawa. Wystarczy:

  1. Dodać jedną zależność w pliku pom.xml
  2. Dopisać poniższą linię w pliku resources/application.properties (utworzyć plik, jeśli nie istnieje), nadpisując tym samym domyślnie ustawienie właściwości.
  3. Zapisać mobilne wersje widoków w katalogu mobile (lub innym, jeśli zmienisz domyślną wartość właściwości spring.mobile.devicedelegatingviewresolver.mobilePrefix)

    Mobilne wersje widoków
    Mobilne wersje widoków

Po takim przygotowaniu możemy już podziwiać stronę w wersji normalnej i mobilnej. W swojej wersji mobilnej na teraz dodałam tylko słówko “MOBILE”. Wygląda to tak:

Wersja mobilna strony

Urządzenie mobilne udałam przy użyciu dość badziewiastego dodatku do Firefoksa o nazwie User Agent Switcher.

UPDATE: Marcin S. podpowiedział mi, że w Chrome można udawać urządzenie mobilne bez potrzeby instalowania żadnych dodatków:

Tryb mobilny w Google Chrome

UPDATE2: Historie komórkowe