如何在Firechat中創建聊天室？

我正在使用Firechat，我能夠成功啓動聊天窗口。我正在使用Firebase custom authentication，我可以登錄沒有任何問題。但是，我現在嘗試創建一個新的聊天室，然後輸入它。基於該Firechat documentation我做了以下內容：如何在Firechat中創建聊天室？

<!doctype html> 
<html> 
<head> 
<title>Test</title> 
<meta charset="UTF-8" /> 
<script src='https://cdn.firebase.com/js/client/2.0.2/firebase.js'></script> 
<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> 
</head> 
<body> 

    <script type='text/javascript'> 
    var fireBase = new Firebase("https://XXXXXXXXX.firebaseio.com/"); 

    function initChat(authData) { 
     var Firechat = new FirechatUI(fireBase, document.getElementById('firechat')); 
     Firechat.setUser(authData.uid, "Username"); 
     Firechat.createRoom("Test chat room", "public"); 
    } 

    fireBase.authWithCustomToken("UNIQUE_TOKEN", function(error, authData) { 
     if (error) { 
     console.log("Login Failed!", error); 
     } else { 
     console.log("Login successful", authData); 
     initChat(authData); 
     } 
    }); 
    </script> 
    <div id='firechat'> 
    </div> 

</body> 
</html>

在JavaScript控制檯中我可以看到，登錄成功：

Login successful Object { auth: Object, expires: XXXXXXXXX, token: "XXXXXXXX…", uid: "XXXXXX", provider: "custom" }

但createRoom功能未發現：

TypeError: Firechat.createRoom is not a function

任何想法在這裏出了什麼問題？

來源

2016-02-02 user

從文檔： Firechat.createRoom(roomName, roomType, callback(roomId))

創建一個新的空間給定名稱（字符串）和類型（字符串 - 公共或私營），並調用與上完成了房間ID回調。

看起來你沒有回調。

Firechat.prototype.createRoom = function(roomName, roomType, callback) { 
    var self = this, 
     newRoomRef = this._roomRef.push(); 

    var newRoom = { 
     id: newRoomRef.name(), 
     name: roomName, 
     type: roomType || 'public', 
     createdByUserId: this._userId, 
     createdAt: Firebase.ServerValue.TIMESTAMP 
    }; 

    if (roomType === 'private') { 
     newRoom.authorizedUsers = {}; 
     newRoom.authorizedUsers[this._userId] = true; 
    } 

    newRoomRef.set(newRoom, function(error) { 
     if (!error) { 
     self.enterRoom(newRoomRef.name()); 
     } 
     if (callback) { 
     callback(newRoomRef.name()); 
     } 
    }); 
    };

來源：https://firechat.firebaseapp.com/docs/firechat.html

來源

2016-02-02 18:28:46 ketchupisred

謝謝@ketchupisred！我嘗試過各種形式的集成回調函數，但沒有一個能夠工作。我要麼得到錯誤，回調沒有定義，或roomId沒有定義，或類似的錯誤。你有一個想法，確切的格式應該是什麼樣子？ – user

我將編輯我的答案。 – ketchupisred

謝謝@ketchupisred！但是，示例中的鏈接和代碼看起來已經過時（它們可以在當前文檔中未使用的Firechat.prototype中工作：https：//firechat.firebaseapp.com/docs/#api_methods）。無法讓它工作。我會繼續嘗試，但如果您有任何其他建議，請讓我知道。 – user

因此，原來有兩個班（是，正確的字）的Firechat使用JavaScript的插件：

var chat = new FirechatUI 
var chat = new Firechat

因爲他們看起來很相似，所以我沒有注意到其中的差異文檔中沒有任何地方能夠找到FirechatUI實例的詳細信息（即使在github readme上建議使用此代碼）。

因此，無論如何，事情是new FirechatUI加載聊天的實際用戶界面。 new Firechat加載允許您與聊天插件交談的API（但對於UI，不是）。這是一個重要的區別。發現here的文檔僅涉及API，因此如果您啓動new Firechat實例。然而，訣竅是讓UI啓動並運行，然後直接與它進行交互（如創建新房間或進入房間等）。我真的沒有發現如何做官方/推薦的方式。我能夠想出的唯一的東西就是黑客。這是醜陋的，但它的工作原理。下面的代碼包含創建新聊天室（使用Firechat）和在用戶界面中打開特定聊天室的功能（由於找不到與用戶界面直接交互的方式，該位被黑掉）。

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8" /> 
<title>Title</title> 

<!-- 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.1.0/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> 

<!-- This plugin here: https://gist.github.com/buu700/4200601 --> 
<script type="text/javascript" src="js/arrive.js"></script> 

<style type="text/css"> 
#firechat{width:400px} 
</style> 

</head> 

<body> 

<h1>Test</h1> 

    <script type='text/javascript'> 
    var fireBase = new Firebase("https://XXXXXX.firebaseio.com/"); 

    function roomChatSetup(authData) { 
     var chat = new Firechat(fireBase); 
     chat.setUser(authData.uid, "My User Name", function(user) { 
      console.log("Creating chatroom..."); 
      chat.createRoom("New Chatroom Name", "public", function(roomId) { 
      console.log("Created room "+roomId); 
      }); 
     $("#firechat").html("<div class='alert alert-success'>Your chatroom has been set up. Refresh to view</div>"); 
     }); 
    } 

    function initChat(authData) { 
     var chatUI = new FirechatUI(fireBase, document.getElementById('firechat')); 
     chatUI.setUser(authData.uid, "My User Name"); 
     console.log("Simulating clicks..."); 
     $("#firechat-tab-content div.tab-pane").waitUntilExists(function(){ 
      console.log("Close all other tabs by simulating clicking the X button"); 
      $("#firechat-tab-content div.tab-pane:not(#XXXXXXXXX) a.close").click(); // XXXXX should have the chatroom name of the one you want to open 
     }); 
     $("#firechat-btn-rooms").waitUntilExists(function(){ 
      $("#firechat-btn-rooms").click(); 
      console.log("Open submenu to load all possible rooms"); 
     }); 
     $("li[data-room-id='XXXXXXXXXXXXX']").waitUntilExists(function(){ 
      $("li[data-room-id='XXXXXXXXXX'] a").click(); 
      console.log("Simulating clicking on chatroom XXXXXXXXXXXXXX"); 
     }); 
    } 

    fireBase.authWithCustomToken("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", function(error, authData) { 
     if (error) { 
     console.log("Login Failed!", error); 
     } else { 
     console.log("Login successful", authData); 

      // Here you can use a programming language to decide. If you already have a 
      // chatroom, run initChat. If you don't, run createRoom. I haven't been 
      // able to run them both at the same time. 

      initChat(authData); 
      // or: 
      roomChatSetup(authData); 

     } 
    }); 
    </script> 

    <div id="firechat"></div> 

</body> 
</html>

來源

2016-02-03 15:02:54 user

FirechatUI對象與Firechat對象是分開的。 FirechatUI沒有與Firechat相同的方法。

爲了從FirechatUI獲得相關Firechat Object對象，你可以做到以下幾點：

let chatUI = new FirechatUI(chatRef, document.getElementById("firechat-wrapper")); 
let chat = chatUI._chat;

然後你可以做任何正常Firechat操作沒有任何問題。

chat.setUser(user.uid, firstName, function(user) { 
    chat.resumeSession(); 
});

請記住，在_chat元素是不是真的應該被使用（你可以從命名約定告訴），但由於FirechatUI不能正常顯示足夠的功能，這可能是做的最徹底的方法它。

來源

2017-12-20 16:23:49

如何在Firechat中創建聊天室？

回答

相關問題