Menulis dan Membaca NFC dengan Menggunakan NDEF Proximity Library (Windows Phone 8 Tutorial)

Nokia NFC Tag

Nokia NFC Tag

Ketika pertama kali dengar adanya fitur NFC pada Windows Phone 8, reaksi saya dapat digambarkan dengan satu kata: ”meh”. Saat itu saya memang tidak terlalu tertarik untuk meng-explore lebih jauh. Belum lagi ketika saya mencari NFC tag di BEC dan Nokia Center Bandung, hampir semuanya memberikan respon yang sama: “NFC itu apa ya?” Ouch.

Namun, karena baru-baru ini  dapat pinjaman NFC tag dari Radya Labs (Thanks alot, guys!), saya akhirnya bisa mengalami sendiri bagaimana NFC bisa diimplementasikan. Saat itu kesan saya dapat bisa digambarkan dengan satu kata: ”Awesome!!”. Ada semacam “magical feeling” ketika menggunakannya. Otak saya langsung berputar memikirkan banyak sekali potensi yang bisa dikembangkan dari NFC ini.

NFC (Near Field Communication) adalah teknologi nirkabel yang digunakan untuk pertukaran data antar device dari jarak beberapa cm saja. NFC biasanya diimplementasikan pada tiga bagian, penulis NFC, pembaca NFC, dan terminal NFC. Terminal NFC yang tidak menggunakan listrik biasa disebut dengan NFC Tag. Gambar di atas adalah contoh dari NFC tag. Namun ada banyak bentuk NFC tag yang lain seperti : sticker, gantungan kunci, kartu membership, dll.

Sama seperti halnya barcode, WIFI, dan bluetooth, tujuan penggunaan NFC adalah transmisi data. Perbedaanya adalah NFC memiliki kapasitas yang lebih tinggi dari barcode, dan penggunaanya lebih mudah jika dibandingkan dengan bluetooth maupun WIFI. Namun tentunya ukuran data yang bisa disimpan pada NFC tag masih terbatas.

Pada aplikasi mobile, skenario dasar penggunaan NFC biasanya melibatkan langkah-langkah sebagai berikut :

  1. Menuliskan data pada NFC Tag
  2. Membaca data pada NFC Tag

Data yang dituliskan pada NFC dapat berupa sebuah text, maupun perintah-perintah tertentu. Contoh perintah yang dapat dituliskan pada NFC tag adalah :

  1. Membuka aplikasi
  2. Membuka link URL
  3. Membuka halaman setting pada Windows Phone
  4. Menampilkan posisi geocordinate
  5. link ke jejaring sosial
  6. membuka halaman telepon
  7. dll (sumber)

Contoh penggunaan NFC di dunia nyata adalah sebagai berikut:

  1. Suatu restauran menanamkan NFC tag pada kartu member pelanggannya. Pada NFC tag tersebut tersimpan data member, seperti nama dan nomor member. Ketika pelanggan tersebut datang ke restaurant, suatu aplikasi NFC reader akan membaca informasi member tersebut, dan dengan berbekal informasi yang tersimpan, restauran tersebut dapat memberikan diskon;
  2. Sebuah toko menempelkan poster yang di dalamnya terdapat NFC Tag, pelanggan dapat melakukan tapping pada NFC Tag, dan mendapatkan informasi tentang toko tersebut;
  3. Panitia suatu event pameran mengharapkan pengunjungnya untuk mengunduh aplikasi pameran tersebut pada market. Panitia tersebut dapat memasang NFC tag pada pintu masuk pameran, dan pengunjung yang tapping smartphone-nya pada NFC tag tersebut akan langsung dapat mendownload aplikasi tersebut;
  4. Dan masih banyak lagi.

Format Data Pada NFC

Data yang dituliskan pada NFC tag dapat berupa data biner apapun. Namun, untuk dapat dibaca pada semua device, data yang dituliskan pada NFC harus menggunakan format data NFC Data Exchange Format (NDEF). Sampai saat ini Windows Phone hanya mendukung format data NDEF (sumber) .

NDEF Format (http://www.developer.nokia.com/Community/Wiki/Understanding_NFC_Data_Exchange_Format_(NDEF)_messages)

Di dalam format data NDEF terdapat “NDEF Message”, dimana “NDEF message” terdiri dari beberapa “NDEF Record” (lihat gambar di atas). Teks atau perintah yang kita tuliskan disimpan pada “NDEF Record”. Namun, perlu diingat meskpiun kita dapat menyimpan beberapa record dalam satu “NDEF Message”, Windows Phone hanya akan mengeksekusi record yang pertama. Contoh : Semisal kita menyimpan perintah untuk membuka link pada record yang pertama, dan menyimpan perintah untuk membuka aplikasi pada record yang kedua, maka windows phone hanya akan mengeksekusi perintah yang tersimpan pada record yang pertama (membuka link). Oleh karena itulah pada kebanyakan kasus kita hanya menyimpan di satu record saja.

Membuat Project pada Visual Studio

wp_ss_20130419_0001

Pada bagian ini kita akan membahas bagaimana membuat aplikasi untuk menulis dan membaca NFC dengan menggunakan NDEF Proximity Library. Meskipun windows phone sudah menyediakan Proximity API untuk menuliskan dan membaca NFC, namun API yang disediakan tidak selengkap dengan yang ada pada NDEF Proximity Library (sumber). Selain itu, dari pengalaman mencoba kedua API, saya merasa penggunaan NDEF Proximity Library ini lebih mudah,

Aplikasi yang akan kita buat terdiri dari tiga tombol yaitu : “TuliskanPesan”, “Subscribe”, dan “Berhenti Subscribe”.   Ketika user melakukan tap pada tombol “tuliskan pesan” , aplikasi akan mempublish text pada NFC. Ketika user melakukan tap pada tombol subscribe, maka aplikasi akan dapat membaca NFC tag. Proses ini akan dijelaskan lebih detail pada bagian selanjutnya.

Mempersiapkan Project

ID_Proximity

Pertama-tama buatlah sebuah project Windows Phone 8. Untuk dapat menggunakan API proximity, anda harus menambahkan Kapabillitas ID_CAP_Proximity pada file WMAppManifest.xml (lihat gambar di atas). Anda akan mendapatkan eksepsi kesalahan jika hal ini tidak dilakukan. Berikut adalah cara untuk menambahkan kapabilitas tersebut:

  1. Klik dua kali WMAppManifest.xml
  2. Pilih tab “capabilities”
  3. Centang ID_CAP_Proximity
  4. Save

Karena kita akan menggunakan NDEF Proximity Library maka kita harus menambahkannya pada reference project kita. Caranya adalah sebagai berikut :

  1. Pilih Tools –> Library Package Manager –> Package Manager Console
  2. Ketik Install-Package NdefLibrary
  3. Enter.

Pertama-tama kita akan membuat UI. Pada halaman MainPage.xaml, ubah grid ContentPanel menjadi seperti ini

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <StackPanel>
                <Button x:Name="btTuliskanPesan" Content="Tuliskan Pesan" Tap="btTuliskanPesan_Tap"/>
                <Button x:Name="btSubscribe" Content="Subscribe" Tap="btSubscribe_Tap"></Button>
                <Button x:Name="btBerhentiSubscribe" Content="Berhenti Subscribe"></Button>
                <TextBlock Name="tbText" Margin="12"></TextBlock>
            </StackPanel>
</Grid>

Proses Menuliskan Pesan pada NFC

Sebelum menuliskan kode program, ada baiknya anda mempelajari proses menuliskan pesan yang terjadi aplikasi tutorial ini. Proses yang terjadi ketika menuliskan data dapat digambarkan dengan flowchart sebagai berikut :

Drawing1

Kode Program untuk Menuliskan Data pada NFC

Pertama-tama kita akan menambahkan namespace reference pada halaman MainPage.cs:

using Windows.Networking.Proximity;
using System.Runtime.InteropServices.WindowsRuntime;
using NdefLibrary.Ndef;

selanjutnya, kita akan menambahkan tiga variabel pada kelas MainPage :

        private ProximityDevice _device;

        //variabel ini digunakan untuk menyimpan SUBSCRIBE ID sehingga kita bisa berhenti melakukan subscribe
        private long _subscriptionIdNdef;

        //variabel ini digunakan untuk menyimpan PUBLISH ID sehingga kita bisa berhenti melakukan publish
        private long _publishingMessageId;

 


Variabel _device mewakili device yang menggunakan Proximity API (handphone). Kita menggunakan variabel ini untuk mempublish text dan melakukan subscribe data. Variabel _subscriptionIdNdef berfungsi menyimpan subscribtion ID. Subscribtion ID ini digunakan ketika menghentikan proses subscribe. Variabel _publishingMessageId berfungsi menyimpan Publishing ID. Publishing ID ini digunakan ketika menghentikan proses publish.

Selanjutnya kita akan menuliskan kode program untuk menghandle tap pada button “tuliskan pesan”. Kodenya adalah sebagai berikut :

   1:    private void btTuliskanPesan_Tap(object sender, System.Windows.Input.GestureEventArgs e)
   2:          {
   3:              Write();
   4:          }
   5:          //melakukan initialisasi pada NFC
   6:  
   7:          private void Write()
   8:          {
   9:              var message = new NdefMessage();
  10:  
  11:  
  12:              var record1 = new NdefTextRecord() { Text = "Windows Phone Rocks!!" };
  13:              message.Add(record1);
  14:  
  15:              //Publish the record using the proximity device
  16:              PublishRecord(message, true);
  17:          }
  18:          private void PublishRecord(NdefMessage message, bool writeToTag)
  19:          {
  20:              if (!InitNFC()) return;
  21:  
  22:              // Pastikan tidak publish 2x
  23:              StopPublishingMessage();
  24:  
  25:  
  26:              // Ubah NDEF MEssage menjadi array of byte
  27:              var msgArray = message.ToByteArray();
  28:  
  29:              // Simpan ID publish sehingga kita bisa melakukan perintah untuk berhenti publish
  30:              _publishingMessageId = _device.PublishBinaryMessage((writeToTag ? "NDEF:WriteTag" : "NDEF"), msgArray.AsBuffer(), MessageWrittenHandler);
  31:              // Update status text for UI
  32:  
  33:              SetTextOutput("Tap handphone pada NFC");
  34:  
  35:          }
  36:          bool InitNFC()
  37:          {
  38:              _device = ProximityDevice.GetDefault();
  39:              if (_device != null)
  40:              {
  41:                  return true;
  42:              }
  43:              else
  44:              {
  45:                  //NFC Disabled
  46:                  return false;
  47:              }
  48:          }
  49:          private void SetTextOutput(string text)
  50:          {
  51:              Dispatcher.BeginInvoke(() =>
  52:              {
  53:                  tbText.Text = text;
  54:              });
  55:          }
  56:          private void MessageWrittenHandler(ProximityDevice sender, long messageid)
  57:          {
  58:  
  59:               StopPublishingMessage();
  60:               SetTextOutput("Publish!! Sekarang gunakan subscribe untuk melihat text");
  61:  
  62:  
  63:  
  64:  
  65:  
  66:          }
  67:          private void StopPublishingMessage()
  68:          {
  69:              if (_publishingMessageId != 0 && _device != null)
  70:              {
  71:                  // berhenti publish message
  72:                  _device.StopPublishingMessage(_publishingMessageId);
  73:                  _publishingMessageId = 0;
  74:  
  75:  
  76:              }
  77:          }

 

Fungsi InitNFC().  Fungsi ini digunakan untuk menginisialisasi variabel _device, sekaligus melakukan pengecekan apakah proximity device dapat digunakan. Jika proximity device tidak dapat digunakan, maka fungsi ini akan memberikan nilai kembalian false.

Fungsi Write(). Seperti yang dijelaskan sebelumnya, bahwa pada NDEF Message terdapat beberapa NDEF Record. Pada fungsi ini kita akan membuat variabel yang mewakili NDEF Message  dan NDEF Record. (kode di line 9-13).

Ada beberapa tipe record pada library NDEF Proximity. Karena record yang akan kita simpan berupa text, maka kita gunakan variabel bertipe NdefTextRecord. Namun jika kita ingin membuat record berupa link, kita dapat menggunakan variabel bertipe NdefUriRecord. Untuk referensi tipe record yang lain, anda dapat mengunjungi halaman ini.

Fungsi PublishRecord(). Pada fungsi ini kita akan mengubah NDEF Message yang telah kita buat menjadi array of byte. Array of byte inilah yang akan kita tuliskan pada NFC Tag. Untuk menuliskan array of byte pada NFC tag, kita memanggil fungsi PublishBinaryMessage yang dimiliki oleh kelas ProximityDevice.

   30:  _publishingMessageId = _device.PublishBinaryMessage((writeToTag ? "NDEF:WriteTag" : "NDEF"), msgArray.AsBuffer(), MessageWrittenHandler);

Ada tiga parameter pada fungsi PublishBinaryMessage yaitu : tipe message, NDEF message dalam bentuk array of byte, dan fungsi yang akan dipanggil ketika NDEF Message sudah terpublish ke dalam NFC Tag. Pada tutorial ini fungsi yang akan dipanggil bernama MessageWrittenHandler. Perlu diingat kalau setelah kita memanggil fungsi PublishBinaryMessage, user diharapkan melakukan tap pada NFC Tag. Oleh karena itu sebaiknya ada suatu pesan pemberitahuan bahwa user perlu melakukan tap pada NFC Tag.

Proses Membaca NFC Tag

Proses membaca NFC Tag lebih sederhana dibandingkan proses menuliskannya. Berikut adalah proses membaca TextRecord pada NFC Tag dalam skema flowcart :

Drawing2

Kode Program untuk Membaca NFC Tag

Berikut adalah kode program untuk membaca TextRecord pada NFC Tag.

   1:   private void btSubscribe_Tap(object sender, System.Windows.Input.GestureEventArgs e)
   2:          {
   3:              Subscribe();
   4:          }
   5:  
   6:          private void Subscribe()
   7:          {
   8:              if (InitNFC())
   9:              {
  10:                  //jika sekarang sedang subscribe, maka tidak perlu subscribe lagi
  11:                  if (_subscriptionIdNdef != 0) return;
  12:  
  13:                  //subscribe message. 
  14:                  //Fungsi MessageReceivedHandler akan dijalankan ketika device tapping NFC Tag
  15:                  _subscriptionIdNdef = _device.SubscribeForMessage("NDEF", MessageReceivedHandler);
  16:                  SetTextOutput("Tap handphone pada NFC");
  17:              }
  18:          }
  19:          private void MessageReceivedHandler(ProximityDevice sender, ProximityMessage message)
  20:          {
  21:              // Ubah format data NDEF menjadi Array of Byte
  22:              var rawMsg = message.Data.ToArray();
  23:              // Ubah dari array og byte menjadi NDEF MEssage
  24:              var ndefMessage = NdefMessage.FromByteArray(rawMsg);
  25:  
  26:  
  27:              foreach (NdefRecord record in ndefMessage)
  28:              {
  29:  
  30:                  var specializedType = record.CheckSpecializedType(true);
  31:  
  32:                  if (specializedType == typeof(NdefTextRecord))
  33:                  {
  34:                      NdefTextRecord textRecord = new NdefTextRecord(record);
  35:                      SetTextOutput(textRecord.Text);
  36:                  }
  37:                  else
  38:                  {
  39:                      SetTextOutput("Type Record Tidak di Handle");
  40:  
  41:                  }
  42:              }
  43:              // Update status text for UI
  44:  
  45:  
  46:          }

Fungsi Subscribe. Pada fungsi ini kita akan memanggil fungsi SubscribeForMessage yang dimiliki oleh kelas ProximityDevice. Fungsi SubscribeForMessage memiliki dua argumen yaitu tipe Message dan fungsi yang akan dipanggil ketika device berhasil membaca pesan dari NFC tag. Pada tutorial ini fungsi yang dipanggil bernama MessageReceivedHandler.

Fungsi MessageReceivedHandler. Fungsi ini akan dipanggil ketika aplikasi kita berhasil membaca data dari NFC Tag. Data yang didapat harus kita ubah dulu menjadi variabel yang bertipe NDEFMessage sebelum dapat kita data tersebut dapat kita gunakan. Setelah mendapatkan variabel bertipe NDEF Message, kita akan melakukan looping untuk membaca tiap record yang ada pada variabel tersebut. Record yang kita dapatkan dapat berupa NDEFTextRecordNdefUriRecord, dan lain sebagainya. Untuk mengetahui tipe record apa yang tersimpan, kita harus melakukan cek satu per satu (lihat kode pada line 27-42). Jika tipe record sesuai dengan apa yang kita inginkan, baru kita lakukan logic aplikasi kita (Semisal menampilkan pesan ke layar).

Sekian dan selamat mencoba :)

Kode aplikasi dapat didownload disini


So, what do you think ?