使用Wordpress用户或数据库

时间:2015-06-02 18:29:17

标签: javascript php wordpress firebase

我尝试使用我的Wordpress用户使用Firebase / Firechat自动进行身份验证。

通过使用安全的Json Web令牌,您可以在Firebase可以使用自定义身份验证的文档中看到: 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. 如果用户是该页面的作者,则将其设置为主持人。这并不是那么重要,因为我更关注的是让聊天工作先行并稍后再担心。

  4. 根据我的理解,这是Firechat中已有的所有功能,Firebase显然能够对任何服务器/系统进行身份验证,前提是它可以生成正确的凭据。我似乎无法正常工作,我必须阅读这些文档大约一百次。

    尽管如此,这是我得到的最远的:

    <!-- 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>
    

    问题在于它实际上根本没有生成令牌,因为&#34; FirebaseTokenGenerator&#34;没有被召唤(它没有被列入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。我对它的运作方式也非常困惑。我是否必须为每个用户生成新令牌?或者为服务器做一次,让我的登录系统处理身份验证?

    希望我没有留下任何东西,但如果您需要更多信息,请问!谢谢你的阅读。

1 个答案:

答案 0 :(得分:7)

<强>恭喜

Firebase和Firechat非常有趣!

将javascript放在脚本文件中,并使用令牌作为数据进行本地化。然后使用该令牌初始化聊天。

我正在使用composer将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

如果不使用composer,请将下载的源包含在项目内的固定位置并包含库。

实施示例

使用登录用户从后端初始化聊天的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聊天的新发行版: - )