Aron
Aron

Reputation: 139

Pusher auth endpoint responded with html, how to fix this?

I am currently using laravel 5.8 and pusher 3.0.3 and I am new to these new tech. I have created a simple chatroom but failed to listen to presence channel using pusher. I previously tried Echo but I can't find a way to debug it.

Here is pusher:subscription_error from the console:

Pusher: JSON returned from webapp was invalid, yet status code was 200. Data was: <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

I have already added this line to my BroadcastServiceProvider.php

Broadcast::routes(['middleware' => ['auth:api']]);
require base_path('routes/channels.php');

I have already receive events from pusher debugger with public channel so I think I have set my credentials correctly.

This is the buttom part of my bootstrap.js.

const CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');

var pusher = new Pusher('61540f91921896045e25', {
    cluster: "ap1",
    forceTLS: true,
    //authEndpoint: 'authchatuser'
    authEndpoint: '/broadcasting/auth',
    auth: {
      headers: {
        'X-CSRF-Token': CSRF_TOKEN
      }
    }
});

var channel = pusher.subscribe('presence-chatroom');

//var channel = pusher.subscribe('chatroom');
channel.bind('MessagePosted', function(data) {
   console.loga(data);
});

channel.bind('pusher:subscription_error', function(data) {
   console.log("Pusher: " + data);
});

From the network tab, I couldn't see request to my pusher authEndpoint broadcasting/auth, but instead I see GET request to my homepage which responded with 200 which I think is the reason why I receive html instead of json.

Please help me with this or do you have idea to bypass the endpoint and send json data for authentication (correct data expected by pusher) instead from my web.php? Thank you.

Upvotes: 1

Views: 4122

Answers (1)

doydoy
doydoy

Reputation: 4091

You should not need to bypass the endpoint, but instead you should amend your endpoint to return the correct data. Your authentication endpoint should return a JSON body along with a HTTP code. The documentation states:

Successful responses from an authentication endpoint should carry a 200 OK HTTP status and a body of the form
{ "auth": $AUTHORIZATION_STRING }

This aligns with the error you are receiving which indicates that JSON is expected but HTML is received.

Upvotes: 1

Related Questions