Pierwsze starcie z ASP.NET Core 1.0

W drugim tygodniu moich zmagań z projektem Flover zabrałem się za realne tworzenie kodu. Wreszcie GitHub przestał świecić pustkami! Przede wszystkim zaprzyjaźniałem się z biblioteką Accord.net pod kątem przetwarzania obrazów. Powstała w tym celu mała aplikacja okienkowa, w której szybko mogę sobie zaimplementować jakieś operacje. Jak na razie testowałem wykrywanie rogów obiektów na zdjęciach, co może się później przydać w celu stworzenia wektora cech obrazu i jego późniejszej klasyfikacji. Więcej o całej procedurze rozpoznawania obrazu w następnym wpisie. Jednak głównym wyzwaniem było wystartowanie z ASP.NET Core 1.0 i napisanie chociażby jednej funkcjonalności na stronę internetową, która jest związana z tematyką przetwarzania obrazów. Będzie to zapis wybranego pliku na serwer oraz wyświetlenie go na stronie.

W poprzednim poście wspomniałem, że będę chciał się nauczyć ASP.NET MVC 6, co właściwie jest skrótem znaczącym: ASP.NET 5 + MVC 6. Często dochodzi do tego zestawu np. Entity Framework 7. Okazuje się, że niedawno Microsoft zdecydował się wiele z tych rzeczy "zrestartować" do wersji 1.0. Zatem mamy ASP.NET Core 1.0, .NET Core 1.0 oraz Entity Framework Core 1.0. Przyczyną tych zmian, podaną przez S. Hanselmana, było głównie to, że nowy framework nie jest tylko kolejnym wydaniem poprzedniego a raczej napisany od nowa. Z tego względu jest bardziej innowacyjny (np. osiągnięcie 1.15 mln zapytań na sekundę) ale też mniej dojrzały - trzeba się nastawić, że od czasu do czasu natkniemy się na błędy. Pod koniec posta zamieszczam ciekawe materiały, które udało mi się znaleźć w sieci o tym frameworku. Niektóre z nich wykorzystałem aby zacząć zabawę z ASP.NET Core 1.0. Framework cieszy się również sporym zainteresowaniem spośród uczestników Daj Się Poznać - głównie opisującym zagadnienie migracji, któremu też będę chciał się przyjrzeć. Linki również na dole.

Zacznijmy zatem od utworzenia pierwszego projektu. W Visual Studio 2015 wybieramy New Project -> ASP.NET Web Application, nadajemy nazwę projektowi -> następnie wybieramy Web Application. Automatycznie stworzą nam się foldery dla Modelu, Widoku i Kontrolera. Zakładając, że na razie będziemy głównie używać naszej strony startowej, będziemy głównie zainteresowani następującymi plikami:

  • Model -> stwórzmy tu nowy plik HomeModel.cs
  • View -> Home/Index.cshtml
  • Controller -> HomeController.cs

SolExpl

Nasz model jak na razie będzie przechowywał informacje o ścieżce wybranego pliku.

W widoku chcielibyśmy, aby użytkownik mógł wybrać zdjęcie, zapisać je na serwer a następnie wyświetlić. Użyjmy zatem formularza, który będzie tutaj tzw. TagHelperem. TagHelpery są w miarę nową rzeczą w ASP.NET. Wyglądają jak HTML, ale w rzeczywistości, posiadając różne atrybuty (np. "asp-action" czy "asp-controller"), generują kod HTML po stronie serwera.

Formularz w widoku, po kliknięciu "Wyślij", przekierowuje nas do kontrolera, gdzie należy umieścić metodę poprzedzoną znacznikiem [HttpPost], która przyjmuje argument typu IFormFile. W środku budujemy odpowiednie ścieżki: do folderu docelowego, gdzie zapiszemy plik (uploadPath), oraz lokalizację wybranego obrazu (filePath). W celu stworzenia lokalizacji docelowej używamy serwisu IHostingEnvironment, który posiada informacje o środowisku, w którym pracujemy. Tutaj wykorzystamy właściwość WebRootPath, która wskazuje na folder wwwroot naszego projektu.

Po uruchomieniu strony dzięki serwisowi IIS Express i wybraniu pliku ujrzymy poniższy rezultat:

page

Jako następny krok wyznaczam sobie przeprowadzanie operacji na wgranych obrazach, które będą wykonywane już na stronie.

Tutoriale:
Tutorial, który głównie przetrenowałem: http://docs.asp.net/en/latest/tutorials/first-mvc-app/start-mvc.html
Zapis plików na dysk: http://www.mikesdotnetting.com/article/288/uploading-files-with-asp-net-core-1-0-mvc
7-godzinny(!) tutorial od Microsoftu: https://www.youtube.com/watch?v=zLj9BFbuLLI
Podstawy (15 min): https://www.youtube.com/watch?v=gOBZCbNMAak
W połączeniu z Angularem JS: http://www.codeproject.com/Articles/1084085/ASP-NET-Core-MVC-Using-WEB-API-And-AngularJS
Z Pluralsight płatny: https://www.pluralsight.com/courses/aspdotnet-core-1-0-fundamentals
Z Udemy: https://www.udemy.com/learn-aspnet-core-mvc-web-apis-ef-core-bonus-ios-app/

Blogi z DSP:
Opis MVC: http://doriansobacki.pl/2016/03/14/asp-net-mvc-6-z-czym-to-sie-je/
.NET Core template: http://www.pyrzyk.net/net-core-project-templates/
Migracje: http://langusblog.pl/index.php/2016/03/24/migracje-w-ef-core-w-poszukiwaniu-jednorozca/
Migracje: http://jakubskoczen.pl/entity-framework-i-code-first-migrations/
Migracje: http://hryniewski.net/post/entity-framework-code-first-zmiany-w-strukturze-bazy-danych-migrations
Testy: http://tomaszjarzynski.pl/mockowanie-asp-net-core-1-0-dsp16-czesc-6/

Related Posts

Share Facebooktwitterreddit

Be First to Comment

Leave a Reply

Your email address will not be published. Required fields are marked *