Realtime-Benachrichtigungen mit Ajax

Question

Hallo ich bin ein neuer Entwickler und in meinem Laravel-Projekt habe ich eine Echtzeit-Chat-Funktion mit Ajax implementiert, aber ich möchte auch ein Echtzeit-Benachrichtigungssystem mit Ajax hinzufügen, wenn eine Nachricht alle geschrieben wird Benutzer für diese Nachricht benachrichtigt werden, wäre es sehr hilfreich sein, wenn Sie mich

hier helfen könnte meine Index-Seite ist:

@extends('admin.app') 
@section('content') 
    <div class="container"> 
     <div class="row" style ="padding-top:40px;"> 
      <h3 class="text-center">Welcome {{Auth::user()->FullName}}</h3> 
      <br/><br/> 
      <div class="col-md-2"> 
        <p>Users online</p> 
        @foreach($users as $user) 
         @if($user->isOnline()) 
          <li>{{$user->FullName}}</li> 
         @endif 
        @endforeach 


      </div> 

      <div class="col-md-8"> 
       <div class="panel panel-info"> 
        <div class="panel-heading"> 
         Recent Chat 
        </div> 
        <div class="panel-body"> 
         <ul class="media-list" id="message"> 

          @foreach($messages as $message) 
           <li class="media"> 
            <div class="media-body"> 
             <div class="media"> 

              <div class="media-body" > 
               {{$message->message}} 
               <br/> 
               <bold> <small class="text-muted">{{$message->from_name}} |{{$message->created_at}} 
                </small></bold> 
               <hr> 
              </div> 
             </div> 
            </div> 
           </li> 


          @endforeach 
         </ul> 
         <div> 
          <div class="panel-footer"> 
           <div class="input-group"> 
            <input type="text" name="message" class="form-control" placeholder="Enter Message"/> 
            {{csrf_field()}} 
            <input type="hidden" name="from_name" value="{{Auth::user()->FullName}}"> 
            <span class="input-group-btn"> 
            <button type="submit" id="send" class="btn btn-info">Send</button> 
           </span> 
           </div> 
          </div> 
         </div> 
         <div class="col-md-2"> 

         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

    <script type="text/javascript" src="/assets/admin/plugins/jquery/jquery-1.9.1.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      setTimeout(realTime, 2000); 
     }); 
     function realTime() { 
      $.ajax({ 
       type:'post', 
       url:'/chat/get', 
       data:{ 
        '_token':$('input[name=_token]').val(), 
       }, 
       success: function (data) { 
        $('#message').replaceWith(' <ul class="media-list" id="message"></ul>'); 
        for (var i=0; i < data.length; i++){ 
         $('#message').append(' <li class="media"><div class="media-body"><div class="media"><div class="media-body">'+data[i].message+'<br/><small class="text-muted">'+data[i].from_name+'|'+ data[i].created_at+'</small><hr/></div></div></div></li>') 
        } 
       }, 
      }); 
      setTimeout(realTime, 2000); 
     } 
     $(document).on('click','#send', function(){ 
      $.ajax({ 
       type:'post', 
       url:'/chat/send', 
       data:{ 
        '_token':$('input[name=_token]').val(), 
        'from_name':$('input[name=from_name]').val(), 
        'message':$('input[name=message]').val(), 
       }, 
       success: function (data) { 
        $('#message').append(' <li class="media"><div class="media-body"><div class="media"><div class="media-body">'+data.message+'<br/><small class="text-muted">'+data.from_name+'|'+ data.created_at+'</small><hr/></div></div></div></li>'); 
       } 
      }) 

      $('input[name=message]').val(''); 
     }); 

    </script> 

@stop 

hier meine Routen:

Route::get('/chat', 'Chat\ChatController@index')->name('chat.index'); 
Route::post('/chat/send', 'Chat\ChatController@sendMessage')->name('admin.chat.sendMessage'); 
Route::post('/chat/get', 'Chat\ChatController@getMessage'); 

hier ist mein Controller:

public function __construct() 
    { 
     $this->middleware('auth'); 
    } 

    public function index() 
    { 
     $users=user::all(); 
     $messages=message::all(); 
     return view('admin.chat.index',['messages'=> $messages],compact('users')); 
    } 

    public function sendMessage(Request $request){ 

     $send = new Message(); 
     $send ->from_name = $request->from_name; 
     $send ->message = $request->message; 
     $send->save(); 
     return response()->json($send); 

    } 

    public function getMessage(){ 
     $message = Message::all(); 
     return response()->json($message); 

    } 

Leider in fortgeschrittenen für die schlechte Englisch, aber ich bin ein Ausländer

Answer 1

gut Sie dieses Tutorial zu lesen und umzusetzen, wie dies ....

https://laracasts.com/discuss/channels/general-discussion/step-by-step-guide-to-installing-socketio-and-broadcasting-events-with-laravel-51

Answer 2

$(window).load(realTime); 
    function realTime() { 
     $.ajax({ 
      type:'post', 
      url:'/chat/get', 
      data:{ 
       '_token':$('input[name=_token]').val(), 
      }, 
      success: function (data) { 
       $('#message').replaceWith(' <ul class="media-list" id="message"></ul>'); 
       for (var i=0; i < data.length; i++){ 
        $('#message').append(' <li class="media"><div class="media-body"><div class="media"><div class="media-body">'+data[i].message+'<br/><small class="text-muted">'+data[i].from_name+'|'+ data[i].created_at+'</small><hr/></div></div></div></li>') 
       } 
      setTimeout(realTime, 2000); 
      }, 
     }); 

    } 
} 

die Sie interessieren ..