Sebarkan ke Azure

  • 7 menit

Latihan ini memerlukan kotak pasir. Sandbox memberi Anda akses ke sumber daya gratis. Langganan personal Anda tidak akan dikenakan biaya.

Anda hanya dapat menggunakan kotak pasir untuk menyelesaikan pelatihan di Microsoft Learn. Dilarang menggunakan kotak pasir dengan alasan apa pun karena dapat menyebabkan hilangnya akses ke kotak pasir secara permanen.

Untuk membuat situs Anda tersedia secara umum, Anda harus menyebarkannya ke Azure. Anda akan menggunakan ekstensi Azure App Service di Visual Studio Code untuk menyederhanakan proses.

Menginstal ekstensi Azure App Service

Mulai dengan menginstal ekstensi Azure App Service di Visual Studio Code:

  1. Di Visual Studio Code, pilih ikon Ekstensi.

    Screenshot showing the Extensions icon.

  2. Di bidang Ekstensi Pencarian, ketik App Service.

  3. Di bagian Azure App Service, pilih Instal.

Jika Anda sudah memiliki ekstensi Azure App Service, pastikan ekstensi tersebut diperbarui ke versi terbaru. Lihat tanggal terakhir diperbarui pada halaman ekstensi. Jika Anda menggunakan versi terbaru, Anda akan melihat node RESOURCES dengan node App Service.

Menyebarkan aplikasi

Jika Anda mengikuti langkah-langkah untuk mengkloning repositori starter, Anda seharusnya juga mengubah direktori ke folder starter sebelum membuka Visual Studio Code. Direktori starter berisi file manage.py yang memberi sinyal ke App Service bahwa Anda menyebarkan aplikasi web Django.

  1. Di Visual Studio Code, di toolbar, pilih ikon Azure.

    Screenshot showing the Azure icon.

  2. Pilih Masuk untuk masuk ke Azure dengan menggunakan akun yang sama dengan yang Anda gunakan untuk membuat kotak pasir.

  3. Pada bilah RESOURCES pada ekstensi Azure, arahkan kursor, dan pilih ikon + (tanda plus) untuk membuat sumber daya.

    Screenshot showing the App Service bar. The Deploy icon is highlighted.

  4. Jika diminta untuk memilih langganan, pilih langganan Azure Anda.

  5. Pilih Buat Aplikasi Web App Service....

    Screenshot showing how to create a new web app.

  6. Berikan nama unik untuk aplikasi Anda.

    Screenshot showing where to provide an app name.

  7. Pilih Python 3.9 sebagai tumpukan runtime.

    Screenshot showing the runtime stack selection.

  8. Pilih tingkat harga.

    Screenshot showing the the pricing tier selection.

    Ekstensi membuat aplikasi web Anda. Proses ini akan memakan waktu beberapa saat.

  9. Saat aplikasi web dibuat, Anda diminta untuk menerapkan aplikasi web ke App Service, pilih Sebarkan.

    Screenshot showing the deployment configuration option.

    Jika Anda melewatkan pemberitahuan untuk menyebarkan aplikasi atau menutup pemberitahuan, Anda juga dapat menyebarkan dengan menemukan App Service yang Anda buat, mengklik kanan file tersebut, dan pilih Sebarkan ke Aplikasi Web.

Situs Anda sekarang akan disebarkan!

Membuat server database

Sekarang buat database PostgreSQL.

  1. Pada bilah RESOURCES pada ekstensi Azure, arahkan kursor, dan pilih ikon + (tanda plus) untuk membuat sumber daya.

    Screenshot of the Databases extension, showing the Create Server icon.

  2. Jika diminta untuk memilih langganan, pilih langganan Azure Anda.

  3. Pilih Buat Server Basis Data....

    Screenshot showing how to create a new database server.

  4. Untuk Server Database Azure, pilih Server Fleksibel PostgreSQL.

    Screenshot showing a list of available database servers.

  5. Masukkan nama unik untuk server database Anda.

    Penting

    Catat nama yang Anda gunakan untuk server database Anda.

  6. Pilih SKU Postgres dan opsi.

  7. Untuk nama pengguna admin, masukkan shelter_admin.

  8. Masukkan sandi yang aman, seperti "86i^z5#emSk6wu3t10nC*".

    Penting

    Saat Anda membuat kata sandi, jangan gunakan tanda dolar ($). Simbol ini dapat menyebabkan masalah koneksi dari Python. Catat kata sandi yang Anda gunakan.

  9. Masukkan kata sandi untuk kedua kalinya untuk mengonfirmasi.

  10. Untuk grup sumber daya, pilih grup sumber daya yang sama dengan tempat aplikasi web Anda dibuat.

    Untuk menemukan nama dan lokasi grup sumber daya yang digunakan untuk membuat aplikasi web, temukan App Service di ekstensi Azure, klik kanan nama, dan pilih Lihat Properti. Dalam kunci "id", nama grup sumber daya adalah bagian berikut "/resourceGroups/". Kunci "location" menunjukkan lokasi.

    Anda juga dapat mengklik kanan nama App Service dan memilih Buka di Portal untuk menemukan nama dan lokasi grup sumber daya.

  11. Untuk lokasi sumber daya baru, pilih lokasi grup sumber daya dan aplikasi web yang sama.

    Penting

    Saat Anda membuat beberapa sumber daya Azure yang akan berkomunikasi satu sama lain, selalu letakkan sumber daya tersebut di wilayah yang sama. Kolokasi ini memastikan performa terbaik.

Server Anda sekarang akan dibuat! Proses ini akan memakan waktu beberapa menit.

Membuat aturan firewall database untuk mengizinkan akses dari lingkungan dev Anda

Setelah database dibuat, Anda perlu membuat aturan firewall untuk memungkinkan lingkungan pengembang Anda mengakses database. Tunggu hingga database ada sebelum mengikuti langkah selanjutnya untuk membuat aturan.

  1. Buka palet perintah Visual Studio Code dengan F1 atau kombinasi tombol Ctrl + Shift + P.

  2. Cari "PostgreSQL: Configure Firewall" dan pilih.

    Screenshot showing the firewall rule field.

  3. Saat diminta sumber daya untuk menerapkan firewall, pilih database Postgres yang Anda buat.

  4. Kotak dialog terakhir meminta untuk melanjutkan dan menunjukkan alamat IP yang akan ditambahkan. Pilih Ya.

Perlu beberapa menit untuk menambahkan aturan. Perhatikan jendela pemberitahuan Kode VS untuk status.

Buat database di server database.

Sekarang setelah Anda mengonfigurasi App Service dan membuat server, Anda dapat membuat database di Server Database Postgres.

  1. Di RESOURCES ekstensi Alat Azure, perluas node Server PostgreSQL (Fleksibel) dan temukan server yang Anda buat.

  2. Klik kanan nama server database Anda dan pilih Buat Database.

    Screenshot showing the Create Database selection.

  3. Masukkan shelters.

Database Anda akan dibuat.

Mengizinkan akses ke server database dari App Service

Dalam latihan ini, Anda juga memerlukan aplikasi web tempat penampung yang dihosting di Azure App Service untuk menyambungkan ke Server Fleksibel Azure Database for PostgreSQL. Saat aplikasi dalam Azure mencoba menyambung ke server database Anda, firewall memverifikasi bahwa koneksi Azure diizinkan. Sebelumnya, Anda mengizinkan koneksi dari lingkungan lokal Anda. Sekarang, Anda juga harus mengizinkan koneksi dari App Service.

  1. Di Visual Studio Code, dalam RESOURCES ekstensi Alat Azure, perluas node Server PostgreSQL (Fleksibel) dan temukan server yang Anda buat.

  2. Klik kanan nama server database Anda dan pilih Buat di Portal.

  3. Pilih sumber daya Networking Server Postgres.

  4. Pilih opsi Izinkan akses publik dari layanan Azure apa pun dalam Azure ke server ini di portal dari tab Jaringan dan pilih Simpan.

    Screenshot showing the how to allow public access to database server.

Mengonfigurasi pengaturan aplikasi untuk aplikasi web

App Service menggunakan pengaturan aplikasi untuk mengonfigurasi variabel lingkungan. Pengaturan adalah cara mudah untuk menyimpan informasi yang tidak boleh Anda masukkan ke dalam kode Anda, seperti string koneksi database.

  1. Di bagian App Service, perluas langganan kotak pasir. Kemudian perluas aplikasi Anda.

  2. Untuk membuat pengaturan aplikasi pertama, klik kanan Pengaturan Aplikasi lalu pilih Tambahkan Pengaturan Baru.

    Screenshot showing how to add a new setting.

  3. Di bidang pertama, masukkan nama DBUSER.

  4. Di bidang kedua, masukkan nilai shelter_admin.

  5. Ulangi langkah-langkah sebelumnya untuk membuat pengaturan yang tersisa:

    Nama Nilai
    DBHOST <The server name you created previously>
    DBPASS <The password you created previously>
    DBUSER shelter_admin
    DBNAME shelters
    SECRET_KEY <Generate a secure password>

    Catatan

    Ganti nilai DBHOST dan DBPASS dengan nilai yang Anda buat sebelumnya dalam latihan ini. Untuk SECRET_KEY, buat kata sandi baru.

Semua variabel lingkungan yang diperlukan sekarang dibuat di layanan aplikasi Anda.

Membuat skema dan superuser

Langkah terakhir dalam penyebaran adalah menyiapkan database. Dalam pengembangan lokal, Anda harus menjalankan python manage.py migrate dan python manage.py createsuperuser untuk membuat skema database dan superuser. Di Microsoft Azure, Anda akan melakukan hal yang sama.

Anda akan tersambung ke server web di Microsoft Azure dengan menggunakan Secure Shell (SSH). Anda dapat membuat koneksi di Visual Studio Code sebagaimana ditunjukkan di bawah ini.

  1. Di ekstensi App Service, klik kanan layanan aplikasi Anda lalu pilih SSH ke Aplikasi Web.

    Screenshot of the menu for SSH.

    Koneksi SSH akan dibuat ke server web Anda di Azure. Proses ini dapat berlangsung beberapa menit. Panel terminal yang muncul di Visual Studio Code. Terminal ini adalah koneksi SSH ke server web Anda. Jika Anda mengalami masalah saat menyambungkan, lihat langkah-langkah menyelesaikan masalah di bawah ini.

    Penting

    Jika Anda menerima pesan kesalahan yang menyatakan bahwa Anda perlu mengaktifkan SSL untuk database, pastikan Anda membuat semua variabel lingkungan dengan benar.

  2. Di dalam panel terminal SSH, jalankan perintah berikut untuk memastikan pustaka yang sesuai telah terinstal dan untuk membuat database.

    # Run database migrations
python manage.py makemigrations dog_shelters
python manage.py migrate

  3. Buat superuser Anda dengan menjalankan perintah berikut.

    python manage.py createsuperuser

  4. Berikan nama, alamat email, dan kata sandi untuk superuser.

  5. Setelah Anda membuat superuser, jalankan perintah exit untuk memutuskan koneksi.

Database Anda sekarang dikonfigurasi di Azure, dan Anda memiliki superuser untuk situs Anda.

Memecahkan masalah SSH

Jika Anda tidak dapat tersambung ke SSH dari Visual Studio Code, berikut adalah beberapa langkah yang dapat Anda coba:

  • Buka halaman portal Azure untuk App Service dan akses SSH di sana. Di Visual Studio Code, klik kanan nama App Service dan pilih Buka di Portal. Pada halaman portal untuk App Service, buka sumber daya SSH di panel sumber daya kiri.

  • Periksa apakah App Service yang menghosting aplikasi web dimulai dengan benar. Jika ada kesalahan penyebaran atau masalah pengkodean, App Service mungkin tidak dimulai, dan Anda tidak dapat mengirimkan SSH ke dalamnya. Pada halaman portal App Service, buka Diagnosis dan selesaikan masalah di panel sumber daya kiri untuk mencari masalah.

  • Baca selengkapnya tentang SSH di App Service.

Masuk ke situs Anda

Sekarang setelah Anda menyebarkan dan mengonfigurasi semuanya, Anda dapat melihat situs web Anda di Azure.

Di ekstensi App Service, klik kanan nama situs Anda, lalu pilih Telusuri Situs Web.

Screenshot showing where to select Browse Website.

Situs web Anda sekarang muncul. Halaman default tidak menunjukkan tempat penampungan. Untuk menambahkan tempat penampungan:

  1. Buka bagian administrasi Django dari situs dengan menambahkan "/admin" URL situs web.

    Anda akan diminta untuk mengautentikasi dengan nama superuser dan kata sandi yang Anda buat di atas.

  2. Tambahkan tempat penampungan dan navigasikan kembali ke halaman utama dan Anda akan dapat mendaftarkan anjing untuk tempat penampungan tersebut.

Berikut adalah contoh cuplikan layar situs:

Screenshot showing Django admin and how to add shelters.

Jika Anda mencoba masuk ke lokasi yang tidak ada di situs Anda, Anda akan mendapatkan kesalahan generik Tidak ditemukan karena DEBUG lokasi tersebut tak tersedia.

Anda sekarang telah berhasil menyebarkan situs web ke Azure!