使用 Wordpress 用户或数据库验证 Firebase/Firechat
Authenticate Firebase/Firechat with Wordpress user or database
我正在尝试使用我的 Wordpress 用户通过 Firebase/Firechat 自动进行身份验证。
您可以在文档中看到 Firebase 可以通过使用安全的 Json Web 令牌使用自定义身份验证:
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
所以我想要完成的是这些事情:
如果用户已登录,让 Firechat 识别他们的用户登录名并将他们的聊天别名设置为那个。
如果他们没有登录,他们仍然可以看到聊天,但是当他们开始聊天时,应该会提示他们注册或登录(如果你看一下Firechat documentation using Twitter to login, you can see it using this. 他们主页上的Firechat example也是这样做的)。
如果用户是页面的作者,则将他们设置为版主。这并不重要,因为我宁愿先专注于让聊天正常工作,然后再担心它。
据我了解,这是 Firechat 中已有的所有功能,并且 Firebase 显然能够使用任何 server/system 进行身份验证,前提是它可以生成正确的凭据。我似乎什么都做不了,我一定已经阅读了该文档大约一百遍了。
综上所述,这是我到达的最远距离:
<!-- 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>
问题是它实际上根本没有生成令牌,因为 "FirebaseTokenGenerator" 没有被调用(它不包含在 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。我也对它的工作原理感到很困惑。我是否必须为每个用户生成一个新令牌?或者为服务器做一次,让我的登录系统处理身份验证?
希望我没有遗漏任何内容,但如果您需要更多信息,请尽管询问!感谢阅读。
恭喜!
Firebase 和 Firechat 真是太有趣了!
将 javascript 放在脚本文件中,并使用令牌作为数据对其进行本地化。然后使用该令牌初始化聊天。
我正在使用 composer 将 php 文件放入后端。你需要 php-jwt 和令牌生成器。看看 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 存储库中的源代码然后 "grunting" 更改为您的 WordPress 聊天的新发行版是另一回事了:-)
我正在尝试使用我的 Wordpress 用户通过 Firebase/Firechat 自动进行身份验证。
您可以在文档中看到 Firebase 可以通过使用安全的 Json Web 令牌使用自定义身份验证: 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
所以我想要完成的是这些事情:
如果用户已登录,让 Firechat 识别他们的用户登录名并将他们的聊天别名设置为那个。
如果他们没有登录,他们仍然可以看到聊天,但是当他们开始聊天时,应该会提示他们注册或登录(如果你看一下Firechat documentation using Twitter to login, you can see it using this. 他们主页上的Firechat example也是这样做的)。
如果用户是页面的作者,则将他们设置为版主。这并不重要,因为我宁愿先专注于让聊天正常工作,然后再担心它。
据我了解,这是 Firechat 中已有的所有功能,并且 Firebase 显然能够使用任何 server/system 进行身份验证,前提是它可以生成正确的凭据。我似乎什么都做不了,我一定已经阅读了该文档大约一百遍了。
综上所述,这是我到达的最远距离:
<!-- 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>
问题是它实际上根本没有生成令牌,因为 "FirebaseTokenGenerator" 没有被调用(它不包含在 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。我也对它的工作原理感到很困惑。我是否必须为每个用户生成一个新令牌?或者为服务器做一次,让我的登录系统处理身份验证?
希望我没有遗漏任何内容,但如果您需要更多信息,请尽管询问!感谢阅读。
恭喜!
Firebase 和 Firechat 真是太有趣了!
将 javascript 放在脚本文件中,并使用令牌作为数据对其进行本地化。然后使用该令牌初始化聊天。
我正在使用 composer 将 php 文件放入后端。你需要 php-jwt 和令牌生成器。看看 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 存储库中的源代码然后 "grunting" 更改为您的 WordPress 聊天的新发行版是另一回事了:-)