Laravel 및 새로운 FCM Http V1 API로 푸시 알림을 보내는 방법은 무엇입니까?

17843 단어 laravelprogrammingfirebasewebdev
안녕하세요 세상 😎,

웹 개발에 종사하는 경우 언젠가는 푸시 알림을 보내야 합니다. 푸시 알림은 많은 경우에 유용합니다. 이를 통해 적절한 고객 또는 사용자를 타겟팅하고, 사용자 유지율을 높이고, 전환율을 높이고, 앱 참여를 높일 수 있습니다.

나는 본질적으로 Laravel과 함께 일합니다. 대부분의 프로젝트에서 클라이언트는 사용자에게 푸시 알림을 보내야 합니다. 최신 상태를 유지하기 위해 새 제품FCM Http V1 API을 사용하고 싶었습니다. 라라벨에서 처음 구현해보았는데 별로 재미가 없었습니다. 필요한 것을 얻기 위해 너무 많은 웹사이트를 검색해야 했습니다. 설치와 사용법이 쉬운 Laravel 패키지를 찾지 못해서 하나 만들기로 했습니다.

이 패키지에서는 Firebase 프로젝트와 Laravel 애플리케이션을 한 번에 설정하기만 하면 됩니다.

그 후에는 2줄로만 알림을 보낼 수 있습니다.

이 튜토리얼은 Laravel 프로젝트에서 FCM V1을 구현하는 방법을 단계별로 알려줍니다. Firebase 프로젝트와 Laravel 앱을 구성하는 방법을 살펴보겠습니다. FCM 장치 토큰을 생성하는 방법, 토픽에 토큰을 구독/구독 취소하는 방법, 마지막으로 두 사람이 가장 쉬운 방법으로 푸시 알림을 보내는 방법을 볼 수 있습니다. 준비가 된 ?

요구 사항



Firebase 구성



Firebase Cloud Messaging V1을 구성하려면 패키지의 Firebase 설치appy/fcmhttpv1를 참조하십시오.

라라벨 구성



Laravel 프로젝트를 구성하려면 패키지appy/fcmhttpv1의 Laravel 섹션을 참조하십시오.

FCM V1 구현



이주



디바이스 토큰으로 사용자를 생성하고 저장합니다.

//database/migrations/2014_10_12_000000_create_users_table.php

<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

return new class extends Migration
{
    public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->id();
            $table->text('device_token'); // We'll use this field to store the device token
            $table->timestamps();
        });
    }

    public function down()
    {
        Schema::dropIfExists('users');
    }
};


모델



채울 수 있는 속성에 device_token을 추가합니다.

//app/Models/User.php

<?php

namespace App\Models;

use Illuminate\Foundation\Auth\User as Authenticatable;

class User extends Authenticatable
{
    protected $fillable = [
        'device_token'
    ];
}


노선



장치 토큰을 저장할 경로를 만듭니다.

//routes/web.php

<?php

use App\Http\Controllers\FCMController;
use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    return view('welcome');
});

Route::post('/register-token', [ FCMController::class, 'registerToken'])->name('register-token');


제어 장치



디바이스 토큰으로 사용자를 생성하고 저장합니다.

//app/Http/Controllers/FCMController.php

<?php

namespace App\Http\Controllers;

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

class FCMController extends Controller
{
    public function registerToken(Request $req){
        $user = new User();
        $user->device_token = $req->token;
        $user->save();
    }
}


보다



이 보기에서 FCM 장치 토큰을 생성합니다. 그런 다음 컨트롤러로 보냅니다.

{{-- /resources/views/welcome.blade.php --}}

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>Laravel</title>
    @laravelPWA
</head>

<body>
    <script src='https://www.gstatic.com/firebasejs/8.3.2/firebase-app.js'></script>
    <script src='https://www.gstatic.com/firebasejs/8.3.2/firebase-messaging.js'></script>
    <script type="text/javascript">
        const firebaseConfig = {
            apiKey: "{{ config('fcm_config.firebase_config.apiKey') }}",
            authDomain: "{{ config('fcm_config.firebase_config.authDomain') }}",
            projectId: "{{ config('fcm_config.firebase_config.projectId') }}",
            storageBucket: "{{ config('fcm_config.firebase_config.storageBucket') }}",
            messagingSenderId: "{{ config('fcm_config.firebase_config.messagingSenderId') }}",
            appId: "{{ config('fcm_config.firebase_config.appId') }}",
        };

        firebase.initializeApp(firebaseConfig);
        const messaging = firebase.messaging();

        const csrfToken = document.querySelector('meta[name="csrf-token"]').content;

        messaging
            .requestPermission()
            .then(() =>
                messaging.getToken()
            )
            .then(function(res) {
                fetch("{{ route('register-token') }}", {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json'
                        },
                        body: JSON.stringify({
                            _token: csrfToken,
                            token: res
                        })
                    })
                    .catch(error => console.error(error));
            })
            .catch(function(err) {
                console.error('catch', err);
            });
    </script>
</body>

</html>


공고



알림을 보내려면 Laravel Command를 사용합니다.(테스트용으로 Laravel Command를 사용합니다.)

php artisan make:command FCM




<?php

namespace App\Console\Commands;

use App\Models\User;
use Appy\FcmHttpV1\FcmNotification;
use Appy\FcmHttpV1\FcmTopicHelper;
use Illuminate\Console\Command;

class FCM extends Command
{
    /**
     * The name and signature of the console command.
     *
     * @var string
     */
    protected $signature = '<command name>';

    /**
     * The console command description.
     *
     * @var string
     */
    protected $description = 'Command description';

    /**
     * Execute the console command.
     *
     * @return int
     */
    public function handle()
    {
        $token = User::find(1)->device_token;

        FcmTopicHelper::subscribeToTopic([$token], "general");
        $notif = new FcmNotification;
        $notif->setTitle("Hello")->setBody("Content here")->setIcon("images/icons/icon-72x72.png")->setTopic("general")->send();
    }
}


알림을 보내려면 다음을 실행하십시오.

php artisan <command name>


읽어 주셔서 감사합니다 !
BUY ME A COFFEE 😄
데이터베이스 덤프를 AmazonS3에 업로드
React JSX 내부를 반복하는 방법은 무엇입니까?

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage