Pembangunan Laravel: Bagaimana untuk melaksanakan komunikasi WebSockets menggunakan Laravel Echo dan Pusher?

Laravel ialah rangka kerja PHP popular yang sangat berskala dan cekap Ia menyediakan banyak alatan dan perpustakaan yang berkuasa yang membolehkan pembangun membina aplikasi web berkualiti tinggi dengan cepat. Antaranya, Laravel Echo dan Pusher ialah dua alat yang sangat penting di mana komunikasi WebSockets boleh dilaksanakan dengan mudah Artikel ini akan memperincikan cara menggunakan kedua-dua alat ini dalam aplikasi Laravel.

1. Apakah itu WebSockets?

WebSockets ialah protokol dengan komunikasi dua hala, yang boleh mencapai penghantaran data masa nyata yang lebih tinggi dan lebih pantas. Berbanding dengan permintaan HTTP tradisional, WebSockets boleh mengekalkan keadaan sambungan dan memindahkan data antara klien dan pelayan walaupun tiada permintaan atau respons. WebSockets boleh memberikan pengalaman pengguna yang lebih baik dan prestasi aplikasi yang lebih tinggi, dan boleh digunakan dalam pelbagai senario aplikasi masa nyata, seperti aplikasi sembang, permainan, dsb.

2. Pengenalan kepada Laravel Echo dan Pusher

Laravel Echo ialah rangka kerja siaran acara yang menyediakan API yang mudah dan konsisten untuk membolehkan anda menyambungkan saluran komunikasi masa nyata pada pelanggan sebelah. Echo bergantung pada Pusher, dan Redis boleh digunakan sebagai alternatif apabila Pusher tidak tersedia. Pusher ialah perkhidmatan WebSockets masa nyata yang membantu anda menambahkan fungsi masa nyata dengan mudah pada aplikasi anda Pusher ialah penyelesaian yang dihoskan yang membolehkan anda memunggah semua tugas pengurusan WebSockets ke perkhidmatan pihak ketiga untuk prestasi yang lebih baik daripada permohonan itu.

3. Mengkonfigurasi Laravel Echo dan Pusher

Dalam projek Laravel, anda perlu memasang Echo dan Pusher terlebih dahulu, yang boleh dipasang menggunakan arahan komposer:

composer require pusher/pusher-php-server pusher/pusher-http-laravel beyondcode/laravel-websockets
npm install --save laravel-echo pusher-js

Pemasangan Selepas selesai, anda perlu mengkonfigurasi maklumat berkaitan Pusher dalam fail .env:

PUSHER_APP_ID=your-app-id
PUSHER_APP_KEY=your-app-key
PUSHER_APP_SECRET=your-app-secret
PUSHER_APP_CLUSTER=your-app-cluster

Kemudian dalam fail config/broadcasting.php, konfigurasikan Broadcaster sebagai pusher:

'default' => env('BROADCAST_DRIVER', 'pusher'),

'connections' => [
    'pusher' => [
        'driver' => 'pusher',
        'key' => env('PUSHER_APP_KEY'),
        'secret' => env('PUSHER_APP_SECRET'),
        'app_id' => env('PUSHER_APP_ID'),
        'options' => [
            'cluster' => env('PUSHER_APP_CLUSTER'),
            'encrypted' => true,
        ],
    ],
],

<>
4. Gunakan Pusher Laravel WebSockets menjalankan pelayan websocket

Pusher mempunyai pustaka sumber terbuka Laravel WebSockets yang membolehkan anda menjalankan pelayan WebSockets pada pelayan anda sendiri, dengan itu menjimatkan kos dan meningkatkan prestasi serta fleksibiliti. Operasi khusus adalah seperti berikut:

1. Pasang jadual pangkalan data dan data yang diperlukan untuk menjalankan Laravel WebSockets

   php artisan websocket:install

   Salin selepas log masuk

2. Isi konfigurasi yang diperlukan untuk Laravel WebSockets

   php artisan websocket:publish

   Salin selepas log masuk
3. Buat pendengar (dalam EventServiceProvider)

protected $listen = [
    'AppEventsExampleEvent' => [
        'AppListenersExampleListener',
    ],
];

4. Kendalikan acara

   <?php
   
   namespace AppEvents;
   
   use IlluminateBroadcastingInteractsWithSockets;
   use IlluminateFoundationEventsDispatchable;
   use IlluminateQueueSerializesModels;
   
   class ExampleEvent
   {
    use Dispatchable, InteractsWithSockets, SerializesModels;
   
    public $data;
   
    public function __construct($data)
    {
        $this->data = $data;
    }
   
    public function broadcastOn()
    {
        return ['test_channel'];
    }
   
    public function broadcastAs()
    {
        return 'example-event';
    }
   }

   Salin selepas log masuk

The , anda boleh menggunakan Kod berikut menolak peristiwa:

use AppEventsExampleEvent;
use IlluminateSupportFacadesEvent;

Event::dispatch(new ExampleEvent(‘Example payload’, ‘Another example payload’));

5. Cara menggunakan Laravel Echo dan Pusher pada bahagian hadapan

Menggunakan Laravel Echo dan Pusher di hadapan- end adalah sangat mudah, berikut adalah contoh asas:

import Echo from 'laravel-echo'
import Pusher from 'pusher-js'

let pusher = new Pusher(process.env.MIX_PUSHER_APP_KEY, {
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    encrypted: true,
})
let echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    encrypted: true,
    auth: {
        headers: {
            ‘Authorization’: ‘Bearer {access_token}’,
        },
    },
})

Melalui kaedah di atas, kita boleh menggunakan Laravel Echo dan Pusher untuk melaksanakan komunikasi WebSockets dalam aplikasi Laravel.

Ringkasan

Laravel Echo dan Pusher menyediakan penyelesaian WebSockets yang sangat mudah dan pantas, membolehkan kami membina aplikasi Web masa nyata berprestasi tinggi dengan cepat. Artikel ini memperkenalkan secara terperinci cara mengkonfigurasi Laravel Echo dan Pusher, dan menggunakan Laravel WebSockets Pusher untuk membina pelayan WebSockets secara tempatan Pada masa yang sama, gunakan Laravel Echo dan Pusher untuk menyambung ke pelayan WebSockets di bahagian hadapan untuk mencapai masa nyata. keupayaan komunikasi.

Atas ialah kandungan terperinci Pembangunan Laravel: Bagaimana untuk melaksanakan komunikasi WebSockets menggunakan Laravel Echo dan Pusher?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!