So fügen Sie Laravel mit Pusher Echtzeit-Benachrichtigungen hinzu

Dieser Artikel wurde von Rafie Younes und Wern Ancheta geprüft. Vielen Dank an alle Peer -Rezensenten von SitePoint, die SitePoint -Inhalte so gut wie möglich gemacht haben!

---

Der moderne Webbenutzer erwartet, über alles informiert zu werden, was in der Anwendung passiert. Sie möchten nicht diese eine Website sein, auf der die Dropdown -Note nicht nur auf allen Social -Media -Websites, sondern auch überall sonst noch in diesen Tagen vorhanden ist.

Zum Glück ist die Implementierung dieser Funktionalität mit Laravel und Pusher ein Kinderspiel. Der Code, den wir in diesem Tutorial schreiben, finden Sie hier.

Bild über pusher.com

Key Takeaways

• Verwenden Sie Laravel und Pusher, um Echtzeitbenachrichtigungen zu implementieren und die Benutzerinteraktion zu verbessern, indem Sie sofortiges Feedback zu Benutzeraktivitäten geben.
• Pusher vereinfacht die Integration von bidirektionalen Echtzeit-Funktionen mithilfe von Websockets, was effizienter ist als in Intervallen mit AJAX zu befragen.
• Richten Sie eine einfache Laravel -Blog -Anwendung ein, konfigurieren Sie eine MySQL -Datenbank und verwenden Sie Migrationen, um ein Followers -System für Benutzerinteraktionen zu erstellen.
• Verwenden Sie das integrierte Benachrichtigungssystem von Laravel, um Benachrichtigungen über neue Follower und Beiträge zu senden und die dynamischen Interaktionsfunktionen der Anwendung zu verbessern.
• Implementieren Sie Echtzeitbenachrichtigungen mit Pusher, sodass Benachrichtigungen sofort empfangen werden können, wenn Ereignisse auftreten, ohne die Seite zu aktualisieren.
• sichern Sie die Echtzeitanwendung, indem Sie private Kanäle und Authentifizierung verwenden, um sicherzustellen, dass Benachrichtigungen nur von beabsichtigten Benutzern empfangen werden.

Echtzeit-Benachrichtigungen

Um den Benutzern eine gute Erfahrung zu bieten, sollten Benachrichtigungen in Echtzeit angezeigt werden. Ein Ansatz besteht darin, eine AJAX -Anfrage regelmäßig an das Back End zu senden und die neuesten Benachrichtigungen zu holen, wenn sie existieren.

Ein besserer Ansatz besteht darin, die Leistung von Websockets zu nutzen und Benachrichtigungen zu erhalten, sobald sie gesendet werden. Das werden wir in diesem Tutorial verwenden.

pusher

Pusher ist ein Webdienst für

… Integration von Echtzeitbi-Direktionalfunktionen über WebSockets in Web- und Mobile-Apps.

Es hat eine sehr einfache API, aber wir werden es noch einfacher mit Laravel Broadcasting und Laravel Echo machen.

In diesem Tutorial werden wir einem vorhandenen Blog Echtzeitbenachrichtigungen hinzufügen. Die grundlegende Funktionalität ähnelt Echtzeit-Laravel-Benachrichtigungen mit Stream. Wir beginnen mit diesem Repo von Christopher Vundi (ich habe es nur ein wenig geändert), ein einfaches Blog, in dem Benutzer Crud in Posts ausführen können.

Das Projekt

Initialisierung

Zuerst klonen wir den einfachen Laravel -Blog:

<span>git clone https://github.com/vickris/simple-blog
</span>

Dann erstellen wir eine MySQL -Datenbank und richten Umgebungsvariablen ein, um den Anwendungszugriff auf die Datenbank zu erhalten.

Kopieren wir env.example in .env und aktualisieren Sie die datenbankbezogenen Variablen.

<span>cp .env.example .env
</span>

DB_HOST=localhost
DB_DATABASE=homestead
DB_USERNAME=homestead
DB_PASSWORD=secret

.env

Lassen Sie uns nun die Abhängigkeiten des Projekts mit

installieren

<span>composer install
</span>

und führen Sie den Befehl Migration und Seeding aus, um die Datenbank mit einigen Daten zu füllen:

php artisan migrate <span>--seed
</span>

Wenn Sie die Anwendung ausführen und besuchen /Beiträge besuchen, können Sie eine Auflistung generierter Beiträge anzeigen. Überprüfen Sie die Anwendung, registrieren Sie einen Benutzer und erstellen Sie einige Beiträge. Es ist eine sehr grundlegende App, dient aber perfekt unserer Demo.

Folgen Sie den Benutzern Beziehungen

wir möchten den Benutzern die Möglichkeit geben, anderen Benutzern zu folgen, und von Benutzern folgen. Daher müssen wir viele bis viele Beziehung zwischen Benutzern schaffen, um dies zu erreichen.

Erstellen wir eine Pivot -Tabelle, die Benutzer mit Benutzern bezieht. Machen Sie eine neue Follower -Migration:

php artisan make:migration create_followers_table <span>--create=followers
</span>

Wir müssen dieser Migration einige Felder hinzufügen: einen Benutzer_ID, der den Benutzer darstellt, der folgt, und ein folgendes Feld, um den Benutzer darzustellen, der befolgt wird.

Aktualisieren Sie die Migration wie folgt:

<span>public function up()
</span><span>{
</span>    <span>Schema<span>::</span>create('followers', function (Blueprint $table) {
</span>        <span>$table->increments('id');
</span>        <span>$table->integer('user_id')->index();
</span>        <span>$table->integer('follows_id')->index();
</span>        <span>$table->timestamps();
</span>    <span>});
</span><span>}
</span>

Migrieren wir nun, um die Tabelle zu erstellen:

php artisan migrate

Wenn Sie den Artikel des Stream -Ansatzes befolgt haben, werden Sie feststellen, dass die Dinge bis zu diesem Zeitpunkt fast identisch sind. In dem folgenden Teil erreichen wir die gleiche Follow -Funktionalität mit einem anderen Ansatz.

Fügen wir dem Benutzermodell Beziehungsmethoden hinzu.

<span>// ...
</span>
<span>class extends Authenticatable
</span><span>{
</span>    <span>// ...
</span>
    <span>public function followers() 
</span>    <span>{
</span>        <span>return $this->belongsToMany(<span>self::</span>class, 'followers', 'follows_id', 'user_id')
</span>                    <span>->withTimestamps();
</span>    <span>}
</span>
    <span>public function follows() 
</span>    <span>{
</span>        <span>return $this->belongsToMany(<span>self::</span>class, 'followers', 'user_id', 'follows_id')
</span>                    <span>->withTimestamps();
</span>    <span>}
</span><span>}
</span>

app/user.php

Jetzt, da das Benutzermodell über die erforderlichen Beziehungen verfügt, gibt die Follower alle Follower eines Benutzers zurück und gibt alle zurück, die der Benutzer folgt.

Wir benötigen einige Helferfunktionen, damit der Benutzer einem anderen Benutzer folgen kann, und zu überprüfen, ob ein Benutzer einen bestimmten Benutzer verfolgt.

<span>// ...
</span>
<span>class extends Authenticatable
</span><span>{
</span>    <span>// ...
</span>
    <span>public function follow($userId) 
</span>    <span>{
</span>        <span>$this->follows()->attach($userId);
</span>        <span>return $this;
</span>    <span>}
</span>
    <span>public function unfollow($userId)
</span>    <span>{
</span>        <span>$this->follows()->detach($userId);
</span>        <span>return $this;
</span>    <span>}
</span>
    <span>public function isFollowing($userId) 
</span>    <span>{
</span>        <span>return (boolean) $this->follows()->where('follows_id', $userId)->first(['id']);
</span>    <span>}
</span>
<span>}
</span>

app/user.php

perfekt. Mit dem Modellsatz ist es Zeit, Benutzer aufzulisten.

Benutzer auflisten

Beginnen wir zunächst die erforderlichen Routen

festlegen

<span>//...
</span><span>Route<span>::</span>group(['middleware' => 'auth'], function () {
</span>    <span>Route<span>::</span>get('users', 'UsersController@index')->name('users');
</span>    <span>Route<span>::</span>post('users/{user}/follow', 'UsersController@follow')->name('follow');
</span>    <span>Route<span>::</span>delete('users/{user}/unfollow', 'UsersController@unfollow')->name('unfollow');
</span><span>});
</span>

Routes/web.php

Dann ist es Zeit, einen neuen Controller für Benutzer zu erstellen:

php artisan make:controller UsersController

Wir werden eine Indexmethode hinzufügen:

<span>// ...
</span><span>use App<span>\User</span>;
</span><span>class UsersController extends Controller
</span><span>{
</span>    <span>//..
</span>    <span>public function index()
</span>    <span>{
</span>        <span>$users = User<span>::</span>where('id', '!=', auth()->user()->id)->get();
</span>        <span>return view('users.index', compact('users'));
</span>    <span>}
</span><span>}
</span>

app/http/Controller/userController.php

Die Methode braucht eine Ansicht. Erstellen wir die Benutzer.Index -Ansicht und geben Sie dieses Markup ein:

@<span>extends('layouts.app')
</span>
@<span>section('content')
</span>    <span><div class="container">
        <span><div class="col-sm-offset-2 col-sm-8">

            <span><!-- Following -->
</span>            <span><div class="panel panel-default">
                <span><div class="panel-heading">
                    All Users
                <span></span>
</div>
</span>
                <span><div class="panel-body">
                    <span><table class="table table-striped task-table">
                        <span><thead>
                        <span></span><th>User</th>
                        <span></span><th> </th>
                        <span></span>
</thead>
</span>                        <span><tbody>
                        @<span>foreach ($users as $user)
</span>                            <span><tr>
                                <span></span><td clphpass="table-text"><div>{{ $user->name }}</div></td>
                                @<span>if (auth()->user()->isFollowing($user->id))
</span>                                    <span></span><td>
                                        <span><form action="%7B%7Broute('unfollow',%20%5B'id'%20=>%20<span%20><span%20>%24user->id</span>%5D)%7D%7D"> method="POST">
</form></span>                                            <span>{{ csrf_field() }}
</span>                                            <span>{{ method_field('DELETE') }}
</span>
                                            <span><button type="submit" id="delete-follow-{{ <span ><span >$user->id</span> }}"> class="btn btn-danger">
</button></span>                                                <span><i class="fa fa-btn fa-trash"></i>Unfollow
</span>                                            <span>
</span>                                        <span>
</span>                                    <span></span>
</td>
                                @<span>else
</span>                                    <span></span><td>
                                        <span><form action="%7B%7Broute('follow',%20%5B'id'%20=>%20<span%20><span%20>%24user->id</span>%5D)%7D%7D"> method="POST">
</form></span>                                            <span>{{ csrf_field() }}
</span>
                                            <span><button type="submit" id="follow-user-{{ <span ><span >$user->id</span> }}"> class="btn btn-success">
</button></span>                                                <span><i class="fa fa-btn fa-user"></i>Follow
</span>                                            <span>
</span>                                        <span>
</span>                                    <span></span>
</td>
                                @<span>endif
</span>                            <span></span>
</tr>
</span>                        @<span>endforeach
</span>                        <span></span>
</tbody>
</span>                    <span></span>
</table>
</span>                <span></span>
</div>
</span>            <span></span>
</div>
</span>        <span></span>
</div>
</span>    <span></span>
</div>
</span>@endsection

Ressourcen/Ansichten/Benutzer/Index.blade.php

Sie können jetzt die Seite /Benutzer besuchen, um eine Auflistung von Benutzern anzuzeigen.

folgen oder nicht folgen

dem UsersController fehlt und folgen Sie die Methoden. Lassen Sie uns diesen Teil erledigen.

<span>//...
</span><span>class UsersController extends Controller
</span><span>{
</span>    <span>//...
</span>    <span>public function follow(User $user)
</span>    <span>{
</span>        <span>$follower = auth()->user();
</span>        <span>if ($follower->id == $user->id) {
</span>            <span>return back()->withError("You can't follow yourself");
</span>        <span>}
</span>        <span>if(!$follower->isFollowing($user->id)) {
</span>            <span>$follower->follow($user->id);
</span>
            <span>// sending a notification
</span>            <span>$user->notify(new UserFollowed($follower));
</span>
            <span>return back()->withSuccess("You are now friends with <span><span>{$user->name}</span>"</span>);
</span>        <span>}
</span>        <span>return back()->withError("You are already following <span><span>{$user->name}</span>"</span>);
</span>    <span>}
</span>
    <span>public function unfollow(User $user)
</span>    <span>{
</span>        <span>$follower = auth()->user();
</span>        <span>if($follower->isFollowing($user->id)) {
</span>            <span>$follower->unfollow($user->id);
</span>            <span>return back()->withSuccess("You are no longer friends with <span><span>{$user->name}</span>"</span>);
</span>        <span>}
</span>        <span>return back()->withError("You are not following <span><span>{$user->name}</span>"</span>);
</span>    <span>}
</span><span>}
</span>

app/http/Controller/userController.php

Wir sind mit der Follow -Funktionalität fertig. Wir können jetzt Benutzer auf der Seite /Benutzer folgen und nicht folgen.

Benachrichtigungen

laravel bietet eine API zum Senden von Benachrichtigungen über mehrere Kanäle. E -Mails, SMS, Web -Benachrichtigungen und andere Art von Benachrichtigungen können mit der Benachrichtigungsklasse gesendet werden.

Wir werden zwei Arten von Benachrichtigungen haben:

• Befolgen Sie die Benachrichtigung: An einen Benutzer gesendet, wenn er von einem anderen Benutzer
wird
• post erstellte Benachrichtigung: An die Follower eines bestimmten Benutzers gesendet, wenn er einen neuen Beitrag erstellt

Benutzer befolgt die Benachrichtigung

Verwenden von Artisan -Befehlen können wir eine Migration für Benachrichtigungen erstellen:

<span>git clone https://github.com/vickris/simple-blog
</span>

Migrieren und erstellen Sie diese neue Tabelle.

<span>cp .env.example .env
</span>

Wir beginnen mit Follow -Benachrichtigungen. Führen Sie diesen Befehl aus, um eine Benachrichtigungsklasse zu generieren:

DB_HOST=localhost
DB_DATABASE=homestead
DB_USERNAME=homestead
DB_PASSWORD=secret

Dann aktualisieren wir die gerade erstellte Benachrichtigungsklassendatei:

<span>composer install
</span>

App/Benachrichtigungen/userFolfeed.php

Mit diesen wenigen Codezeilen können wir viel erreichen. Zuerst benötigen wir eine Instanz des $ -Followers, das bei der Erstellung dieser Benachrichtigung injiziert werden kann.

Verwenden der VIA -Methode geben wir Laravel an, diese Benachrichtigung über den Datenbankkanal zu senden. Wenn Laravel darauf trifft, wird in der Tabelle Benachrichtigungen einen neuen Datensatz erstellt.

Der user_id- und Benachrichtigungstyp werden automatisch eingestellt, und wir können uns erweitern die Benachrichtigung mit mehr Daten. Dafür ist Todatabase da. Das zurückgegebene Array wird dem Datenfeld der Benachrichtigung hinzugefügt.

schließlich setzt Laravel durch Implementierung von Solls, dass Laravel diese Benachrichtigung in einer Warteschlange im Hintergrund automatisch einbringt, was die Antwort beschleunigt. Dies ist sinnvoll, da wir HTTP -Anrufe hinzufügen werden, wenn wir später Pusher verwenden.

Lassen Sie uns die Benachrichtigung einleiten, wenn der Benutzer befolgt wird.

php artisan migrate <span>--seed
</span>

app/http/Controller/userController.php

Wir können die Benachrichtigungsmethode auf einem Benutzermodell aufrufen, da es bereits das mit dem notifizierbare Merkmal verwendet. Jedes Modell, das Sie benachrichtigen möchten, sollte es verwenden, um Zugriff auf die Benachrichtigungsmethode zu erhalten.

Markieren Sie eine Benachrichtigung als Lesen

Benachrichtigungen enthalten einige Informationen und einen Link zu einer Ressource. Zum Beispiel: Wenn ein Benutzer eine Benachrichtigung über einen neuen Beitrag erhält, sollte die Benachrichtigung einen informativen Text anzeigen, den Benutzer beim Klicken in den Beitrag umleiten und wie gelesen markiert werden.

Wir werden eine Middleware erstellen, die überprüft, ob eine Anforderung eine Eingabe von Read = Notification_id hat und sie als LEAD markiert.

Erstellen wir mit dem folgenden Befehl eine Middleware:

php artisan make:migration create_followers_table <span>--create=followers
</span>

Stellen wir diesen Code dann in die Handlungsmethode der Middleware ein:

<span>public function up()
</span><span>{
</span>    <span>Schema<span>::</span>create('followers', function (Blueprint $table) {
</span>        <span>$table->increments('id');
</span>        <span>$table->integer('user_id')->index();
</span>        <span>$table->integer('follows_id')->index();
</span>        <span>$table->timestamps();
</span>    <span>});
</span><span>}
</span>

app/http/Middleware/MarknotificationAsRead.php

Um unsere Middleware für jede Anfrage auszuführen, werden wir sie zu $ ​​MiddlewareGroups hinzufügen.

<span>git clone https://github.com/vickris/simple-blog
</span>

app/http/kernel.php

Zeigen wir damit einige Benachrichtigungen.

Benachrichtigungen zeigen

Wir müssen eine Auflistung der Benachrichtigungen mit AJAX anzeigen und sie dann in Echtzeit mit Pusher aktualisieren. Fügen wir zunächst dem Controller eine Benachrichtigungsmethode hinzu:

<span>cp .env.example .env
</span>

app/http/Controller/userController.php

Dies gibt die letzten 5 ungelesenen Benachrichtigungen zurück. Wir müssen nur eine Route hinzufügen, um sie zugänglich zu machen.

DB_HOST=localhost
DB_DATABASE=homestead
DB_USERNAME=homestead
DB_PASSWORD=secret

Routes/web.php

Fügen Sie nun eine Dropdown -Stelle für Benachrichtigungen im Header hinzu.

<span>composer install
</span>

Ressourcen/Ansichten/Layouts/App.blade.php

Wir haben auch ein globales Fenster hinzugefügt.

JavaScript und Sass

Wir werden Laravel Mix verwenden, um JavaScript und Sass zu kompilieren. Zuerst müssen wir NPM -Pakete installieren.

php artisan migrate <span>--seed
</span>

Lassen Sie uns diesen Code nun in app.js:

hinzufügen

php artisan make:migration create_followers_table <span>--create=followers
</span>

app/ressourcen/assets/js/app.js

Dies ist nur eine Initialisierung. Wir werden Benachrichtigungen verwenden, um alle Benachrichtigungsobjekte zu speichern, unabhängig davon, ob sie über Ajax oder Pusher abgerufen werden.

Sie haben es wahrscheinlich erraten, notification_types enthält Arten von Benachrichtigungen.

Nächst

<span>public function up()
</span><span>{
</span>    <span>Schema<span>::</span>create('followers', function (Blueprint $table) {
</span>        <span>$table->increments('id');
</span>        <span>$table->integer('user_id')->index();
</span>        <span>$table->integer('follows_id')->index();
</span>        <span>$table->timestamps();
</span>    <span>});
</span><span>}
</span>

app/ressourcen/assets/js/app.js

damit erhalten wir die neuesten Benachrichtigungen von unserer API und stecken sie in den Dropdown.

Inside Addnotifications Wir verkettet die vorliegenden Benachrichtigungen mit den neuen Lodash und nehmen nur die neuesten 5, um gezeigt zu werden.

Wir benötigen ein paar weitere Funktionen, um den Job zu beenden.

php artisan migrate

app/ressourcen/assets/js/app.js

Diese Funktion erstellt eine Zeichenfolge aller Benachrichtigungen und steckt sie in die Dropdown -Art. Wenn keine Benachrichtigungen eingehen, zeigt es nur „keine Benachrichtigungen“.

fügt der Dropdown -Taste auch eine Klasse hinzu, die nur seine Farbe ändert, wenn Benachrichtigungen vorhanden sind. Es ist ein bisschen wie die Benachrichtigungen von Github.

Schließlich einige Helferfunktionen, um Benachrichtigungsketten zu erstellen.

<span>// ...
</span>
<span>class extends Authenticatable
</span><span>{
</span>    <span>// ...
</span>
    <span>public function followers() 
</span>    <span>{
</span>        <span>return $this->belongsToMany(<span>self::</span>class, 'followers', 'follows_id', 'user_id')
</span>                    <span>->withTimestamps();
</span>    <span>}
</span>
    <span>public function follows() 
</span>    <span>{
</span>        <span>return $this->belongsToMany(<span>self::</span>class, 'followers', 'user_id', 'follows_id')
</span>                    <span>->withTimestamps();
</span>    <span>}
</span><span>}
</span>

app/ressourcen/assets/js/app.js

Jetzt fügen wir dies einfach zu unserer App.scss -Datei hinzu:

<span>// ...
</span>
<span>class extends Authenticatable
</span><span>{
</span>    <span>// ...
</span>
    <span>public function follow($userId) 
</span>    <span>{
</span>        <span>$this->follows()->attach($userId);
</span>        <span>return $this;
</span>    <span>}
</span>
    <span>public function unfollow($userId)
</span>    <span>{
</span>        <span>$this->follows()->detach($userId);
</span>        <span>return $this;
</span>    <span>}
</span>
    <span>public function isFollowing($userId) 
</span>    <span>{
</span>        <span>return (boolean) $this->follows()->where('follows_id', $userId)->first(['id']);
</span>    <span>}
</span>
<span>}
</span>

app/ressourcen/assets/sass/app.scss

Lassen Sie uns Vermögenswerte kompilieren:

<span>//...
</span><span>Route<span>::</span>group(['middleware' => 'auth'], function () {
</span>    <span>Route<span>::</span>get('users', 'UsersController@index')->name('users');
</span>    <span>Route<span>::</span>post('users/{user}/follow', 'UsersController@follow')->name('follow');
</span>    <span>Route<span>::</span>delete('users/{user}/unfollow', 'UsersController@unfollow')->name('unfollow');
</span><span>});
</span>

Wenn Sie versuchen, einem Benutzer jetzt zu folgen, erhalten er eine Benachrichtigung. Wenn sie darauf klicken, werden sie zu /Benutzern umgeleitet, und die Benachrichtigung verschwindet.

Neue Postbenachrichtigung

Wir werden Follower benachrichtigen, wenn ein Benutzer einen neuen Beitrag erstellt.

Beginnen wir zunächst die Benachrichtigungsklasse.

<span>git clone https://github.com/vickris/simple-blog
</span>

Aktualisieren wir die generierte Klasse wie folgt:

<span>cp .env.example .env
</span>

App/Benachrichtigungen/newArticle.php

Als nächstes müssen wir die Benachrichtigung senden. Es gibt verschiedene Möglichkeiten, wie wir dies tun könnten. Ich benutze gerne eloquente Beobachter.

Lassen Sie uns einen Beobachter für die Post machen und seine Ereignisse hören. Wir erstellen eine neue Klasse: App/Beobachter/postobserver.php

DB_HOST=localhost
DB_DATABASE=homestead
DB_USERNAME=homestead
DB_PASSWORD=secret

Registrieren Sie den Beobachter in AppServiceProvider:

<span>composer install
</span>

App/Anbieter/AppServiceProvider.php

Jetzt müssen wir nur die in JS angezeigte Nachricht formatieren:

php artisan migrate <span>--seed
</span>

app/ressourcen/assets/js/app.js

und voilà! Benutzer erhalten Benachrichtigungen über Follows und neue Beiträge! Mach weiter und probiere es aus!

Echtzeit mit Pusher

Es ist Zeit, Pusher zu verwenden, um Benachrichtigungen in Echtzeit über WebSockets zu erhalten.

Melden Sie sich bei Pusher.com für ein Free Pusher -Konto an und erstellen Sie eine neue App.

php artisan make:migration create_followers_table <span>--create=followers
</span>

Stellen Sie die Optionen Ihres Kontos in der Konfigurationsdatei von Broadcasting fest:

<span>public function up()
</span><span>{
</span>    <span>Schema<span>::</span>create('followers', function (Blueprint $table) {
</span>        <span>$table->increments('id');
</span>        <span>$table->integer('user_id')->index();
</span>        <span>$table->integer('follows_id')->index();
</span>        <span>$table->timestamps();
</span>    <span>});
</span><span>}
</span>

config/runding.php

Dann registrieren wir AppProvidersBroadcastServiceProvider im Anbieter -Array.

php artisan migrate

config/app.php

Wir sollten jetzt Pusher's PHP SDK und Laravel Echo installieren:

<span>// ...
</span>
<span>class extends Authenticatable
</span><span>{
</span>    <span>// ...
</span>
    <span>public function followers() 
</span>    <span>{
</span>        <span>return $this->belongsToMany(<span>self::</span>class, 'followers', 'follows_id', 'user_id')
</span>                    <span>->withTimestamps();
</span>    <span>}
</span>
    <span>public function follows() 
</span>    <span>{
</span>        <span>return $this->belongsToMany(<span>self::</span>class, 'followers', 'user_id', 'follows_id')
</span>                    <span>->withTimestamps();
</span>    <span>}
</span><span>}
</span>

<span>// ...
</span>
<span>class extends Authenticatable
</span><span>{
</span>    <span>// ...
</span>
    <span>public function follow($userId) 
</span>    <span>{
</span>        <span>$this->follows()->attach($userId);
</span>        <span>return $this;
</span>    <span>}
</span>
    <span>public function unfollow($userId)
</span>    <span>{
</span>        <span>$this->follows()->detach($userId);
</span>        <span>return $this;
</span>    <span>}
</span>
    <span>public function isFollowing($userId) 
</span>    <span>{
</span>        <span>return (boolean) $this->follows()->where('follows_id', $userId)->first(['id']);
</span>    <span>}
</span>
<span>}
</span>

Wir müssen die Benachrichtigungsdaten festlegen, die ausgestrahlt werden sollen. Aktualisieren wir die benutzergefolgte Benachrichtigung:

<span>//...
</span><span>Route<span>::</span>group(['middleware' => 'auth'], function () {
</span>    <span>Route<span>::</span>get('users', 'UsersController@index')->name('users');
</span>    <span>Route<span>::</span>post('users/{user}/follow', 'UsersController@follow')->name('follow');
</span>    <span>Route<span>::</span>delete('users/{user}/unfollow', 'UsersController@unfollow')->name('unfollow');
</span><span>});
</span>

App/Benachrichtigungen/userFolfeed.php

und NewPost:

php artisan make:controller UsersController

App/Benachrichtigungen/newpost.php

Das Letzte, was wir tun müssen, ist unsere JS zu aktualisieren. Öffnen Sie App.js und fügen Sie den folgenden Code

hinzu

<span>// ...
</span><span>use App<span>\User</span>;
</span><span>class UsersController extends Controller
</span><span>{
</span>    <span>//..
</span>    <span>public function index()
</span>    <span>{
</span>        <span>$users = User<span>::</span>where('id', '!=', auth()->user()->id)->get();
</span>        <span>return view('users.index', compact('users'));
</span>    <span>}
</span><span>}
</span>

app/ressourcen/assets/js/app.js

Und wir sind hier fertig. Benachrichtigungen werden in Echtzeit hinzugefügt. Sie können jetzt mit der App spielen und sehen, wie Benachrichtigungen aktualisiert werden.

Schlussfolgerung

Pusher hat eine sehr einfache API, die die Empfang von Echtzeit-Events unglaublich einfach macht. In Verbindung mit Laravel -Benachrichtigungen konnten wir eine Benachrichtigung über mehrere Kanäle (E -Mail, SMS, Slack usw.) von einem Ort senden. In diesem Tutorial haben wir einem einfachen Blog die Funktionen der Benutzerverfolgung hinzugefügt und sie mit den oben genannten Tools verbessert, um eine reibungslose Echtzeitfunktionalität zu erhalten.

Es gibt noch viel mehr zu Pusher und zu Laravel -Benachrichtigungen: In Tandem können Sie mit den Diensten Pub-/Sub -Nachrichten in Echtzeit an Browser, Handys und IoT -Geräte senden. Es gibt auch eine Präsenz -API, um Online-/Offline -Status von Benutzern zu erhalten.

Bitte überprüfen Sie ihre jeweiligen Dokumentationen (Pusher -Dokumente, Pusher -Tutorials, Laravel -Dokumente), um sie ausführlicher zu erforschen und ihr wahres Potenzial zu nutzen.

Lassen Sie mich hören, was Sie mit diesen Technologien in den Kommentaren aufgebaut haben.

häufig gestellte Fragen (FAQs) zu Echtzeitbenachrichtigungen in Laravel mit Pusher

Wie kann ich Probleme mit Laravel und Pusher -Integration beheben? Das erste, was Sie tun sollten, ist Ihre .EnV -Datei zu überprüfen, um sicherzustellen, dass Ihre Pusher -App -Anmeldeinformationen korrekt eingegeben werden. Wenn die Anmeldeinformationen korrekt sind, können Sie die Pusher -Debug -Konsole verwenden, um Fehler zu überprüfen. Wenn Sie weiterhin Probleme haben, können Sie die integrierte Protokollierungsfunktion von LaRavel verwenden, um alle während des Rundfunkprozesses aufzusetzen. Dies kann Ihnen helfen, genau zu bestimmen, wo das Problem auftritt.

Kann ich Laravel und Pusher für mobile Benachrichtigungen verwenden? Pusher bietet eine REST -API, mit der Sie Benachrichtigungen an mobile Geräte senden können. Sie können die Event -Broadcasting -Funktion von Laravel verwenden, um diese Benachrichtigungen auszulösen. Wenn ein Ereignis ausgestrahlt wird, können Sie es in Ihrer mobilen App fangen und die Benachrichtigung anzeigen.

Wie kann ich das Aussehen meiner Benachrichtigungen anpassen? Die clientseitige, nicht auf der serverseitigen. Dies bedeutet, dass Sie JavaScript, CSS oder eine andere clientseitige Technologie verwenden müssen, um Ihre Benachrichtigungen anzupassen. Pusher bietet eine JavaScript -Bibliothek, mit der Sie auf Ereignisse anhören und Benachrichtigungen anzeigen können. Sie können diese Bibliothek in Kombination mit Ihrem eigenen CSS verwenden, um das Aussehen Ihrer Benachrichtigungen anzupassen. Verwenden der integrierten Testfunktionen von Laravel. Sie können einen Test schreiben, der ein Ereignis auslöst, und dann die Pusher -Debug -Konsole verwenden, um zu überprüfen, ob die Veranstaltung ausgestrahlt wurde. Sie können auch Tests schreiben, um zu überprüfen, ob Ihre Event -Hörer korrekt arbeiten. Ihre Daten. Sie können Ihre Integration mithilfe privater Kanäle sichern. Private Kanäle erfordern eine Authentifizierung, was bedeutet, dass nur autorisierte Benutzer sie abonnieren können. Sie können die Authentifizierung mithilfe der integrierten Authentifizierungsfunktionen von Laravel implementieren. Anwendungen. Pusher bietet Echtzeitfunktionen, mit denen Sie Nachrichten sofort senden und empfangen können. Sie können Laravels Ereignisübertragungsfunktion verwenden, um diese Nachrichten auszulösen.

Wie kann ich Fehler in meiner Laravel- und Pusher-Integration umgehen? Sie können alle Ausnahmen fangen, die während des Rundfunkprozesses auftreten und diese entsprechend behandeln. Sie können auch die Pusher -Debug -Konsole verwenden, um auf Fehler zu suchen. Ereignisse, die Sie übertragen haben. Durch Rundfunk zu viele Ereignisse können Ihre Anwendung verlangsamt und viele Ressourcen konsumieren. Sie können Ihre Integration auch optimieren, indem Sie das Warteschlangensystem von Laravel verwenden, um Ereignisse im Hintergrund zu verarbeiten.

Kann ich Laravel und Pusher für Live -Streaming -Anwendungen verwenden? Live -Streaming -Anwendungen. Pusher bietet Echtzeitfunktionen, mit denen Sie Live-Video-Streams übertragen können. Sie können Laravels Event -Broadcasting -Funktion verwenden, um diese Streams auszulösen. Sie können diese Funktionen verwenden, um die Anzahl der von Ihnen gesendeten Nachrichten, die Anzahl der Verbindungen und andere wichtige Metriken zu verfolgen. Sie können auch die integrierte Protokollierungsfunktion von Laravel verwenden, um alle Fehler zu protokollieren, die während des Rundfunkprozesses auftreten.

Das obige ist der detaillierte Inhalt vonSo fügen Sie Laravel mit Pusher Echtzeit-Benachrichtigungen hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!