programing

Wordpress 사용자 또는 데이터베이스로 Firebase/Firechat 인증

lovejava 2023. 3. 15. 17:44

Wordpress 사용자 또는 데이터베이스로 Firebase/Firechat 인증

Wordpress 사용자를 사용하여 Firebase/Firechat에서 자동으로 인증하려고 합니다.

Firebase가 안전한 Json Web Tokens를 사용하여 커스텀 인증을 사용할 수 있다는 내용은 다음 문서를 참조하십시오.https://firechat.firebaseapp.com/docs/

또, 이러한 토큰의 작성과 사용에 대해 자세히 설명하고 있는 Firebase 페이지도 참조해 주세요.https://www.firebase.com/docs/web/guide/login/custom.html?utm_source=docs&utm_medium=site&utm_campaign=firechat

그래서 제가 달성하려고 하는 것은 다음과 같습니다.

  1. 사용자가 로그인한 경우 Firechat이 사용자 로그인을 인식하고 채팅에일리어스를 설정합니다.

  2. 로그인하지 않은 경우에도 채팅을 볼 수 있지만 대화를 하러 가면 등록 또는 로그인을 요구하는 프롬프트가 나타납니다(Twitter를 사용하여 로그인하는 Firechat 문서의 주요 예를 보면 이를 사용하여 채팅을 볼 수 있습니다).또, 홈 페이지의 Firechat 의 예에서도 같은 일이 일어나고 있습니다).

  3. 사용자가 페이지 작성자인 경우 사용자를 주최자로 설정합니다.이것은 그다지 중요하지 않습니다.먼저 채팅이 잘 되고 나중에 걱정되는 것에 초점을 맞추고 싶기 때문입니다.

이 모든 기능은 이미 Firechat에 있는 것으로 알고 있습니다.Firebase는 적절한 credential을 생성할 수 있다면 어떤 서버/시스템에서도 인증할 수 있습니다.아무 것도 작동이 안 되는 것 같고 그 문서를 백 번 정도 읽었을 거예요.

이 모든 것을 말했지만, 내가 얻은 가장 큰 성과는 다음과 같다.

<!-- jQuery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!-- Firebase -->
<script src="https://cdn.firebase.com/js/client/2.0.2/firebase.js"></script>

<!-- Firechat -->
<link rel="stylesheet" href="https://cdn.firebase.com/libs/firechat/2.0.1/firechat.min.css" />
<script src="https://cdn.firebase.com/libs/firechat/2.0.1/firechat.min.js"></script>

<?php 
include('./wp-blog-header.php');
include( './wp-load.php' );

//wordpress global variables
global $user_login;
global $post;
global $wpdb;
global $user_login;
global $current_user; 
?>    
    <div id="firechat-wrapper"></div>

    <script type="text/javascript">
var FirebaseTokenGenerator = require("firebase-token-generator");
var tokenGenerator = new FirebaseTokenGenerator("firebase-secret");
var caToken = tokenGenerator.createToken({ uid: $user_login });

var chatRef = new Firebase("https://yourfirebase.firebaseio.com/chat");
chatRef.authWithCustomToken(caToken, function(authData) {
    if (authData) {
        var chat = new FirechatUI(chatRef, document.getElementById('firechat-wrapper'));
        chat.setUser(authData.uid, authData[authData.provider].displayName);
    }
});
    </script>

문제는 실제로 토큰을 전혀 생성하지 않는다는 것입니다. "Firebase(파이어베이스)"Token Generator"가 켜지지 않았습니다(CDN afaik에는 포함되어 있지 않습니다).Javascript로 호출하는 방법은 잘 모르겠지만, 그것을 하는 PHP 도우미 라이브러리가 있다는 것은 알고 있습니다.

심플한 것은, 다음과 같습니다.

<?php
  include_once "FirebaseToken.php";
  $tokenGen = new Services_FirebaseTokenGenerator("<YOUR_FIREBASE_SECRET>");
  $token = $tokenGen->createToken(array("uid" => "custom:1"));
?>

하지만 문제는 어떻게 PHP에서 Javascript로 정보를 전달해야 할지 모르겠다는 것입니다.나도 이 모든 것이 어떻게 돌아가는지 꽤 혼란스럽다.각 사용자에 대해 새로운 토큰을 생성해야 합니까?아니면 서버에 대해 한 번 실행하고 로그인 시스템이 인증을 처리하도록 할 수 있습니까?

제가 빠뜨린 게 없기를 바라지만, 더 필요한 정보가 있으면 그냥 물어보세요!읽어주셔서 감사합니다.

축하합니다!

파이어베이스와 파이어챗은 정말 재미있어요!

Javascript를 스크립트 파일에 배치하고 토큰을 데이터로 현지화 합니다.그런 다음 해당 토큰으로 채팅을 초기화합니다.

백엔드에 php 파일을 배치하기 위해 작곡가를 사용하고 있습니다.php-jwt와 token-generator가 모두 필요합니다.Packagist 브라우저를 보세요!

"firebase/php-jwt": "^2.1",
"firebase/token-generator": "^2.0"

https://packagist.org/packages/firebase/php-jwt

https://packagist.org/packages/firebase/token-generator

컴포저를 사용하지 않는 경우 다운로드한 소스를 프로젝트 내의 고정된 위치에 포함시키고 라이브러리를 포함합니다.

구현 예시

로그인 사용자와의 백엔드에서 채팅을 초기화하기 위한 PHP 파일:

/* firechat-example.php */
$userdata = get_userdata( get_current_user_id() );
$tokenGen = new \Services_FirebaseTokenGenerator( "#your-token-from-firebase#" );
$token    = $tokenGen->createToken( array( "uid" => 'custom:'.$userdata->ID ), array( "admin" => true ) );
wp_enqueue_script( 'your-chat-js', get_stylesheet_directory_uri() . '/firechat-example.js', [ 'jquery' ], null, true );

$data = [
            'token' => $token,
            'user_id'   => $userdata->ID,
            'user_name' => $userdata->display_name,
        ];

wp_localize_script( 'your-chat-js', 'firechat_backend', $data );
echo '<div class="firechat-wrapper"></div>'

따라서 WordPress에 의해 현지화된 js 파일은 다음과 같습니다(예: 테마 또는 플러그인:

/* firechat-example.js */
jQuery( document ).ready(function($) {
    var firechatRef = new Firebase('https://your-firebase-app-name.firebaseio.com/chat');
    firechatRef.authWithCustomToken( firechat_backend.token, function(error, authData) {
    if (error) {
        console.log(error);
    }
    else {
        var chat = new FirechatUI(firechatRef, document.getElementById('firechat-wrapper'));
        chat.setUser( firechat_backend.user_id, firechat_backend.user_name, function(user) {
                chat.resumeSession();
            });
        }
    });
});

어려운 부분은 채팅을 커스터마이즈하는 것이지만 firechat github repo의 소스 코드를 사용하여 WordPress-chat :-)의 새로운 배포에 변경을 가하는 것입니다.

언급URL : https://stackoverflow.com/questions/30603810/authenticate-firebase-firechat-with-wordpress-user-or-database