使用 React Native 和 Laravel 后端驗證 Pusher

Question

我正在嘗試使用以下 React Native 腳本對私人廣播進行身份驗證。

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import Pusher from 'pusher-js/react-native';

export default class App extends React.Component {
  componentWillMount() {
    Pusher.logToConsole = true;
    var pusher = new Pusher('*********', {
      authEndpoint: 'http://app.pgm/api/authtest',
      cluster: 'eu',
      encrypted: true
    });

    const channel = pusher.subscribe('private-chat-1');

  }

上面的內容被發布到下面的函數，當從 Postman 測試時，下面的函數返回一個授權令牌。 但是，當我通過 React Native 運行應用程序時，我得到以下響應。

  public function pusher(Request $request){
        $pusher = new Pusher(config('broadcasting.connections.pusher.key'), config('broadcasting.connections.pusher.secret'), config('broadcasting.connections.pusher.app_id'));

        echo $pusher->socket_auth($request->channel_name, $request->socket_id);
  }

[exp] Pusher：無法檢索身份驗證信息。 0客戶端必須經過身份驗證才能加入私人或在線頻道。 請參閱： https ://pusher.com/docs/authenticating_users [exp] Pusher：pusher:subscription_error 在 private-chat-1 上沒有回調

這讓我認為 Laravel 沒有收到發布數據。 我目前沒有任何可以阻止請求的中間件。

誰能看到我哪里出錯了？

Answer 1

它在我這邊在Postman和React Native端都運行良好。 我使用了以下代碼。 在我的例子中，我沒有使用 key encrypted: true 。

我正在成功收聽事件。

代碼

    // Pusher Logging
    Pusher.logToConsole = true;
    
    // Initialization & Configuration
    const pusher = new Pusher('****************', {
      cluster: '***',
      authEndpoint:
        'http://domain/products/chat/public/api/authtest',
    });

    // Making Connection
    pusher.connection.bind('connected', function (data) {
      console.log(data.socket_id);
    });

    // Subscribe Channel
    var channel = pusher.subscribe('private-channel-name', (data) => {
      console.log('Subscribe Channel');
      console.log(data);
    });

    // Accessing Channel
    const channelInfo = pusher.channel('private-chatify');
    console.log('channel Info');
    console.log(channelInfo);

    // Listen Event
    channel.bind('yourevent', function (data) {
      console.log('An event was triggered with message');
      console.log(data);
      console.log(data.message);
    });

希望它可以幫助你。