Category Archives: Informatics

ERR_CERT_INVALID

Bypass NET::ERR_CERT_INVALID di Browser Chrome di MacOS

Mungkin di antara kita pernah mendapati error semacam itu ketika sedang mengakses suatu URL di browser. Penyebabnya biasanya bisa karena situs tersebut menggunakan self-signed certificate atau sertifikat SSL-nya sudah expired.

Jika situs tersebut di bawah kontrol kita, bisa saja kita langsung memperbaharui sertifikat SSL-nya dengan yang valid. Namun, dalam kasus yang saya alami, hal tersebut di luar kontrol saya. Pihak yang saya manfaatkan servisnya tersebut sepertinya tidak sempat memperbaharui sertifikat SSL-nya.

Wajar saja sih karena URL tersebut merupakan URL untuk uji coba integrasi dengan servis yang mereka sediakan. Jadi mungkin mereka tidak terburu-buru untuk memperbaharuinya.

Nah, biasanya jika mendapati error sertikat SSL itu, browser akan mengeblok URL yang kita akses dengan menampilkan warning Your connection is not private. Biasanya kita bisa saja dengan mudah untuk mem-bypass error tersebut dengan cara mengklik hyperlink Proceed anyway. Namun pada error yang saya temui ini, entah kenapa tidak ada hyperlink tersebut.

Saya pun googling mengenai permasalahan tersebut dan tibalah di link StackOverflow ini. Dari thread tersebut saya baru tahu ternyata Chrome memiliki keyword rahasia yang bisa kita ketikkan ketika mendapati error tersebut. Kita cukup mengetikkan kata thisisunsafe dan voila, URL tersebut pun bisa kembali diakses.

Wkwkwkw. Cool trick. Rasanya kayak nggak percaya ada cara “unik” seperti itu. Tapi beneran bekerja ternyata triknya. 🤣🤣🤣

Implementasi Proses Bisnis dengan Camunda (Bag. 1)

Dalam pengembangan suatu sistem informasi biasanya diawali dengan aktivitas requirement gathering. Di dalam aktivitas tersebut biasanya seorang analis, selain mengumpulkan informasi dari klien terkait kebutuhan sistem informasi, ia juga akan menggambar diagram alir (flowchart) proses bisnis yang akan diimplementasi nantinya.

Adanya flowchart ini dapat membantu menyamakan pemahaman antara pihak analis dan subject matter expert (SME) terkait. SME bisa memeriksa dan memastikan bahwa proses bisnis yang tergambar pada flowchart tersebut sudah sesuai.

Setelah diagram proses bisnis tersebut disetujui (sign-off) oleh pihak SME, biasanya developer bisa memulai membangun aplikasi — entah itu web, desktop, atau mobile based — dengan mengacu pada diagram tersebut.

Katakanlah aplikasi telah selesai dibuat. Pertanyaan berikutnya biasanya muncul. Bagaimanakah para stakeholder tahu bahwa aplikasi yang dibuat memang konsisten dengan proses bisnis yang sudah dirancang?

Dalam pemrograman biasa, kita biasanya akan membuat field status untuk menyatakan suatu proses bisnis sedang berada di task mana. Field status tersebut akan diperbaharui setiap kali suatu aksi — misalkan input data atau approval — dilakukan.

Dengan kata lain, status tersebut berperan dalam merepresentasikan suatu proses bisnis sedang berada di task mana. Pergantian status itu juga bisa kita gunakan dalam pengujian untuk memastikan ia telah sesuai dengan alur proses bisnis yang didefinisikan.

Pada kasus yang sederhana, field status tersebut cukup. Pada kasus yang sedikit lebih kompleks, misalkan ada beberapa parallel task yang harus dikerjakan sebelum aktor bisa melangkah ke task berikutnya, field status itu mungkin cukup tapi agak tricky untuk men-tracking status tiap parallel task tersebut. Kita perlu membuat field yang lain untuk menyimpan parallel task mana yang sudah dikerjakan.

Belum lagi kita perlu menyiapkan field untuk menyimpan waktu kapan tiap aksi dilakukan. Dengan kondisi yang demikian, tentunya akan terdapat banyak boilerplate code yang kita perlu implementasi.

Untungnya hal-hal tersebut dapat direduksi dengan memanfaatkan workflow engine yang sudah banyak bertebaran di sana. Untuk dapat menggunakannya kita perlu menggambarkan proses bisnis yang ingin kita implementasi dengan mengikuti standar BPMN (Business Process Model and Notation).

BPMN ini sepintas agak mirip dengan flowchart. BPMN memiliki lebih banyak notasi yang lebih detail dari segi kegunaannya. Untuk simbol gateway misalnya. Ada beberapa macam gateway di BPMN yang bisa digunakan seperti parallel gateway, inclusive gateway, dan exclusive gateway. Lalu ada simbol timer untuk menyatakan kapan suatu event akan dimulai atau selesai.

Contoh BPMN dengan melibatkan 3 aktor

Dari sisi programming, penggunaan workflow engine tentunya akan memudahkan, terutama untuk implementasi suatu proses bisnis yang kompleks dan panjang. Programmer bisa lebih fokus pada aliran data dalam proses bisni. Proses bisnis juga menjadi lebih auditable. Pihak analis dan SME juga dapat melihat sistem informasi yang diimplementasi memang konsisten dengan proses bisnis yang sudah dirancang dan disepakati di awal.

Ada banyak workflow engine yang bertebaran di luar sana. Salah satunya adalah Camunda, sesuai dengan judul tulisan ini. Camunda adalah Java-based workflow engine. Kita bisa menjalankan Camunda ini sebagai service yang terpisah atau embedded di dalam aplikasi Java kita. Namun sebetulnya sistem informasi yang kita bangun tidak harus menggunakan bahasa Java untuk dapat menggunakan Camunda ini karena Camunda menyediakan opsi REST API untuk integrasi.

Kenapa Camunda? Keputusan menggunakan Camunda ini sendiri sebetulnya karena rekomendasi dari partner kami. Kebetulan saya pribadi lebih banyak spend waktu sebagai Java developer jadi learning curve-nya tidak begitu curam untuk mempelajari bagaimana implementasi dengan menggunakan Camunda ini. Apalagi dibantu juga dengan dokumentasinya yang lengkap.

Selain itu Camunda juga memiliki fitur lain seperti menyediakan modeler untuk merancang proses BPMN. Lalu juga memiliki dashboard (cockpit) untuk visualisasi status process instanceprocess instance yang berjalan di dalam BPMN.

Saya sendiri sejujurnya agak telat mengetahui pasal BPMN ini. Mungkin baru sekitar 3 tahun yang lalu. Namun baru benar-benar memanfaatkannya untuk sebuah projek baru-baru ini.

Dahulu ketika kuliah Sistem Informasi sepertinya belum pernah disinggung pasal ini. Mungkin karena ketika itu belum terlalu populer. BPMN 2.0 sendiri baru diluncurkan pada Desember 2013.

Dalam tulisan berikutnya, saya akan mencoba membuat contoh sederhana bagaimana Camunda dapat diimplementasikan.

Mengatasi WordPress Redirect Hack

Beberapa hari yang lalu ada seorang teman yang meminta tolong untuk mengecek error yang terjadi di websitenya. Ia menggunakan WordPress.org sebagai CMS (Content Management System) webnya.

Katanya ia tidak bisa login ke dalam webnya. Setiap kali membuka halaman apa pun di webnya, ia kena redirect ke halaman lain.

Saya pun mencoba mengakses webnya. Ternyata benar, saya juga selalu kena redirect setiap mengakses halaman manapun. Berikut ini adalah tampilan web tujuan redirect tersebut:

Web tujuan redirect

Kadang-kadang juga di-redirect ke halaman berikut ini:

Web tujuan redirect yang lain

Saya mencoba googling terkait permasalahan ini. Rupanya permasalahan ini adalah hal yang cukup umum terjadi di WordPress.org. Saya menemukan beberapa petunjuk untuk mengatasi masalah ini setelah membaca artikel ini.

Secara logika, bagi yang sudah familiar dengan pemrograman web, pasti akan mencari di mana letak script yang menjalankan perintah redirect ini. Kita bisa melihat source code dari halaman letak di mana kita kena redirect dengan cara menekan CTRL+U.

Continue reading
ITMS-90809: Deprecated API Usage

[Solved] ITMS-90809: Deprecated API Usage – UIWebView API Deprecation

Yesterday I was facing an issue when submitting my application to App Store. Not long after my submission, I got an email from Apple with title as you can see in the top of this article. It said that my application has an issue—i.e., ITMS-90809: Deprecated API Usage.

This issue happened because my app uses UIWebView class which is already deprecated. And they suggest developers to use WKWebView instead.

Actually I had been facing this issue since my first submission in early February. But I was too lazy to solve the issue 😬. At that time the issue was just a warning. Apple still accepted our app.

However, this time I couldn’t escape anymore. I ought to solve this issue in order the app to be accepted.

I searched the solutions for this matter in the internet. Actually the solution is pretty obvious. UIWebView must be replaced with WKWebView. The problem is I didn’t remember (or know 😝) which codes that use UIWebView.

Thanks to this thread that gives me some hints. There are possibilities that our dependency modules use UIWebView. To find out which files that contain UIWebView, we can run command grep -r UIWebView node_modules/* in the root of the project. After executing that command, I got this following:

Result of command “grep -r UIWebView node_modules/*”

Most of the words of “UIWebView” which are found are located in comments. But apparently in my case there is one line of code that uses UIWebView. That line of code is from module “react-native-device-info”.

Then I also tried to search it directly in XCode just to double-check. XCode also gave quite similar result.

Search result of UIWebView in XCode

So, in my case the culprit was the “react-native-device-info” module. I was still using v2 at that time. After reading its documentation in this link, I needed to upgrade it to minimum v3. Then I upgraded it to v3.

Boom! The issue was solved. I then submitted my app to Apple Store and it has been successfully accepted. 😃

Mengatasi Konflik Subnet antara Jaringan Lokal dan VPN di MacOS

Baru-baru ini saya menemukan masalah ketika mencoba mengakses beberapa server dengan VPN (Virtual Private Network) kantor menggunakan wifi di rumah dari MacBook. Jika menggunakan wifi kantor, biasanya tidak ada masalah.

Untuk browsing biasa, sebenarnya tidak ada masalah. Namun ketika mencoba mengakses via SSH ke server yang berada di jaringan VPN, selalu gagal terhubung. Saya ping juga pun jaringan gagal menemukan server yang dimaksud.

Gagal ping server gitlab yang ada di IP 192.168.0.104

Sebagai informasi, di kantor saya menggunakan layanan internet dari Megavision. Sementara di rumah saya menggunakan layanan internet dari First Media. Saya sempat berpikir apakah karena faktor settingan router-nya ya.

Selanjutnya saya mencoba mengetes koneksi VPN tersebut dari HP Android saya. Masih di jaringan wifi yang sama. Ternyata saya bisa mengakses server-server tersebut. Artinya tidak ada masalah pada settingan router wifi.

Saya mencoba menge-ping IP address MacBook dari HP Android saya. Tidak bisa. IP address tidak ditemukan. Lucunya, jika saya menge-ping IP address HP Android dari MacBook, ping berhasil.

Ping MacBook di IP 192.168.0.18 dari HP Android gagal
Ping HP Android di IP 192.168.0.9 dari MacBook berhasil

Di situ saya menyadari ternyata default gateway pada kedua device ini berbeda. HP Android menggunakan default gateway dari jaringan VPN. Sementara MacBook masih menggunakan jaringan lokal (local network). Karena itu MacBook masih bisa menemukan device HP Android, sedangkan HP Android tidak bisa menemukan IP MacBook.

Hal tersebut bisa terjadi, khususnya di MacBook, karena subnet local network di wifi rumah saya (192.168.0.1/24) juga di-cover oleh jaringan VPN tersebut sehingga terjadi konflik. Itulah sebabnya saya tidak bisa terhubung ke server di jaringan VPN dengan IP address 192.168.0.xxx. Sedangkan untuk server dengan IP address di subnet yang lain seperti 172.19.211.xxx, saya bisa mengaksesnya.

Tapi saya masih belum paham kenapa MacBook menggunakan default gateway dari local network. Sedangkan HP Android otomatis menggunakan default gateway dari jaringan VPN.

Kemudian saya menjadi kepikiran. Jaringan wifi kantor kan menggunakan subnet 192.168.1.1/24. Pantas saja koneksi VPN-nya lancar-lancar saja.

Solusi yang pasti untuk masalah ini sebenarnya adalah dengan mengubah subnet dari jaringan wifi rumah ke subnet selain 192.168.0.1/24 (dan subnet lain yang berpotensi konflik dengan subnet di dalam jaringan VPN). Namun dalam beberapa kasus, mungkin kita tidak memiliki akses untuk melakukan pengaturan tersebut.

Ada alternatif cara lain yang juga bisa menjadi solusi. Kita bisa menambahkan route pada routing table MacBook agar semua traffic ke IP address di subnet 192.168.0.1/24 diarahkan melalui jaringan VPN.

Routing tables ketika awal terhubung ke VPN

Dari routing tables di atas kita bisa melihat IP address 192.168.0.xxx (Destination 192.168.0) diasumsikan berada dalam local network yang sama dengan host (link#4). Gateway tersebutlah yang ingin kita ubah agar traffic diarahkan ke jaringan VPN.

Sebelumnya, kita perlu menghapus terlebih dahulu route untuk destinasi tersebut dengan menjalankan command berikut dari terminal:
$ sudo route -n delete -net 192.168.0/24
delete net 192.168.0

Selanjutnya kita menambahkan kembali route dengan destinasi tadi, tapi kali ini mengarahkannya ke gateway VPN:
$ sudo route -n add -net 192.168.0/24 192.168.20.19
add net 192.168.0: gateway 192.168.20.19

Dalam kasus di atas IP address gateway VPN adalah 192.168.20.19. Berikut ini adalah perubahan routing tables yang telah diterapkan:

Routing tables yang baru

Kini saya sudah bisa mengakses server yang ada di jaringan VPN.

Server Gitlab yang ada di IP 192.168.0.104 bisa merespon

Namun solusi ini hanya temporary sifatnya. Jika kita melakukan re-connect ke wifi tadi, routing tables ini akan kembali seperti semula. Tentu saja setelah itu kita perlu melakukan pengaturan route lagi. Jika ingin permanen, solusi dengan mengubah subnet jaringan lokal wifi tadi lah caranya.

Meningkatkan Ukuran Boot Disk di VM Instance Google Compute Engine

Tulisan ini adalah dokumentasi mengenai bagaimana cara meningkatkan ukuran disk yang digunakan oleh suatu VM instance di Google Compute Engine. Dengan teknologi cloud computing sekarang hal itu bisa dilakukan dengan cukup mudah.

Mengecek Sisa Disk

Sebelum memutuskan untuk melakukan resizing disk biasanya kita ingin memastikan berapa GB disk yang digunakan dan yang tersisa. Cara untuk memastikannya adalah dengan masuk ke dalam server melalui SSH kemudian menjalankan perintah df -h. Partisi /dev/sda1 adalah yang kita cari.

Dalam kasus saya di bawah ini, partisi /dev/sda1 yang berkapasitas 10 GB sudah terisi penuh 100%.

Sejauh ini yang saya ketahui dari halaman preview VM instance, kita belum bisa melihat angka berapa penggunaan disk atau sisa disk tersedia. Hanya bisa melihat angka kapasitas total disk saja.

Preview Boot Disk VM Instance

Melakukan Resizing Boot Disk

Selanjutnya berikut ini langkah-langkah melakukan resizing atau meningkatkan ukuran disk di VM instance Google Compute Engine kita.

Halaman Compute Engine
Halaman Compute Engine
  • Step 2: Klik menu Disks di sidebar.
  • Step 3: Klik nama disk yang ingin kita resize.
  • Step 4: Pada bagian atas halaman detail disk, klik tombol Edit.
  • Step 5: Pada field Size, masukkan ukuran baru yang ingin diterapkan untuk disk tersebut.
  • Step 6: Pada bagian bawah halaman tersebut, klik tombok Save untuk menerapkan perubahan.
  • Step 7: Tunggu beberapa saat sampai notifikasi yang muncul memberitahukan bahwa proses updating telah selesai. Jika sudah selesai, pada halaman detail disk akan menunjukkan size yang baru.
Halaman detail disk menunjukkan angka size yang baru
  • Step 8: Karena yang saya resize adalah boot partition, maka VM instance perlu di-reboot agar efek perubahannya dapat terlihat.
  • Step 9: Verifikasi perubahan dengan mengeceknya menggunakan command df -h.
Kapasitas Disk /dev/sda1 kini sebesar 50GB
Kapasitas Disk /dev/sda1 kini sebesar 50GB

Untuk step 8 dan 9 akan berbeda jika yang kita resize bukan boot partition. Kita tidak perlu melakukan reboot VM instance. Namun, ada beberapa command yang perlu kita eksekusi agar efek perubahan dapat diterapkan.

[Solved] Jaspersoft Studio Glitches on Ubuntu

Yesterday I installed Jaspersoft Studio for the first time in my laptop. I’m using Ubuntu 17.10 as the operating system for my laptop.

I don’t usually work on Jasper Reports. But there was an error in a report on a project that I’m working on that needed to be fixed ASAP.

It was just a little error actually. So I decided to fix it myself. I installed Jaspersoft Studio 6.2.2 in my laptop. Since I’m using Ubuntu, I downloaded the .deb one.

Then I opened up the app. Strangely when I opened my jrxml file, the report design didn’t show up. There was an error message displayed but then it quickly disappeared before I could even read it (but I could quickly take a screenshot of the error message, haha). Moreover, the app itself was running very slowly.

Error opening the jrxml file on Ubuntu 17.10

Error opening the jrxml file on Ubuntu 17.10

So then I tried to download and install the .tgz one, hoping this time it could work. Still there was no luck. It still had the same problem.

I then googled the issue and, thanks God, finally I came accross this article in jaspersoft community forum. Apparently the problem is the app by default is not compatible with the version of GTK+3 used by Ubuntu. Fortunately the solution is easy. We just need to insert the magic words i.e. export SWT_GTK3=0 into the script runubuntu.sh.

#!/bin/bash
export SWT_GTK3=0
DIR=$(dirname "$0")
export UBUNTU_MENUPROXY=0;
"$DIR"/Jaspersoft\ Studio $*

Then execute again the script runubuntu.sh. Tadaaa….! Finally it works.

Yayyy... now it can show up

Yayyy… now the report design can show up