Laravel 개발: Laravel Echo를 사용하여 WebSocket 통신을 구현하는 방법은 무엇입니까?

Laravel은 개발자가 고품질 웹 애플리케이션을 쉽게 구축할 수 있는 유용한 도구와 확장 라이브러리가 많이 포함된 인기 있는 PHP 프레임워크입니다. 그중 Laravel Echo는 개발자가 웹 애플리케이션에서 실시간 통신을 달성하는 데 도움을 줄 수 있는 강력한 WebSockets 통신 도구입니다.

이 글에서는 Laravel Echo를 사용하는 방법과 WebSockets 서버를 구축하여 실시간 통신을 구현하는 방법을 소개하겠습니다. 먼저 WebSocket과 Laravel Echo가 무엇인지 간략하게 설명한 다음 Laravel Echo를 설치하고 구성하는 방법을 설명하고 마지막으로 Laravel Echo를 사용하여 JavaScript 클라이언트와 통신하는 방법을 보여줍니다.

WebSocket이란 무엇인가요?

WebSockets는 웹 애플리케이션과 웹 서버 간의 실시간 통신 연결을 허용하는 프로토콜입니다. 이 연결은 오랫동안 열려 있을 수 있으며 양방향이므로 동시에 읽고 쓸 수 있습니다.

HTTP 요청과 달리 WebSocket 연결을 지속적으로 열면 서버는 폴링이나 긴 폴링 없이 실시간으로 클라이언트에 데이터를 푸시할 수 있습니다. 이를 통해 웹 애플리케이션은 빠르고 효율적이며 실시간으로 통신할 수 있습니다.

라라벨 에코란 무엇인가요?

Laravel Echo는 개발자가 웹 애플리케이션에서 WebSocket 통신을 구현하는 데 도움을 줄 수 있는 Laravel 프레임워크의 공식 확장 라이브러리입니다. 브로드캐스트 채널을 쉽게 구독하고 JavaScript를 사용하여 클라이언트와 서버 간에 메시지를 전달할 수 있는 간단한 API를 제공합니다.

Laravel Echo 및 Laravel Pusher를 사용하여 WebSockets 서버를 쉽게 설정하고 브로드캐스트 채널을 사용하여 WebSockets 통신을 구성합니다. 클라이언트 측에서는 JavaScript 및 Laravel Echo를 사용하여 실시간으로 메시지를 수신하여 웹 애플리케이션에서 실시간 통신을 활성화할 수 있습니다.

Laravel Echo 설치 및 구성

Laravel Echo를 사용하기 전에 필요한 소프트웨어인 Laravel 및 pusher PHP SDK를 설치하고 구성해야 합니다. Laravel Echo 및 pusher PHP SDK는 Composer 패키지 관리자를 통해 설치할 수 있습니다.

먼저 Laravel을 설치해야 합니다:

composer create-project laravel/laravel your-project-name

다음으로 pusher PHP SDK를 설치해야 합니다. pusher PHP SDK 설치는 다음 명령을 실행하여 수행할 수 있습니다:

composer require pusher/pusher-php-server

Laravel Echo와 pusher PHP SDK를 통합하려면 config/app.php 파일에 서비스 공급자와 별칭을 추가해야 합니다:

// config/app.php

'providers' => [
    // ...
    LaravelBroadcastingBroadcastServiceProvider::class,
],

'aliases' => [
    // ...
    'Broadcast' => LaravelBroadcastingBroadcastFacade::class,
],

다음으로 Laravel Echo와 푸셔 PHP SDK가 제대로 작동하도록 몇 가지 구성 작업을 수행해 보겠습니다. Laravel Echo 및 pusher PHP SDK에 필요한 모든 구성을 .env 파일에 추가해야 합니다:

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

WebSockets 서버 생성

다음으로 Laravel Echo 및 pusher PHP SDK를 사용하여 WebSockets 서버를 설정하겠습니다. Routes/channels.php 파일에 브로드캐스트 채널을 정의해야 합니다. 브로드캐스트 채널은 브로드캐스트 메시지를 받을 수 있는 사용자를 결정합니다.

// routes/channels.php

use IlluminateSupportFacadesBroadcast;

Broadcast::channel('chat.{roomId}', function ($user, $roomId) {
    // ...
});

위의 예에서는 "chat"이라는 방송 채널을 정의하고 "roomId" 매개변수를 전달했습니다. "chat.roomId" 권한이 있는 사용자만 이 방송 채널에서 메시지를 받을 수 있습니다.

다음으로 방송 이벤트를 정의하고 해당 메시지를 푸시해야 합니다. app/Events 디렉터리에 새 이벤트 클래스를 만듭니다. 예:

// app/Events/ChatMessageSent.php

<?php

namespace AppEvents;

use IlluminateBroadcastingPrivateChannel;
use IlluminateContractsBroadcastingShouldBroadcast;
use IlluminateFoundationEventsDispatchable;
use IlluminateQueueSerializesModels;

class ChatMessageSent implements ShouldBroadcast
{
    use Dispatchable, SerializesModels;

    public $message;

    public function __construct($message)
    {
        $this->message = $message;
    }

    public function broadcastOn()
    {
        return new PrivateChannel('chat.' . $this->message['room_id']);
    }
}

이 이벤트 클래스에는 방송 이벤트 논리가 포함되어 있으며 방송하려면 ShouldBroadcast 인터페이스를 구현해야 합니다.

이제 애플리케이션에서 이벤트를 인스턴스화한 다음 브로드캐스트 메시지를 보낼 수 있습니다. 예를 들어, app/Http/Controllers/ChatController.php 파일에 다음 메시지 전송 메소드를 추가합니다:

// app/Http/Controllers/ChatController.php

<?php

namespace AppHttpControllers;

use AppEventsChatMessageSent;
use IlluminateHttpRequest;

class ChatController extends Controller
{
    public function sendMessage(Request $request)
    {
        $message = [
            'user_id' => $request->user()->id,
            'room_id' => $request->get('room_id'),
            'message' => $request->get('message'),
        ];

        event(new ChatMessageSent($message));

        return response()->json(['status' => 'Message Sent!']);
    }
}

위 코드에서 event(new ChatMessageSent($message))는 이벤트를 트리거하고 다음을 포함하는 메시지를 보냅니다. 데이터 방송 이벤트.

실시간 통신 구축

마지막으로 실시간 WebSocket 통신을 얻으려면 JavaScript 클라이언트에서 Laravel Echo를 사용하여 브로드캐스트 이벤트를 수신해야 합니다. JavaScript에서는 방송 이벤트를 수신하는 두 가지 방법을 사용할 수 있습니다.

• Echo.channel(channelName).listen(eventName, callback): 방송 이벤트를 구독하고 이벤트가 수신될 때 실행할 콜백 함수를 등록합니다.
• Echo.private(channelName).listen(eventName, callback): 비공개 방송 이벤트를 구독하고 이벤트 수신 시 실행할 콜백 함수를 등록합니다.

예를 들어 채팅 애플리케이션에서는 다음 코드를 사용하여 새 메시지에 대한 이벤트를 수신할 수 있습니다.

// resources/js/app.js

import Echo from 'laravel-echo';
window.Pusher = require('pusher-js');

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    encrypted: true,
});

window.Echo.channel(`chat.${roomId}`)
    .listen('ChatMessageSent', (e) => {
        console.log(e);
    });

위 코드에서는 Laravel Echo 클라이언트를 사용하여 "chat.roomId" 채널을 구독하고 "ChatMessageSent" 이벤트 도달 시 이벤트 데이터를 출력합니다.

결론

Laravel Echo와 pusher PHP SDK를 사용하면 WebSockets 서버를 쉽게 설정하고 브로드캐스트 채널을 사용하여 WebSockets 통신을 구현할 수 있습니다. 클라이언트 측에서는 JavaScript 및 Laravel Echo를 사용하여 실시간 메시지를 모니터링하여 실시간 통신을 달성할 수 있습니다.

또한 Laravel Echo는 복잡한 웹 애플리케이션을 구축하는 데 사용할 수 있는 다양한 방송 채널과 이벤트를 제공합니다. 최신 실시간 통신 솔루션을 찾고 있다면 Laravel Echo와 pusher PHP SDK가 좋은 선택입니다.

위 내용은 Laravel 개발: Laravel Echo를 사용하여 WebSocket 통신을 구현하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!