Aplikacja internetowa z czytnikiem RFID/NFC

Technologie RFID i NFC towarzyszą nam na co dzień. Karty bankomatowe, płatności telefonem, kontrole dostępów np. do biur czy chipy dla zwierząt bazują na jednej z tych dwóch technologii. Są one do siebie bardzo podobne, różnice są niewielkie. Czy mogą one znaleźć zastosowanie w aplikacjach webowych? W jaki sposób możesz wykorzystać czytnik RFID/NFC w swojej aplikacji internetowej? Jak aplikacja internetowa połączona z czytnikiem RFID/NFC może zmienić świat? O tym więcej w dzisiejszym artykule.

RFID vs NFC

Pierwsza pojawiła się technologia RFID (ang. radio-frequency identification).  W założeniach używa ona fal radiowych do przesyłania unikalnych kodów sczytywanych z tagów/kart, które znajdują się w zasięgu czytnika. Działa na kilku częstotliwościach:

  1. 125 kMz – niska częstotliwość, zasięg do 10cm
  2. 13,56 MHz – wysoka częstotliwość, zasięg do 1,5m
  3.  865 – 868 MHz, 902 – 928 MHz – ultra wysoka częstotliwość, zasięg do 12m
  4. 2.5 GHz – aktywne znaczki, zasięg do 100m

W zależności od urządzenia zasięg może ulec zmianie. RFID działa jedynie w jedną stronę czytnik -> karta/tag z możliwością odczytu i zapisu.

NFC jest młodszą technologią bazująca na RFID. Jest ona przystosowana do stosowania na bliskie odległości. Wykorzystuje częstotliwość 13,56 MHz oraz zasięg do 20 cm. Jednak w zależności od urządzenia może się to zmieniać. 

Komunikacja przebiega dwustronnie. Tak jak w RFID czytnik -> karta/tag umożliwiając odczyt i zapis. Dodatkowo między dwoma urządzeniami aktywnymi również może zachodzić przesył informacji.  


Czytnik RFID/NFC

Gdy kupowałam czytnik, przeglądnęłam wiele modeli. Od tych najtańszych przewodowych, po droższe modele działające na bluetooth. Z mojego doświadczenia mogę szczerze powiedzieć Ci, że im prostsze, tym lepsze. Dlaczego?

Czytniki bluetooth są bardzo drogie, chcąc się zdecydować na taki model, musisz dokładnie przeczytać, w jaki sposób działa, czy nie potrzebuje dodatkowego oprogramowania itd.

Najważniejszą rzeczą przy wybieraniu czytnika jest sprawdzenie, na jakiej częstotliwości działa. Dwie najbardziej popularne to 13,56 MHz i 125 kHz. Przy doborze kart również musicie zwrócić na to uwagę. To ważne, ponieważ niektóre modele działają tylko na jednej z nich. Oczywiście możecie zakupić taki czytnik, który będzie reagował na obu częstotliwościach, jednak są one droższe. Czy warto tylko dla wygody? Nie wiem, to już Twoja decyzja.

Ja zdecydowała się na wysoką częstotliwość, czyli 125kHz. Oto mój czytnik, oczywiście do niego jest jeszcze kabelek usb, ale jest mało fotogeniczny.  Model FF ID Reader, koszt około 140zł.

Połączenie aplikacji z czytnikiem

Czytniki najczęściej działają jako zwykłe emulatory klawiatury. Właśnie takie są nam potrzebne, aby nie narobić sobie zbytnich problemów. Podłączenie takiego czytnika nic nas nie kosztuje. W telefonach system NFC jest już wbudowany w większości modeli. Po co więc komplikować, jeśli wystarczy:

  1. Formularz online
  2. Czytnik – emulator klawiatury
  3. Odrobinę JSa

i gotowe!

W moim przypadku jest to zwykły formularz z jednym polem, które jest aktywne zaraz po wejściu na stronę i trzyma focus na inpucie. Emulator sczytując kod, wrzuca go w pole tekstowe i „wciska enter” więc nawet to nie wymaga naszej dodatkowej pracy. Zwykła obsługa JSowa, która po odebraniu kodu wykonuje proces biznesowy, po czym zwraca komunikat i czyści input. Koniec.

Poniżej jest przedstawiony przykład kodu z pliku twiga gdzie znajduje się kod formularza w Symfony 3.3 oraz fragment js’a. Od razu zaznaczę, nie jestem frontendowcem więc nie bijcie za best practice 🙂

{% block content %}
    <div class="row">
        {{ form_start(form, {'attr': {'class': 'real_time_check_form_code', 'id': 'real_time_check_form'}}) }}
        <div class="col-md-8 title">
            {{ form_errors(form) }}
            <h5>{{ 'presence.code'|trans }}</h5>
            {{ form_widget(form.code, {'attr':{'class':'form-control'}}) }}
        </div>
        {{ form_end(form) }}
        <div class="col-md-4"></div>
    </div>
{% endblock %}


{% block scripts %}
<script>
    $( document ).ready(function() {
        $("#real_time_check_form_code").focus();
    });

    $('.real_time_check_form_code').submit(function (event) {
            event.preventDefault();
            var formData = $("form").serialize();
            $('.loading-spinner').show();
            console.log(formData);
            $.ajax({
                url: '{{ path('presence_check') }}',
                type: "POST",
                data: formData,
                dataType: 'json',
            }).done(function(data) {
                console.log(data);
                noty({
                    layout: 'topRight',
                    text: data.message,
                    type: data.success ? 'success' : 'error'
                });

                if (data.success) {
                    $('.loading-spinner').hide();
                    $("#real_time_check_form").trigger('reset');
                }

            }).fail(function(data) {
                console.log(data);
                noty({
                    layout: 'topRight',
                    text: 'Opss, coś poszło nie tak. Spróbuj ponownie.',
                    type: 'error'
                });
            }).always(function() {
                $('.loading-spinner').hide();
            });

            return false;
    });
</script>
{% endblock %}

A formularz wygląda bardzo prosto:

Aplikacja internetowa połączona z czytnikiem RFID/NFC formularz

Do czego można wykorzystać czytnik w aplikacji? 

Taka funkcjonalność sprawdzi się w wielu aplikacjach:

  1. Sprawdzanie obecności – w każdej aplikacji do zarządzania gdzie występuje potrzeba sprawdzenia obecności tj. dzienniki, aplikacje dla szkółek sportowych, organizacji, grup zainteresowań itp.
  2. Ewidencje – czytniki kodów kreskowych również działają jak emulatory klawiatury, tagi NFC mogą być w formie naklejki dlatego np. aplikacje bibliotekarskie, prowadzenie domowej organizacji przedmiotów, kolejki płyt czy filmów.
  3.  Przychodzi Ci coś do głowy? Napisz w komentarzu i uzupełnij tę listę!

Wiele możliwości

Połączenie aplikacji internetowej z czytnikiem RFID/NFC czy kodów kreskowych nie jest często spotykane. Zwykle łączy się je z aplikacjami desktopowymi, specjalistycznymi dla konkretnej branży. Ja również byłam lekko zaskoczona, gdy mój klient wyraził taką potrzebę, aby połączyć jego dedykowaną aplikację, którą stworzyłam zintegrować z tą technologią. Jednak to, co wtedy wydawało mi się dziwne, dzisiaj bardzo dobrze się sprawdza i jest dużo tańszą alternatywą dla wielkich aplikacji do kontroli czasu pracy.

W internecie nie znalazłam jasnego tekstu na ten temat, gdy zabierałam się do pisania aplikacji i łączenia jej z technologią NFC. Dzisiaj po przerobieniu wielu czytników, które leżą w kartonie, góry kart o różnych częstotliwościach, dziesiątkach stron na Stacku również tych gdzie to ja zadawałam wiele pytań mądrym ludziom, udało mi się. Aplikacja działa, klient jest zadowolony z tego, jak usprawniło mu to codzienną pracę a ja jestem niesamowicie dumna z tego, jak wiele się nauczyłam. To, co wydawało się wariactwem na początku, stało się rzeczywistością. Może powiesz, że to nic niezwykłego. Szanuje. Dla mnie to wielka wygrana.

Czułeś się tak kiedyś? Byłeś dumny z tego, czego dokonałeś? Czy jest coś, co po wielu wzlotach i upadkach udało Ci się uruchomić? Napisz proszę w komentarzu, co to było. Świętujmy razem!

Podobne posty

Jestem programistką, która lubi mieć ręce pełne roboty. Do życia potrzebuje komputera z internetem i kubka gorącej kawy. Więcej na stronie o mnie.

Comments

  1. Cześć, dzięki 🙂 Czytnik FF ID Reader, koszt około 140 zł.
    Pewnie, zaraz spróbuje uzupełnić o fragmenty przyjęcia danych 🙂 Jednak zaznacze, że jest to dokładnie taka sama implementacja jak w przypadku pola tekstowego wysyłanego ajaxem. Czytnik działa jako emulator więc wrzuca kod w pole tekstowe i tyle 🙂

ZOSTAW ODPOWIEDŹ

Please enter your comment!
Please enter your name here