Javascript 通过Wordpress用户或数据库验证Firebase/Firechat
我正在尝试使用我的Wordpress用户通过Firebase/Firechat自动进行身份验证 您可以在此处的文档中看到Firebase可以通过使用安全Json Web令牌使用自定义身份验证: 他们还参考了Firebase页面,该页面详细描述了如何生成和使用这些令牌: 因此,我试图实现以下目标:Javascript 通过Wordpress用户或数据库验证Firebase/Firechat,javascript,php,wordpress,firebase,Javascript,Php,Wordpress,Firebase,我正在尝试使用我的Wordpress用户通过Firebase/Firechat自动进行身份验证 您可以在此处的文档中看到Firebase可以通过使用安全Json Web令牌使用自定义身份验证: 他们还参考了Firebase页面,该页面详细描述了如何生成和使用这些令牌: 因此,我试图实现以下目标: 如果用户已登录,请让Firechat识别其用户登录,并将其聊天别名设置为 如果他们没有登录,他们仍然可以看到聊天,但是当他们去聊天时,它应该会提示他们注册或登录(如果您查看Firechat文档中使用
<!-- 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>
var firebaseTokenerator=require(“firebaseTokenerator”);
var tokenGenerator=新的FirebaseTokenGenerator(“firebase机密”);
var caToken=tokenGenerator.createToken({uid:$user\u login});
var chatRef=新火基(“https://yourfirebase.firebaseio.com/chat");
chatRef.authWithCustomToken(caToken,函数(authData){
if(authData){
var chat=newfirechatui(chatRef,document.getElementById('firechat-wrapper');
setUser(authData.uid,authData[authData.provider].displayName);
}
});
问题是它实际上根本没有生成令牌,因为没有调用“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"
如果不使用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>'
困难的部分是定制聊天,但使用firechat github repo的源代码,然后“咕噜”更改到WordPress聊天的新发行版,这又是另一回事:-)哇,先生,非常感谢您的回复。我担心没有人会回答。我需要一点时间来完全实现和完成所有的事情,但本地化更有意义。有一点让人困惑的是
wpip\u chat
位,这是wp\u localize\u脚本函数的结果还是JS固有的东西?很抱歉,我将更新本地化数据参数:-)哦,好的,现在这很有意义,太棒了!嘿,伙计,我只是想再次感谢你——整个事情进展得很顺利。现在多亏了你,我有了一个超快速、可扩展、免提的聊天解决方案。我以前使用过IRC+webchat,所以这是难以置信的好+祝你好运!听起来很棒!:-)
/* 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();
});
}
});
});