Laravel 使用推送广播在用户守卫之间发送通知消息

问题描述 投票:0回答:1

我有一个管理员和多个用户的应用程序,用户和管理员、用户和用户之间有一个聊天部分,我想向使用推送驱动程序(本地主机)接收聊天的用户页面发送通知消息。 在控制器文件中

    public function userChat(Request $request)
    {
        if (Auth::guard('admin')->check()) {
            $user = Auth::guard('admin')->user()->name;
        }
        if (Auth::guard('web')->check()) {
            $user = Auth::user()->name;
            $userName = Auth::user()->name;
        }

        $user_id = $request->get('user_id');
        $purpose = $request->get('purpose');

        $owner = '';
        if ($user == $user_id)
            $owner = 'me';
        $owner = 'you';

        // dd($adminName);
        if ($purpose == 'find-user') {
            $msg = Chat::where('from', $user)->where('to', $user_id)
                ->orWhere('from', $user_id)->Where('to', $user)
                ->get();
            // dd($msg);
            return response()->json($msg);
        } elseif ($purpose == 'admin-user') {
            $val = $request->get('val');
            $chat = Chat::create([
                'message' => $val,
                'from' => $user,
                'to' => $user_id
            ]);
            // Get Receiver MSG ID
            $idReceiver = User::where('name', '=', $user_id)->pluck('id')->first();

            $data =[
                'sender' => $user,
                'receiver' => $idReceiver,
            ];
            event(new ChatNotify($data));
            return response()->json(['user' => $user, 'idReceiver' => $idReceiver, 'msg' => $val]);
        }
    }

在应用\布局文件中

<script src="https://js.pusher.com/8.2.0/pusher.min.js"></script>
<script>
    Pusher.logToConsole = true;
    var pusher = new Pusher('59ef8c5b08ddb96760db', {
    cluster: 'mt1',
    encrypted: false
    });
</script>
<script src="{{ asset('/js/pusherNotifications.js')}}"></script>

在 PusherNotifications.js 文件中

var notificationsWrapper = $('footer#footer_layouts');

// Subscribe to the channel we specified in our Laravel Event
var channel = pusher.subscribe('chat-notify');
// Bind a function to a Event (the full Laravel class)
channel.bind('App\\Events\\ChatNotify', function (data) {
    alert('hi');
    var newNotificationHTML = `<div id="IdChatMSG" style="position:fixed; right:0px; bottom:0px; z-index:999; display:block; width:300px; height:100px; background-color:black; color:red;">
    New Message From ` + data.sender + `
    </div>`;
    notificationsWrapper.append(newNotificationHTML);
});

在 ChatNotify 事件文件中

    public $sender;
    public $receiver;
    public function __construct($data)
    {
        $this->sender = $data['sender'];
        $this->receiver = $data['receiver'];
    }

    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        return ['chat-notify'];
    }

在 .env 文件中

BROADCAST_DRIVER=pusher


PUSHER_APP_ID=1344521
PUSHER_APP_KEY=59ef8c5b08ddb96760db
PUSHER_APP_SECRET=31aa84c3731b9444c63b
PUSHER_APP_CLUSTER=mt1

在配置 pp 文件中

App\Providers\BroadcastServiceProvider::class,

在配置路播文件中

        'pusher' => [
            'driver' => 'pusher',
            'key' => env('PUSHER_APP_KEY'),
            'secret' => env('PUSHER_APP_SECRET'),
            'app_id' => env('PUSHER_APP_ID'),
            'options' => [
                'cluster' => env('PUSHER_APP_CLUSTER'),
                //'useTLS' => true,
            ],
        ],

请问有人可以帮助我吗

jquery laravel
1个回答
1
投票

您当前的 jquery 代码使用

input[type=checkbox]
作为选择器,因此每当调用任何表单提交事件时,它也会检查表单中不存在的所有其他复选框。避免这种情况的一种方法是使用
forms
id 或 id或 div,其中所有复选框都位于特定选项卡作为带有复选框的选择器,即:
$('#container_template_Drinks input[type=checkbox]')..

演示代码

$('form#validFormCoffeeDrinks').on('submit', function(event) {
  var category_id = $('#category_salesCoffeeDrinks').val();
  if (category_id == 0) {
    alert("Choose a Category First.");
    return false;
  }
  //check inside container..div checkboxes
  if (!$('#container_template_Drinks input[type=checkbox]').is(":checked")) {
    alert("Choose a Product First.");
    return false;
  } else {
    var out = true;
    //loop only under container divs
    $('#container_template_Drinks input[type=checkbox]').each(function() {
      if ($(this).is(":checked")) {
        console.log($(this).val())
        //your other codes
      }
    });
    if (out == false)
      return false;
  }
});

$('form#validFormCoffee').on('submit', function(event) {
  //loop only under container divs
  if (!$('#container_template_BarcodeProducts input[type=checkbox]').is(":checked")) {
    alert("Choose a Product First.");
    return false;
  } else {
    var out = true;
    //loop only under container divs
    $('#container_template_BarcodeProducts input[type=checkbox]').each(function() {
      if ($(this).is(":checked")) {
        console.log($(this).val());
        //your othere code
      }
    });
    if (out == false)
      return false;
  }
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<ul class="nav nav-tabs">
  <li class="active"><a data-toggle="tab" href="#Drinks">Drinks</a></li>
  <li><a data-toggle="tab" href="#BarcodeProducts">BarcodeProducts</a></li>

</ul>
<div class="tab-content">
  <div id="Drinks" class="container tab-pane active"><br>
    <div class="col-md-12 pl-0">
      <form method="POST" id="validFormCoffeeDrinks" action="{{ route('salesAddDrinks.product') }}">

        <div class="form-group">
          <div class="form-row">
            <div class="col-md-10" role="alert">
              <select name="category_salesCoffeeDrinks" id="category_salesCoffeeDrinks" class="form-control">
                <option value="0">0</option>
                <option value="1">1</option>
                <option value="2">2</option>
              </select>
            </div>
          </div>
        </div>
        <div class="form-group">
          <div class="form-row">
            <div id="container_template_Drinks" class="col-md-10">

              <input type="checkbox" name="product_item_list[]" id="product_item_list[]" value="1">
              <input type="checkbox" name="product_item_list[]" id="product_item_list[]" value="2">
              <input type="checkbox" name="product_item_list[]" id="product_item_list[]" value="3" disabled>
            </div>
          </div>
        </div>
        <div class="form-row">
          <div class="col-md-6 text-left">
            <button type="submit" name="drinks_submit" class="btn btn-dark btn-sm mt-2">Submit</button>
          </div>
        </div>
      </form>
    </div>
  </div>
  <div id="BarcodeProducts" class="container tab-pane fade"><br>
    <div class="col-md-12 pl-0">
      <form method="POST" id="validFormCoffee" action="{{ route('salesAdd.product') }}">

        <div class="form-group">
          <div class="form-row">
            <div class="col-md-10">
              <select name="category_salesCoffee" id="category_salesCoffee" class="form-control">
                <option value="0">0</option>
                <option value="1">1</option>
                <option value="2">2</option>
              </select>
            </div>
          </div>
        </div>
        <div class="form-group">
          <div class="form-row">
            <div id="container_template_BarcodeProducts" class="col-md-10">

              <input type="checkbox" name="product_item_list[]" id="product_item_list[]" value="4">
              <input type="checkbox" name="product_item_list[]" id="product_item_list[]" value="5">
              <input type="checkbox" name="product_item_list[]" id="product_item_list[]" value="6">
            </div>
          </div>
        </div>
        <div class="form-row">
          <div class="col-md-6 text-left">
            <button type="submit" name="BarcodeProducts_submit" class="btn btn-dark btn-sm ">submit</button>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>

© www.soinside.com 2019 - 2024. All rights reserved.