I'm getting error 'Uncaught ReferenceError: Pusher is not defined' in console while creating WEB NOTIFICATIONS USING LARAVEL AND PUSHER CHANNELS

Question

我正在尝试使用 https://pusher.com 发送网络通知我已经实现了 pusher 文档中给出的所有内容，但现在我仍然收到类似 "Uncaught ReferenceError: Pusher is not defined" in console

的错误

请检查我的代码是否有任何问题我在 App\Events 中创建了 FormSubmitted 事件看起来像

<?php

namespace App\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;

class FormSubmitted implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;
    public $text;

    /**
     * Create a new event instance.
     *
     * @return void
     */
    public function __construct($text)
    {
        //
        $this->text = $text;
    }

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

    public function broadcastAs()
    {
        return 'form-submitted';
    }
}

============================================= ============================

我在资源文件夹中创建了 counter.blade.php 它看起来像

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Pusher Test</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script
  <script src="https://js.pusher.com/4.4/pusher.min.js"></script>
  <script>

    // Enable pusher logging - don't include this in production
    Pusher.logToConsole = true;

    var pusher = new Pusher('MY_KEY_PLACED_HERE', {
      cluster: 'ap2',
      forceTLS: true
    });

    var channel = pusher.subscribe('my-channel');
    channel.bind('form-submitted', function(data) {
      alert(JSON.stringify(data));
    });
  </script>
</head>
<body>
  <h1>Pusher Test</h1>
  <p>
    Try publishing an event to channel <code>my-channel</code>
    with event name <code>my-event</code>.
  </p>
</body>
</html>

============================================= =====================

然后我在资源

中创建 sender.blade.php

<form action="sender" method="post">
    {{csrf_field()}}
    <input type="text" name="text">
    <input type="submit" value="submit">
</form>

============================================= ========== 我已经在 .env 文件中设置了所有凭据（这里我已经设置了正确的密钥和秘密）

BROADCAST_DRIVER=pusher
PUSHER_APP_ID=XXXX
PUSHER_APP_KEY=XXXXX
PUSHER_APP_SECRET=XXXX
PUSHER_APP_CLUSTER=AP2

============================================= ==========

and finally `web.php` looks like 


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

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

Route::post('/sender', function () {

    $text = request()->text;

    event(new FormSubmitted($text));
});

============================================= ============== 当我运行 localhost/counter 在浏览器中

我在控制台中收到 "Uncaught ReferenceError: Pusher is not defined" 这个错误

我希望当我发送 localhost/sender 一些来自文本的输入时的输出然后这个文本数据应该作为通知弹出

Answer 1

您的 header script 标签中有错字。您没有正确结束 jQuery </script 标签。将其更改为 </script>.

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

I'm getting error 'Uncaught ReferenceError: Pusher is not defined' in console while creating WEB NOTIFICATIONS USING LARAVEL AND PUSHER CHANNELS

I'm getting error 'Uncaught ReferenceError: Pusher is not defined' in console while creating WEB NOTIFICATIONS USING LARAVEL AND PUSHER CHANNELS

php

laravel

pusher