Mixing
Pusher/Laravel echo error on subscribing to private channel: Auth value for subscription to channel is...
I am having trouble subscribing to a private channel with PusherJS which is in React application.
Backend is Laravel but I am pretty sure the backend/frontend technologies do not contribute to this problem.
I am using JWT tokens for authentication and everything seems to be working on that part. The whole application is running fine but I am trying to add a socket to the system.
I will provide my backend and frontend code snippets here as I am pretty sure the fault lies in of them.
Frontend
const Socket = new Echo({
broadcaster: 'pusher',
key: config.pusher.key,
cluster: config.pusher.cluster,
authEndpoint: config.pusher.authEndpoint,
forceTLS: config.pusher.tls,
auth: {
headers: {
Authorization: `Bearer ${token}`,
},
},
});
Socket.private('users.1').listen('newMessage', (data) => {
console.log(data);
})
Backend auth endpoint
public function authorize(Request $request) {
echo Pusher::socket_auth($request->get('channel_name'), $request->get('socket_id'));
return;
}
The auth endpoint works, the data is returned as follows:
{auth: ":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx"}
In console I can see that frontend application has successfully connected pusher
Pusher : State changed : connecting -> connected with new socket ID xxxxxx.xxxxxx
But the subscribing has failed
Pusher : Event sent : {"event":"pusher:subscribe","data":{"auth":":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx","channel":"private-users.1"}}
Pusher : Event recd : {"event":"pusher:error","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}
Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}}
I tried using only PusherJS package and had the same problem. Now I tried using Laravel Echo and the result is the same.
Also what's important is that when I subscribe to a non private channel, the subscribing works and I can successfully receive the messages through the channel.
Pusher debug log only tells me the same thing:
Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'
I have been debugging this for a few hours and I have no idea where to go from here.
php reactjs laravel pusher laravel-echo
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
add a comment |
I am having trouble subscribing to a private channel with PusherJS which is in React application.
Backend is Laravel but I am pretty sure the backend/frontend technologies do not contribute to this problem.
I am using JWT tokens for authentication and everything seems to be working on that part. The whole application is running fine but I am trying to add a socket to the system.
I will provide my backend and frontend code snippets here as I am pretty sure the fault lies in of them.
Frontend
const Socket = new Echo({
broadcaster: 'pusher',
key: config.pusher.key,
cluster: config.pusher.cluster,
authEndpoint: config.pusher.authEndpoint,
forceTLS: config.pusher.tls,
auth: {
headers: {
Authorization: `Bearer ${token}`,
},
},
});
Socket.private('users.1').listen('newMessage', (data) => {
console.log(data);
})
Backend auth endpoint
public function authorize(Request $request) {
echo Pusher::socket_auth($request->get('channel_name'), $request->get('socket_id'));
return;
}
The auth endpoint works, the data is returned as follows:
{auth: ":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx"}
In console I can see that frontend application has successfully connected pusher
Pusher : State changed : connecting -> connected with new socket ID xxxxxx.xxxxxx
But the subscribing has failed
Pusher : Event sent : {"event":"pusher:subscribe","data":{"auth":":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx","channel":"private-users.1"}}
Pusher : Event recd : {"event":"pusher:error","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}
Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}}
I tried using only PusherJS package and had the same problem. Now I tried using Laravel Echo and the result is the same.
Also what's important is that when I subscribe to a non private channel, the subscribing works and I can successfully receive the messages through the channel.
Pusher debug log only tells me the same thing:
Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'
I have been debugging this for a few hours and I have no idea where to go from here.
php reactjs laravel pusher laravel-echo
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
add a comment |
I am having trouble subscribing to a private channel with PusherJS which is in React application.
Backend is Laravel but I am pretty sure the backend/frontend technologies do not contribute to this problem.
I am using JWT tokens for authentication and everything seems to be working on that part. The whole application is running fine but I am trying to add a socket to the system.
I will provide my backend and frontend code snippets here as I am pretty sure the fault lies in of them.
Frontend
const Socket = new Echo({
broadcaster: 'pusher',
key: config.pusher.key,
cluster: config.pusher.cluster,
authEndpoint: config.pusher.authEndpoint,
forceTLS: config.pusher.tls,
auth: {
headers: {
Authorization: `Bearer ${token}`,
},
},
});
Socket.private('users.1').listen('newMessage', (data) => {
console.log(data);
})
Backend auth endpoint
public function authorize(Request $request) {
echo Pusher::socket_auth($request->get('channel_name'), $request->get('socket_id'));
return;
}
The auth endpoint works, the data is returned as follows:
{auth: ":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx"}
In console I can see that frontend application has successfully connected pusher
Pusher : State changed : connecting -> connected with new socket ID xxxxxx.xxxxxx
But the subscribing has failed
Pusher : Event sent : {"event":"pusher:subscribe","data":{"auth":":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx","channel":"private-users.1"}}
Pusher : Event recd : {"event":"pusher:error","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}
Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}}
I tried using only PusherJS package and had the same problem. Now I tried using Laravel Echo and the result is the same.
Also what's important is that when I subscribe to a non private channel, the subscribing works and I can successfully receive the messages through the channel.
Pusher debug log only tells me the same thing:
Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'
I have been debugging this for a few hours and I have no idea where to go from here.
php reactjs laravel pusher laravel-echo
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
I am having trouble subscribing to a private channel with PusherJS which is in React application.
Backend is Laravel but I am pretty sure the backend/frontend technologies do not contribute to this problem.
I am using JWT tokens for authentication and everything seems to be working on that part. The whole application is running fine but I am trying to add a socket to the system.
I will provide my backend and frontend code snippets here as I am pretty sure the fault lies in of them.
Frontend
const Socket = new Echo({
broadcaster: 'pusher',
key: config.pusher.key,
cluster: config.pusher.cluster,
authEndpoint: config.pusher.authEndpoint,
forceTLS: config.pusher.tls,
auth: {
headers: {
Authorization: `Bearer ${token}`,
},
},
});
Socket.private('users.1').listen('newMessage', (data) => {
console.log(data);
})
Backend auth endpoint
public function authorize(Request $request) {
echo Pusher::socket_auth($request->get('channel_name'), $request->get('socket_id'));
return;
}
The auth endpoint works, the data is returned as follows:
{auth: ":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx"}
In console I can see that frontend application has successfully connected pusher
Pusher : State changed : connecting -> connected with new socket ID xxxxxx.xxxxxx
But the subscribing has failed
Pusher : Event sent : {"event":"pusher:subscribe","data":{"auth":":2535a2ea3a1ee8f461ceef3a95095518c0205949aa981e6f2xxxxx","channel":"private-users.1"}}
Pusher : Event recd : {"event":"pusher:error","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}
Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":null,"message":"Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'"}}}
I tried using only PusherJS package and had the same problem. Now I tried using Laravel Echo and the result is the same.
Also what's important is that when I subscribe to a non private channel, the subscribing works and I can successfully receive the messages through the channel.
Pusher debug log only tells me the same thing:
Auth value for subscription to private-users.1 is invalid: should be of format 'key:signature'
I have been debugging this for a few hours and I have no idea where to go from here.
php reactjs laravel pusher laravel-echo
php reactjs laravel pusher laravel-echo
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
edited Jan 2 at 18:00
Mihkel Allorg
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
asked Jan 2 at 14:15
Mihkel AllorgMihkel Allorg
560319
560319
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Your auth endpoint does not appear to be responding correctly. Are your key, secret, and appID correctly configured server side? How about the Cluster? Is this correctly configured server and client side?
answered Jan 2 at 14:28
kn100kn100
1114
That might be true, but I believe I have done everything the way documentation tells me to: pusher.com/docs/…. But right I just saw that my first character of the auth string is ":". I'm looking into it. And what do you mean by Cluster
– Mihkel Allorg
Jan 2 at 14:34
When you create an app in Pusher, you get to decide what area of the world your app operates from. By default, it will automatically stick your app in the Pusher MT1 region which is in the US. If you go to your pusher dashboard and look for your app credentials, you should see which cluster your app is configured within. You must then specify this in the client and server.
– kn100
Jan 3 at 16:00
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54007914%2fpusher-laravel-echo-error-on-subscribing-to-private-channel-auth-value-for-subs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Your auth endpoint does not appear to be responding correctly. Are your key, secret, and appID correctly configured server side? How about the Cluster? Is this correctly configured server and client side?
answered Jan 2 at 14:28
kn100kn100
1114
That might be true, but I believe I have done everything the way documentation tells me to: pusher.com/docs/…. But right I just saw that my first character of the auth string is ":". I'm looking into it. And what do you mean by Cluster
– Mihkel Allorg
Jan 2 at 14:34
When you create an app in Pusher, you get to decide what area of the world your app operates from. By default, it will automatically stick your app in the Pusher MT1 region which is in the US. If you go to your pusher dashboard and look for your app credentials, you should see which cluster your app is configured within. You must then specify this in the client and server.
– kn100
Jan 3 at 16:00
add a comment |
Your auth endpoint does not appear to be responding correctly. Are your key, secret, and appID correctly configured server side? How about the Cluster? Is this correctly configured server and client side?
answered Jan 2 at 14:28
kn100kn100
1114
That might be true, but I believe I have done everything the way documentation tells me to: pusher.com/docs/…. But right I just saw that my first character of the auth string is ":". I'm looking into it. And what do you mean by Cluster
– Mihkel Allorg
Jan 2 at 14:34
When you create an app in Pusher, you get to decide what area of the world your app operates from. By default, it will automatically stick your app in the Pusher MT1 region which is in the US. If you go to your pusher dashboard and look for your app credentials, you should see which cluster your app is configured within. You must then specify this in the client and server.
– kn100
Jan 3 at 16:00
add a comment |
Your auth endpoint does not appear to be responding correctly. Are your key, secret, and appID correctly configured server side? How about the Cluster? Is this correctly configured server and client side?
answered Jan 2 at 14:28
kn100kn100
1114
Your auth endpoint does not appear to be responding correctly. Are your key, secret, and appID correctly configured server side? How about the Cluster? Is this correctly configured server and client side?
answered Jan 2 at 14:28
kn100kn100
1114
answered Jan 2 at 14:28
kn100kn100
1114
answered Jan 2 at 14:28
kn100kn100
1114
answered Jan 2 at 14:28
kn100kn100
1114
1114
That might be true, but I believe I have done everything the way documentation tells me to: pusher.com/docs/…. But right I just saw that my first character of the auth string is ":". I'm looking into it. And what do you mean by Cluster
– Mihkel Allorg
Jan 2 at 14:34
When you create an app in Pusher, you get to decide what area of the world your app operates from. By default, it will automatically stick your app in the Pusher MT1 region which is in the US. If you go to your pusher dashboard and look for your app credentials, you should see which cluster your app is configured within. You must then specify this in the client and server.
– kn100
Jan 3 at 16:00
add a comment |
That might be true, but I believe I have done everything the way documentation tells me to: pusher.com/docs/…. But right I just saw that my first character of the auth string is ":". I'm looking into it. And what do you mean by Cluster
– Mihkel Allorg
Jan 2 at 14:34
When you create an app in Pusher, you get to decide what area of the world your app operates from. By default, it will automatically stick your app in the Pusher MT1 region which is in the US. If you go to your pusher dashboard and look for your app credentials, you should see which cluster your app is configured within. You must then specify this in the client and server.
– kn100
Jan 3 at 16:00
That might be true, but I believe I have done everything the way documentation tells me to: pusher.com/docs/…. But right I just saw that my first character of the auth string is ":". I'm looking into it. And what do you mean by Cluster
– Mihkel Allorg
Jan 2 at 14:34
That might be true, but I believe I have done everything the way documentation tells me to: pusher.com/docs/…. But right I just saw that my first character of the auth string is ":". I'm looking into it. And what do you mean by Cluster
– Mihkel Allorg
Jan 2 at 14:34
When you create an app in Pusher, you get to decide what area of the world your app operates from. By default, it will automatically stick your app in the Pusher MT1 region which is in the US. If you go to your pusher dashboard and look for your app credentials, you should see which cluster your app is configured within. You must then specify this in the client and server.
– kn100
Jan 3 at 16:00
When you create an app in Pusher, you get to decide what area of the world your app operates from. By default, it will automatically stick your app in the Pusher MT1 region which is in the US. If you go to your pusher dashboard and look for your app credentials, you should see which cluster your app is configured within. You must then specify this in the client and server.
– kn100
Jan 3 at 16:00
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54007914%2fpusher-laravel-echo-error-on-subscribing-to-private-channel-auth-value-for-subs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
