Laravel을 사용하여 간단한 채팅방을 만드는 방법

Laravel은 웹 애플리케이션을 빠르고 쉽게 개발할 수 있는 다양한 도구와 기능을 제공하는 인기 있는 PHP 프레임워크입니다. 유용한 응용 프로그램 중 하나는 온라인 채팅방입니다. 이번 글에서는 라라벨을 이용하여 간단한 채팅방을 만드는 방법에 대해 설명하겠습니다.

환경 설정

시작하기 전에 컴퓨터에 PHP, Laravel, Composer 및 웹 서버가 설치되어 있는지 확인하세요. 아직 이러한 소프트웨어가 없다면 먼저 설치해야 합니다. Laravel 및 Composer 설치 방법은 공식 문서에서 확인할 수 있습니다.

Create Project

먼저 Laravel 프로젝트를 생성해야 합니다. 터미널을 열고 그 안에 새 디렉터리를 만들고 다음 명령을 사용하여 새 프로젝트를 만듭니다.

laravel new chatroom

이렇게 하면 chatroom이라는 새 Laravel 프로젝트가 생성됩니다. 이제 해당 디렉터리로 이동하여 다음 명령을 실행합니다.

php artisan serve

이 명령은 내장 웹 서버를 시작하고 로컬 호스트의 포트 8000에서 제공합니다.

모델 및 데이터베이스 만들기

코드 작성을 시작하기 전에 채팅 기록을 저장할 데이터베이스 테이블을 만들어야 합니다. 이를 위해서는 모델을 생성하고 마이그레이션해야 합니다.

다음 명령을 실행하여 모델 및 마이그레이션을 생성합니다.

php artisan make:model Message -m

위 명령은 Message라는 모델과 create_messages_table이라는 마이그레이션을 생성합니다. 마이그레이션 파일을 편집하여 데이터 테이블을 생성합니다. 마이그레이션 파일에서 메시지 구조를 정의해야 합니다. 예는 다음과 같습니다.

public function up()
{
    Schema::create('messages', function (Blueprint $table) {
        $table->id();
        $table->string('author');
        $table->string('message');
        $table->timestamps();
    });
}

이 마이그레이션은 ID, 작성자, 메시지 및 타임스탬프 필드가 있는 메시지 테이블을 생성합니다. 그런 다음 다음 명령을 실행하여 마이그레이션을 실행합니다.

php artisan migrate

컨트롤러 및 보기 만들기

채팅방에 대한 컨트롤러와 보기를 만들어야 합니다. Laravel에는 아름다운 웹 페이지를 쉽게 만들 수 있는 매우 강력한 블레이드 템플릿 엔진이 포함되어 있습니다. 이를 위해서는 컨트롤러와 일부 뷰를 생성해야 합니다.

다음 명령을 실행하여 컨트롤러를 생성하세요.

php artisan make:controller ChatController

이렇게 하면 ChatController라는 컨트롤러가 생성됩니다. 다음으로 컨트롤러를 편집하여 채팅방 페이지의 로직을 처리하는 코드를 추가합니다. 기본 예는 다음과 같습니다.

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Message;

class ChatController extends Controller
{
    public function index()
    {
        return view('chat.index');
    }

    public function store(Request $request)
    {
        $message = new Message();
        $message->author = $request->input('author');
        $message->message = $request->input('message');
        $message->save();

        return response()->json(['status' => 'success']);
    }

    public function messages()
    {
        $messages = Message::all();

        return response()->json($messages);
    }
}

이 컨트롤러에는 세 가지 방법이 있습니다. 첫 번째 메소드 index()는 채팅방 페이지 보기를 반환하는 데 사용됩니다. 두 번째 메소드 store()는 메시지를 데이터베이스에 저장하는 데 사용됩니다. 세 번째 메서드인 message()는 모든 메시지의 JSON 응답을 반환하는 데 사용됩니다.

다음으로 뷰를 생성해야 합니다. resources/views 디렉터리에 chat 디렉터리를 새로 만들고 그 안에 index.blade.php라는 파일을 만드세요. 이 파일에는 사용자가 메시지를 보내고 아래의 모든 메시지를 표시할 수 있는 양식을 추가해야 합니다. 예는 다음과 같습니다.

@extends('layouts.master')

@section('content')
    <div class="card">
        <div class="card-header">Chat Room</div>

        <div class="card-body">
            <form id="chat-form">
                <div class="form-group">
                    <label for="author">Name:</label>
                    <input type="text" id="author" name="author" class="form-control" required>
                </div>

                <div class="form-group">
                    <label for="message">Message:</label>
                    <textarea id="message" name="message" rows="5" class="form-control" required></textarea>
                </div>

                <button type="submit" class="btn btn-primary">Send</button>
            </form>

            <hr>

            <ul id="messages">
                
            </ul>
        </div>
    </div>

    <script>
        // 使用 jQuery 来处理表单提交事件
        $('#chat-form').submit(function (event) {
            event.preventDefault();

            $.post('/messages', $(this).serialize(), function (data) {
                console.log(data);

                if (data.status === 'success') {
                    $('#chat-form')[0].reset();
                }
            });
        });

        // 从服务器获取消息并添加到列表中
        function getMessagesFromServer() {
            $.get('/messages', function (data) {
                var html = '';

                $.each(data, function (index, message) {
                    html += '<li><strong>' + message.author + '</strong>: ' + message.message + '</li>';
                });

                $('#messages').html(html);
            });
        }

        // 每隔一秒钟从服务器获取消息
        setInterval(function () {
            getMessagesFromServer();
        }, 1000);
    </script>
@endsection

보기는 양식과 메시지 목록의 두 부분으로 구성됩니다. 이 양식을 통해 사용자는 자신의 이름과 보낼 메시지를 입력할 수 있습니다. 메시지 목록에는 이전에 채팅방에 보낸 모든 메시지가 표시됩니다.

Done

이제 메시지를 저장할 수 있는 데이터베이스 테이블, 모든 메시지를 표시할 수 있는 뷰, 새 메시지를 수락하고 데이터베이스의 컨트롤러 메서드에 저장할 수 있는 뷰가 포함된 기본 채팅방 애플리케이션을 성공적으로 만들었습니다. . 이제 채팅방에 들어가려면 웹 브라우저에서 http://localhost:8000/chat에 액세스하기만 하면 됩니다.

위 내용은 Laravel을 사용하여 간단한 채팅방을 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!