Membuat aplikasi obrolan Node.js dengan Socket.IO di Azure Cloud Service (klasik)

Petunjuk / Saran

Socket.IO sekarang didukung secara asli di Azure. Untuk memperluas skala aplikasi Socket.IO agar dapat menangani ribuan koneksi, sering kali menimbulkan rasa frustrasi. Sekarang setelah Azure secara asli mendukung Socket.IO, Anda dapat membiarkan Azure menangani skalabilitas dan ketersediaan. Pelajari selengkapnya tentang cara menjalankan aplikasi Socket.IO apa pun di Azure dengan beberapa baris kode.

Penting

Cloud Services (klasik) sekarang tidak digunakan lagi untuk semua pelanggan per 1 September 2024. Setiap penyebaran yang sedang berjalan akan dihentikan dan dimatikan oleh Microsoft dan data akan hilang secara permanen mulai Oktober 2024. Penyebaran baru sebaiknya menggunakan Azure Resource Manager yang baru berdasarkan model penyebaran Azure Cloud Services (dukungan tambahan).

Socket.IO menyediakan komunikasi real time antara server Node.js dan klien. Tutorial ini memandu Anda melalui hosting aplikasi obrolan berbasis socket.IO di Azure. Untuk informasi selengkapnya tentang Socket.IO, lihat socket.io.

Cuplikan layar berikut menunjukkan aplikasi yang telah selesai:

! [Jendela browser yang menampilkan layanan yang dihosting di Azure][completed-app]

Prasyarat

Pastikan bahwa produk dan versi berikut ini sudah diinstal agar berhasil menyelesaikan contoh dalam artikel ini:

Membuat Proyek Layanan Cloud

Langkah-langkah berikut membuat proyek layanan cloud yang menghosting aplikasi Socket.IO.

Dari Menu Mulai atau Layar Mulai, cari Windows PowerShell. Setelah itu, klik kanan pada Windows PowerShell kemudian pilih Jalankan Sebagai Administrator.
Buat direktori dengan nama c:\node.
```
PS C:\> md node
```
Ubah direktori ke direktori c:\node
```
PS C:\> cd node
```
Masukkan perintah berikut untuk membuat solusi baru bernama chatapp dan peran pekerja bernama WorkerRole1 :
```
PS C:\node> New-AzureServiceProject chatapp
PS C:\Node> Add-AzureNodeWorkerRole
```
Anda melihat respons berikut:

Unduh Contoh Obrolan

Untuk proyek ini, kami menggunakan contoh obrolan dari repositori [Socket.IO GitHub]. Lakukan langkah-langkah berikut untuk mengunduh contoh dan menambahkannya ke proyek yang sebelumnya Anda buat.

Buat salinan lokal repositori dengan menggunakan tombol Kloning. Anda juga dapat menggunakan tombol ZIP untuk mengunduh proyek.
Navigasikan struktur direktori repositori lokal hingga Anda tiba di direktori contoh\obrolan. Salin isi direktori ini ke direktori C:\node\chatapp\WorkerRole1 yang dibuat sebelumnya.

Item yang disorot di cuplikan layar sebelumnya adalah file yang disalin dari direktori examples\chat
Di direktori C:\node\chatapp\WorkerRole1, hapus file server.js, lalu ganti nama file app.js menjadi server.js. Langkah ini menghapus file server.js default yang dibuat sebelumnya oleh cmdlet Add-AzureNodeWorkerRole dan menggantinya dengan file aplikasi dari contoh obrolan.

Ubah Server.js dan Instal Modul

Sebelum menguji aplikasi di emulator Azure, kita harus membuat beberapa perubahan kecil. Lakukan langkah-langkah berikut ke file server.js:

Buka file server.js di Visual Studio atau editor teks apa pun.

Temukan bagian Dependensi modul di awal server.js dan ubah baris yang berisi sio = require('.. //.. lib//socket.io') ke sio = require('socket.io') sebagai berikut:

var express = require('express')
  , stylus = require('stylus')
  , nib = require('nib')
//, sio = require('..//..//lib//socket.io'); //Original
  , sio = require('socket.io');                //Updated
  var port = process.env.PORT || 3000;         //Updated

Untuk memastikan aplikasi mendengarkan pada port yang benar, buka server.js di Notepad atau editor favorit Anda, lalu ubah baris berikut dengan mengganti 3000 dengan process.env.port sebagai berikut:

//app.listen(3000, function () {            //Original
app.listen(process.env.port, function () {  //Updated
  var addr = app.address();
  console.log('   app listening on http://' + addr.address + ':' + addr.port);
});

Setelah menyimpan perubahan pada server.js, gunakan langkah-langkah berikut untuk menginstal modul yang diperlukan, lalu uji aplikasi di emulator Azure:

Di Azure PowerShell, ubah direktori ke direktori C:\node\chatapp\WorkerRole1 dan gunakan perintah berikut untuk menginstal modul yang diperlukan oleh aplikasi ini:
```
PS C:\node\chatapp\WorkerRole1> npm install
```
Perintah ini menginstal modul yang tercantum dalam file package.json. Setelah perintah selesai, Anda akan melihat output yang mirip dengan cuplikan layar berikut:
Karena contoh ini awalnya adalah bagian dari repositori GitHub Socket.IO, dan langsung mereferensikan pustaka Socket.IO dengan jalur relatif, Socket.IO tidak direferensikan dalam file package.json, jadi kita harus menginstalnya dengan mengeluarkan perintah berikut:
```
PS C:\node\chatapp\WorkerRole1> npm install socket.io --save
```

Uji dan Terapkan

Luncurkan emulator dengan mengeluarkan perintah berikut:
```
PS C:\node\chatapp\WorkerRole1> Start-AzureEmulator -Launch
```
Nota

Jika Anda mengalami masalah dengan peluncuran emulator, misalnya: Start-AzureEmulator : Terjadi kegagalan tak terduga. Detail: Menemui kegagalan tak terduga Objek komunikasi, System.ServiceModel.Channels.ServiceChannel, tidak dapat digunakan untuk komunikasi karena dalam keadaan Rusak.

Instal ulang AzureAuthoringTools v 2.7.1 dan AzureComputeEmulator v 2.7 - pastikan versi tersebut cocok.
Buka browser dan navigasikan ke http://127.0.0.1.
Saat jendela browser terbuka, masukkan nama panggilan lalu tekan enter. Langkah ini memungkinkan Anda memposting pesan sebagai nama panggilan tertentu. Untuk menguji fungsionalitas multi-pengguna, buka lebih banyak jendela browser menggunakan URL yang sama dan masukkan nama panggilan yang berbeda.
Setelah menguji aplikasi, hentikan emulator dengan mengeluarkan perintah berikut:
```
PS C:\node\chatapp\WorkerRole1> Stop-AzureEmulator
```
Untuk menerapkan aplikasi ke Azure, gunakan cmdlet Publish-AzureServiceProject. Contohnya:
```
PS C:\node\chatapp\WorkerRole1> Publish-AzureServiceProject -ServiceName mychatapp -Location "East US" -Launch
```
Penting

Pastikan untuk menggunakan nama unik. Jika tidak, proses publikasi akan gagal. Setelah penerapan selesai, browser akan terbuka dan menavigasi ke layanan yang diterapkan.

Jika Anda menerima pesan kesalahan yang menyatakan nama langganan yang disediakan tidak ada di profil penerbitan yang diimpor, Anda harus mengunduh dan mengimpor profil penerbitan untuk langganan Anda sebelum penerapan ke Azure. Lihat bagian Menerapkan Aplikasi ke Azure di bagian Membuat dan menerapkan aplikasi Node.js ke Azure Cloud Service

! [Jendela browser yang menampilkan layanan yang dihosting di Azure][completed-app]

Nota

Jika Anda menerima pesan kesalahan yang menyatakan nama langganan yang disediakan tidak ada di profil penerbitan yang diimpor, Anda harus mengunduh dan mengimpor profil penerbitan untuk langganan Anda sebelum penerapan ke Azure. Lihat bagian Menerapkan Aplikasi ke Azure di bagian Membuat dan menerapkan aplikasi Node.js ke Azure Cloud Service

Aplikasi Anda sekarang berjalan di Azure, dan dapat menyampaikan pesan obrolan antara klien yang berbeda menggunakan Socket.IO.

Nota

Demi kesederhanaan, sampel ini terbatas pada obrolan antara pengguna yang terhubung ke instans yang sama. Ini berarti, jika layanan cloud membuat dua instans peran pekerja, pengguna hanya akan dapat mengobrol dengan orang lain yang terhubung ke instans peran pekerja yang sama. Untuk menskalakan aplikasi agar berfungsi dengan beberapa instans peran, Anda dapat menggunakan teknologi seperti Service Bus untuk berbagi status penyimpanan Socket.IO di seluruh instans. Misalnya, lihat sampel penggunaan Antrean Service Bus dan Topik di Azure SDK untuk repositori Node.js GitHub.

Langkah selanjutnya

Dalam tutorial ini, Anda mempelajari cara membuat aplikasi obrolan dasar yang dihosting di Azure Cloud Service. Untuk mempelajari cara meng-hosting aplikasi ini di Situs Web Azure, lihat Membuat Node.js Aplikasi Obrolan dengan Socket.IO di Situs Web Azure.

Untuk informasi selengkapnya, lihat juga Node.js Developer Center.

Last updated on 2024-07-23