溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

Laravel admin實現(xiàn)消息提醒、播放音頻功能

發(fā)布時間:2020-09-06 18:45:54 來源:腳本之家 閱讀:228 作者:Wen1109 欄目:web開發(fā)

應(yīng)用情景,有新的訂單生成,后臺進行消息提醒并播放音頻(這里用到輪詢簡單實現(xiàn)):下面附代碼

1.找到laravel-admin 中的 index.blade.php 文件進行編輯

{{-- 音頻通知 --}}
<audio  id="bg-music" preload="auto" src="http://fjdx.sc.chinaz.com/Files/DownLoad/sound1/201511/6571.mp3" loop="loop"></audio>
<script>
  function LA() {}
  LA.token = "{{ csrf_token() }}";
  var getting = {
    url:'/admin/sendNotice',
    dataType:'json',
    success: function (res) {
      console.log(res);
      if(res.code == 200){
          
        toastr.options.onclick = function(){
          location.href='/admin/order'; // 點擊跳轉(zhuǎn)頁面
        };
          toastr.options.timeOut=120000; // 保存2分鐘
          toastr.warning(res.msg); // 提示文字
        var audio = document.getElementById('bg-music'); // 啟用音頻通知
        audio.play();
        setTimeout(function(){
          audio.load(); // 1.5秒后關(guān)閉音頻通知
        },1500);
      }
    },
    error: function (res) {
      console.log(res);
    }
  };
  //關(guān)鍵在這里,Ajax定時訪問服務(wù)端,不斷獲取數(shù)據(jù) ,這里是5秒請求一次。
  window.setInterval(function(){$.ajax(getting)},5000);
</script>

2.請求路由控制器

  /**
   * 輪詢判斷有沒有新訂單
   *
   * @return void
   */
  public function sendNotice()
  {
     // 處理邏輯
     $count = 0;  // 獲取的結(jié)果
    $getCount = session()->get('count');
    if ($count > $getCount) {
      session()->put('count', $count); // 存session
      return ['code' => 200, 'msg' => '您有新的訂單請及時處理'];
    }
     // 不成立的話則存最新的值
    session()->put('count', $count);
    return ['code' => 201];
  }

實現(xiàn)效果:

Laravel admin實現(xiàn)消息提醒、播放音頻功能

注意:

    使用Google 瀏覽器如果無法播放提示音?

  1、進入  chrome://flags/#autoplay-policy

Laravel admin實現(xiàn)消息提醒、播放音頻功能

  2、找到 Autoplay policy

Laravel admin實現(xiàn)消息提醒、播放音頻功能

  3、修改Default

總結(jié)

以上所述是小編給大家介紹的Laravel-admin 消息提醒、播放音頻功能的實現(xiàn)代碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對億速云網(wǎng)站的支持!
如果你覺得本文對你有幫助,歡迎轉(zhuǎn)載,煩請注明出處,謝謝!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI