Bagikan melalui


Mulai cepat: Membuat aplikasi tanpa server dengan Azure Functions dan Azure SignalR Service di Python

Mulai menggunakan Azure SignalR Service dengan menggunakan Azure Functions dan Python untuk membangun aplikasi tanpa server yang menyiarkan pesan ke klien. Anda akan menjalankan fungsi di lingkungan lokal, menyambungkan ke instans Azure SignalR Service di cloud. Menyelesaikan mulai cepat ini dikenakan biaya kecil beberapa sen USD atau kurang di Akun Azure Anda.

Catatan

Anda bisa mendapatkan kode dalam artikel ini dari GitHub.

Prasyarat

Panduan memulai ini dapat dijalankan di macOS, Windows, atau Linux. Anda akan membutuhkan hal berikut ini:

Prasyarat Deskripsi
Langganan Azure Jika Anda tidak memiliki langganan Azure, buat akun gratis Azure
Editor kode Anda akan memerlukan editor kode seperti Visual Studio Code.
Azure Functions Core Tools Memerlukan versi 2.7.1505 atau yang lebih tinggi untuk menjalankan aplikasi Python Azure Function secara lokal.
Python 3.7+ Azure Functions memerlukan Python 3.7+. Lihat Versi Python yang didukung.
Azurite Pengikatan SignalR memerlukan Azure Storage. Anda dapat menggunakan emulator penyimpanan lokal saat fungsi berjalan secara lokal.
Azure CLI Secara opsional, Anda dapat menggunakan Azure CLI untuk membuat instans Azure SignalR Service.

Membuat instans Azure SignalR Service

Di bagian ini, Anda membuat instans Azure SignalR dasar yang akan digunakan untuk aplikasi Anda. Langkah-langkah berikut menggunakan portal Azure untuk membuat instans baru, tetapi Anda juga dapat menggunakan Azure CLI. Untuk informasi selengkapnya, lihat perintah az signalr create di Referensi CLI Azure SignalR Service.

  1. Masuk ke portal Azure.
  2. Di sisi kiri atas halaman, pilih + Buat sumber daya.
  3. Pada halaman Buat sumber daya, di kotak teks layanan Pencarian dan marketplace, masukkan signalr lalu pilih SignalR Service dari daftar.
  4. Pada halaman SignalR Service , pilih Buat.
  5. Pada tab Dasar, Anda memasukkan informasi penting untuk instans SignalR Service baru Anda. Masukkan nilai berikut:
Bidang Nilai yang Disarankan Deskripsi
Langganan Memilih langganan Anda Pilih langganan yang ingin Anda gunakan untuk membuat instans SignalR Service baru.
Grup sumber daya Membuat grup sumber daya bernama SignalRTestResources Pilih atau buat grup sumber daya untuk sumber daya SignalR Anda. Berguna untuk membuat grup sumber daya baru untuk tutorial ini alih-alih menggunakan grup sumber daya yang ada. Untuk membebaskan sumber daya setelah menyelesaikan tutorial, hapus grup sumber daya.

Menghapus grup sumber daya juga menghapus semua sumber daya yang termasuk dalam grup. Tindakan ini tidak dapat diurungkan. Sebelum Anda menghapus grup sumber daya, pastikan grup tersebut tidak berisi sumber daya yang ingin Anda simpan.

Untuk mengetahui informasi selengkapnya, lihat Menggunakan grup sumber daya untuk mengelola sumber daya Azure Anda.
Nama sumber daya testsignalr Masukkan nama sumber daya unik untuk digunakan untuk sumber daya SignalR. Jika testsignalr sudah diambil di wilayah Anda, tambahkan digit atau karakter hingga namanya unik.

Nama harus berupa string 1 hingga 63 karakter dan hanya berisi angka, huruf, dan karakter tanda hubung (-). Nama tidak dapat dimulai atau diakhir dengan karakter tanda hubung, dan karakter tanda hubung berturut-turut tidak valid.
Wilayah Pilih wilayah Anda Pilih wilayah yang sesuai untuk instans SignalR Service baru Anda.

Azure SignalR Service saat ini tidak tersedia di semua wilayah. Untuk informasi selengkapnya, lihat Ketersediaan wilayah Azure SignalR Service
Tingkat harga Pilih Ubah lalu pilih Gratis (Khusus Dev/Test). Pilih Pilih untuk mengonfirmasi pilihan tingkat harga Anda. Azure SignalR Service memiliki tiga tingkat harga: Gratis, Standar, dan Premium. Tutorial menggunakan tingkat Gratis , kecuali disebutkan sebaliknya dalam prasyarat.

Untuk informasi selengkapnya tentang perbedaan fungsionalitas antara tingkatan dan harga, lihat Harga Azure SignalR Service
Mode layanan Pilih mode layanan yang sesuai Gunakan Default saat Anda menghosting logika hub SignalR di aplikasi web Anda dan menggunakan layanan SignalR sebagai proksi. Gunakan Tanpa Server saat Anda menggunakan teknologi Tanpa Server seperti Azure Functions untuk menghosting logika hub SignalR.

Mode klasik hanya untuk kompatibilitas mundur dan tidak disarankan untuk digunakan.

Untuk informasi selengkapnya, lihat Mode layanan di Azure SignalR Service.

Anda tidak perlu mengubah pengaturan pada tab Jaringan dan Tag untuk tutorial SignalR.

  1. Pilih tombol Tinjau + buat di bagian bawah tab Dasar .
  2. Pada tab Tinjau + buat , tinjau nilai lalu pilih Buat. Dibutuhkan beberapa saat agar penyebaran selesai.
  3. Setelah penyebaran selesai, pilih tombol Buka sumber daya .
  4. Pada halaman sumber daya SignalR, pilih Kunci dari menu di sebelah kiri, di bawah Pengaturan.
  5. Salin string Koneksi ion untuk kunci utama. Anda memerlukan string koneksi ini untuk mengonfigurasi aplikasi Anda nanti dalam tutorial ini.

Membuat proyek Azure Function

Buat proyek Azure Function lokal.

  1. Dari baris perintah, buat direktori untuk proyek Anda.
  2. Ubah ke direktori proyek.
  3. Gunakan perintah Azure Functions func init untuk menginisialisasi proyek fungsi Anda.
# Initialize a function project
func init --worker-runtime python

Membuat fungsi

Setelah memulai proyek, Anda perlu membuat fungsi. Proyek ini memerlukan tiga fungsi:

  • index: Menghosting halaman web untuk klien.
  • negotiate: Memungkinkan klien untuk mendapatkan token akses.
  • broadcast: Menggunakan pemicu waktu untuk menyiarkan pesan secara berkala ke semua klien.

Saat Anda menjalankan func new perintah dari direktori akar proyek, Azure Functions Core Tools menambahkan kode fungsi dalam function_app.py file. Anda akan mengedit parameter konten iklan seperlunya dengan mengganti kode default dengan kode aplikasi.

Membuat fungsi indeks

Anda dapat menggunakan fungsi sampel ini sebagai templat untuk fungsi Anda sendiri.

Buka file function_app.py. File ini akan berisi fungsi Anda. Pertama, ubah file untuk menyertakan pernyataan impor yang diperlukan, dan tentukan variabel global yang akan kita gunakan dalam fungsi berikut.

import azure.functions as func
import os
import requests
import json 

app = func.FunctionApp()

etag = ''
start_count = 0
  1. Tambahkan fungsi index dengan menambahkan kode berikut
@app.route(route="index", auth_level=func.AuthLevel.ANONYMOUS)
def index(req: func.HttpRequest) -> func.HttpResponse:
    f = open(os.path.dirname(os.path.realpath(__file__)) + '/content/index.html')
    return func.HttpResponse(f.read(), mimetype='text/html')

Fungsi ini menghosting halaman web untuk klien.

Membuat fungsi negosiasi

Tambahkan fungsi negotiate dengan menambahkan kode berikut

@app.route(route="negotiate", auth_level=func.AuthLevel.ANONYMOUS, methods=["POST"])
@app.generic_input_binding(arg_name="connectionInfo", type="signalRConnectionInfo", hubName="serverless", connectionStringSetting="AzureSignalRConnectionString")
def negotiate(req: func.HttpRequest, connectionInfo) -> func.HttpResponse:
    return func.HttpResponse(connectionInfo)

Fungsi ini memungkinkan klien untuk mendapatkan token akses.

Buat fungsi siaran.

Tambahkan fungsi broadcast dengan menambahkan kode berikut

@app.timer_trigger(schedule="*/1 * * * *", arg_name="myTimer",
              run_on_startup=False,
              use_monitor=False)
@app.generic_output_binding(arg_name="signalRMessages", type="signalR", hubName="serverless", connectionStringSetting="AzureSignalRConnectionString")
def broadcast(myTimer: func.TimerRequest, signalRMessages: func.Out[str]) -> None:
    global etag
    global start_count
    headers = {'User-Agent': 'serverless', 'If-None-Match': etag}
    res = requests.get('https://api.github.com/repos/azure/azure-functions-python-worker', headers=headers)
    if res.headers.get('ETag'):
        etag = res.headers.get('ETag')

    if res.status_code == 200:
        jres = res.json()
        start_count = jres['stargazers_count']

    signalRMessages.set(json.dumps({
        'target': 'newMessage',
        'arguments': [ 'Current star count of https://api.github.com/repos/azure/azure-functions-python-worker is: ' + str(start_count) ]
    }))

Fungsi ini menggunakan pemicu waktu untuk menyiarkan pesan secara berkala ke semua klien.

Membuat proyek Azure Function

Buat proyek Azure Function lokal.

  1. Dari baris perintah, buat direktori untuk proyek Anda.
  2. Ubah ke direktori proyek.
  3. Gunakan perintah Azure Functions func init untuk menginisialisasi proyek fungsi Anda.
# Initialize a function project
func init --worker-runtime python --model v1

Membuat fungsi

Setelah memulai proyek, Anda perlu membuat fungsi. Proyek ini memerlukan tiga fungsi:

  • index: Menghosting halaman web untuk klien.
  • negotiate: Memungkinkan klien untuk mendapatkan token akses.
  • broadcast: Menggunakan pemicu waktu untuk menyiarkan pesan secara berkala ke semua klien.

Saat Anda menjalankan func new perintah dari direktori akar proyek, Azure Functions Core Tools membuat file sumber fungsi default dan menyimpannya di folder bernama sesuai fungsi. Anda akan mengedit file seperlunya mengganti kode default dengan kode aplikasi.

Membuat fungsi indeks

Anda dapat menggunakan fungsi sampel ini sebagai templat untuk fungsi Anda sendiri.

  1. Jalankan perintah berikut untuk membuat index fungsi.
func new -n index -t HttpTrigger
  1. Edit indeks/function.json dan ganti konten dengan kode json berikut:
{
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req",
      "methods": [
        "get",
        "post"
      ]
    },
    {
      "type": "http",
      "direction": "out",
      "name": "$return"
    }
  ]
}
  1. Edit index/_init_.py dan ganti konten dengan kode berikut:
import os

import azure.functions as func

def main(req: func.HttpRequest) -> func.HttpResponse:
    f = open(os.path.dirname(os.path.realpath(__file__)) + '/../content/index.html')
    return func.HttpResponse(f.read(), mimetype='text/html')

Membuat fungsi negosiasi

  1. Jalankan perintah berikut untuk membuat negotiate fungsi.
func new -n negotiate -t HttpTrigger
  1. Edit negosiasi/function.json dan ganti konten dengan kode json berikut:
{
  "scriptFile": "__init__.py",
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req",
      "methods": [
        "post"
      ]
    },
    {
      "type": "http",
      "direction": "out",
      "name": "$return"
    },
    {
      "type": "signalRConnectionInfo",
      "name": "connectionInfo",
      "hubName": "serverless",
      "connectionStringSetting": "AzureSignalRConnectionString",
      "direction": "in"
    }
  ]
}
  1. Edit negosiasi/_init_.py dan ganti konten dengan kode berikut:
import azure.functions as func


def main(req: func.HttpRequest, connectionInfo) -> func.HttpResponse:
    return func.HttpResponse(connectionInfo)

Buat fungsi siaran.

  1. Jalankan perintah berikut untuk membuat broadcast fungsi.
func new -n broadcast -t TimerTrigger
# install requests
pip install requests
  1. Edit siaran/function.json dan ganti konten dengan kode berikut:
{
  "scriptFile": "__init__.py",
  "bindings": [
    {
      "name": "myTimer",
      "type": "timerTrigger",
      "direction": "in",
      "schedule": "*/5 * * * * *"
    },
    {
      "type": "signalR",
      "name": "signalRMessages",
      "hubName": "serverless",
      "connectionStringSetting": "AzureSignalRConnectionString",
      "direction": "out"
    }
  ]
}
  1. Edit siaran/_init_.py dan ganti konten dengan kode berikut:
import requests
import json

import azure.functions as func

etag = ''
start_count = 0

def main(myTimer: func.TimerRequest, signalRMessages: func.Out[str]) -> None:
    global etag
    global start_count
    headers = {'User-Agent': 'serverless', 'If-None-Match': etag}
    res = requests.get('https://api.github.com/repos/azure/azure-signalr', headers=headers)
    if res.headers.get('ETag'):
        etag = res.headers.get('ETag')

    if res.status_code == 200:
        jres = res.json()
        start_count = jres['stargazers_count']

    signalRMessages.set(json.dumps({
        'target': 'newMessage',
        'arguments': [ 'Current star count of https://github.com/Azure/azure-signalr is: ' + str(start_count) ]
    }))

Membuat file index.html

Antarmuka klien untuk aplikasi ini adalah halaman web. Fungsi membaca index konten HTML dari file content/index.html .

  1. Buat folder content bernama di folder akar proyek Anda.
  2. Buat file content/index.html.
  3. Salin konten berikut ke file content/index.html dan simpan:
<html>

<body>
  <h1>Azure SignalR Serverless Sample</h1>
  <div id="messages"></div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/microsoft-signalr/3.1.7/signalr.min.js"></script>
  <script>
    let messages = document.querySelector('#messages');
    const apiBaseUrl = window.location.origin;
    const connection = new signalR.HubConnectionBuilder()
        .withUrl(apiBaseUrl + '/api')
        .configureLogging(signalR.LogLevel.Information)
        .build();
      connection.on('newMessage', (message) => {
        document.getElementById("messages").innerHTML = message;
      });

      connection.start()
        .catch(console.error);
  </script>
</body>

</html>

Menambahkan string koneksi SignalR Service ke pengaturan aplikasi fungsi

Langkah terakhir adalah mengatur string koneksi SignalR Service di pengaturan aplikasi Azure Function.

  1. Di portal Azure, buka instans SignalR yang Anda sebarkan sebelumnya.

  2. Pilih Kunci untuk melihat string koneksi untuk instans SignalR Service.

    Cuplikan layar halaman Kunci layanan Azure SignalR.

  3. Salin string koneksi utama, dan jalankan perintah :

    func settings add AzureSignalRConnectionString "<signalr-connection-string>"
    

Menjalankan aplikasi Azure Function secara lokal

Mulai emulator penyimpanan Azurite:

azurite 

Jalankan aplikasi Azure Function di lingkungan lokal:

func start

Catatan

Jika Anda melihat kesalahan yang menunjukkan kesalahan baca pada penyimpanan blob, pastikan pengaturan 'AzureWebJobsStorage' dalam file local.settings.json diatur ke UseDevelopmentStorage=true.

Setelah Azure Function berjalan secara lokal, buka http://localhost:7071/api/index. Halaman menampilkan jumlah bintang saat ini untuk repositori GitHub Azure/azure-signalr. Saat membintangi atau membatalkan bintang repositori di GitHub, Anda akan melihat jumlah yang di-refresh setiap beberapa detik.

Membersihkan sumber daya

Jika Anda tidak akan terus menggunakan aplikasi ini, hapus semua sumber daya yang dibuat oleh mulai cepat ini dengan langkah-langkah berikut agar Anda tidak dikenakan biaya apa pun:

  1. Di portal Azure, pilih Grup sumber daya di paling kiri, lalu pilih grup sumber daya yang Anda buat. Atau, Anda dapat menggunakan kotak pencarian untuk menemukan grup sumber daya berdasarkan namanya.

  2. Di jendela yang terbuka, pilih grup sumber daya, lalu klik Hapus grup sumber daya.

  3. Di jendela baru, ketik nama grup sumber daya untuk dihapus, lalu klik Hapus.

Mengalami masalah? Coba panduan pemecahan masalah atau beri tahu kami.

Langkah berikutnya

Dalam mulai cepat ini, Anda telah membangun dan menjalankan aplikasi tanpa server {i>real-time