thinkphp整合系列之融雲即時通訊在線聊天

隨着技術的發展;現代的網站;越來越趨於應用形式了;

不再是像以前那樣需要用戶刷新頁面;獲取數據了;

服務器端可以主動向用戶推送數據;更加及時性了;

比較突出的就是即時通訊在線聊天;

今個;我們要打造的就是類似於網頁版微信的功能;

示例項目:http://git.oschina.net/shuaibai123/thinkphp-bjyadmin

一:註冊融雲賬號

如果我們不是以即時通訊爲主營業務;那麼建議使用第三方的服務;這裏以融云爲例;

官網:http://www.rongcloud.cn/

註冊融雲;創建應用;獲得App Key和App Secret;

白俊遙博客

二:設置配置項

/Application/Common/Conf/config.php

    'RONG_IS_DEV'            => true,//是否是在開發中
    'RONG_DEV_APP_KEY'       => '8luwapkvu3xwl', //融雲開發環境下的key    僅供測試使用
    'RONG_DEV_APP_SECRET'    => '1Aw1D7F6Td25', //融雲開發環境下的SECRET  僅供測試使用
    'RONG_PRO_APP_KEY'       => '', //融雲生產環境下的key
    'RONG_PRO_APP_SECRET'    => '', //融雲生產環境下的SECRET

將key和sercet替換爲自己應用;

三:集成php部分sdk

引入融雲sdk:/ThinkPHP/Library/Org/Xb/RongCloud.class.php

公共函數:/Application/Common/Common/function.php

/**
 * 根據配置項獲取對應的key和secret
 * @return array key和secret
 */
function get_rong_key_secret(){
    // 判斷是需要開發環境還是生產環境的key
    if (C('RONG_IS_DEV')) {
        $key=C('RONG_DEV_APP_KEY');
        $secret=C('RONG_DEV_APP_SECRET');
    }else{
        $key=C('RONG_PRO_APP_KEY');
        $secret=C('RONG_PRO_APP_SECRET');
    }
    $data=array(
        'key'=>$key,
        'secret'=>$secret
        );
    return $data;
}

/**
 * 獲取融雲token
 * @param  integer $uid 用戶id
 * @return integer      token
 */
function get_rongcloud_token($uid){
    // 從數據庫中獲取token
    $token=D('OauthUser')->getToken($uid,1);
    // 如果有token就返回
    if ($token) {
        return $token;
    }
    // 獲取用戶暱稱和頭像
    $user_data=M('Users')->field('username,avatar')->getById($uid);
    // 用戶不存在
    if (empty($user_data)) {
        return false;
    }
    // 獲取頭像url格式
    $avatar=get_url($user_data['avatar']);
    // 獲取key和secret
    $key_secret=get_rong_key_secret();
    // 實例化融雲
    $rong_cloud=new \Org\Xb\RongCloud($key_secret['key'],$key_secret['secret']);
    // 獲取token
    $token_json=$rong_cloud->getToken($uid,$user_data['username'],$avatar);
    $token_array=json_decode($token_json,true);
    // 獲取token失敗
    if ($token_array['code']!=200) {
        return false;
    }
    $token=$token_array['token'];
    $data=array(
        'uid'=>$uid,
        'type'=>1,
        'nickname'=>$user_data['username'],
        'head_img'=>$avatar,
        'access_token'=>$token
        );
    // 插入數據庫
    $result=D('OauthUser')->addData($data);
    if ($result) {
        return $token;
    }else{
        return false;
    }
}

/**
 * 更新融雲頭像
 * @param  integer $uid 用戶id
 * @return boolear      操作是否成功
 */
function refresh_rongcloud_token($uid){
    // 獲取用戶暱稱和頭像
    $user_data=M('Users')->field('username,avatar')->getById($uid);
    // 用戶不存在
    if (empty($user_data)) {
        return false;
    }
    $avatar=get_url($user_data['avatar']);
    // 獲取key和secret
    $key_secret=get_rong_key_secret();
    // 實例化融雲
    $rong_cloud=new \Org\Xb\RongCloud($key_secret['key'],$key_secret['secret']);
    // 更新融雲用戶頭像
    $result_json=$rong_cloud->userRefresh($uid,$user_data['username'],$avatar);
    $result_array=json_decode($result_json,true);
    if ($result_array['code']==200) {
        return true;
    }else{
        return false;
    }
}

寫一個控制器用來獲取token、好友列表的頭像和用戶名:/Application/Api/Controller/RongController.class.php

    /**
     * 獲取token
     */
    public function get_token(){
        // 獲取用戶id
        $uid=get_uid();
        // 獲取token
        $token=get_rongcloud_token($uid);
        $data=array(
            'token'=>$token
            );
        ajax_return($data,'獲取成功',0);
    }
    
    /**
     * 傳遞一個、或者多個用戶id
     * 獲取用戶頭像用戶名;用來組合成好友列表
     */
    public function get_user_info(){
        $uids=I('post.uids');
        // 組合where數組條件
        $map=array(
            'id'=>array('in',$uids)
            );
        $data=M('Users')
            ->field('id,username,avatar')
            ->where($map)
            ->select();
        ajax_return($data,'獲取用戶數據成功',0);
    }

四:集成前端部分

html要引入融雲js的sdk;

<script src="http://cdn.ronghub.com/RongIMLib-2.0.6.beta.min.js"></script>
<script src="http://cdn.ronghub.com/RongEmoji-2.0.2.beta.min.js"></script>

然後下面是我痛苦的研究了融雲的sdk後簡化了的使用方法;

/Public/statics/rongcloud/js/main.js

然後配置html即可;

/tpl/Home/Index/user1.html

/tpl/Home/Index/user2.html

最終的效果是這樣的:

白俊遙博客

當然;樣式可以自己改;

測試項目示例的時候;切記使用兩個不同的瀏覽器分別打開代表兩個用戶的鏈接;

用來模擬是兩個用戶在聊天;

本文爲白俊遙原創文章,轉載無需和我聯繫,但請註明來自白俊遙博客http://baijunyao.com                        


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章