最近這段時間折騰了一下WebRTC，這兩天終於是抽了時間把WebRTC搞定了，去年就想弄的，但是確實沒時間。看了網上的https://apprtc.appspot.com/的例子（可能需要翻牆訪問），這個例子是部署在Google App Engine上的應用程式，依賴與GAE的環境，後臺的語言是python，而且還依賴Google App Engine Channel API，所以無法在本地執行，也無法擴充套件。費了一番功夫研讀了例子的python端的原始碼，決定用Java實現，Tomcat7之後開始支援WebSocket，打算用WebSocket代替Google App Engine Channel API實現前後臺的通訊，在整個例子中Java+WebSocket起到的作用是負責客戶端之間的通訊，並不負責視訊的傳輸，視訊的傳輸依賴於WebRTC。

首先WebRTC,這個可以百度一下，大概就是一個音訊和視訊通訊技術，可以跨平臺，只要能用瀏覽器的基本都可以使用，當然要你的瀏覽器支援。

這裡引用了google的js庫：channel.js。不過還是下載下來放到本地伺服器吧，因為很多地方訪問google.com很吃力啊。最開始就是這個js沒有載入完鬱悶了很久，還一直以為是程式碼寫錯了。

另外在進入頁面的時候，注意初始化頁面js中的一個引數：initiator：如果是建立人這個引數設為false；如果是加入的時候這個設定為true。為true的時候，才會發起視訊通話的請求。

實現

對於前端JS程式碼及用到的物件大家可以去檢視詳細的程式碼介紹，我就貼一個連線的方法。首先建立一個客戶端實時獲取狀態的連線，在GAE的例子上是通過GAE Channel API實現，我在這裡用WebSocket實現，程式碼：

function openChannel() {  
     console.log("開啟websocket");
     socket = new WebSocket("ws://192.168.1.158:8080/WebRTC/acgist.video/${requestScope.uid}");                
     socket.onopen = onChannelOpened;
     socket.onmessage = onChannelMessage;
     socket.onclose = onChannelClosed;  
     socket.onerror = onChannelError();
    }  
 

服務端程式碼很簡單，就是收到使用者的請求，傳送給另外一個使用者就可以了，這裡處理的其實是使用者WebRTC的一些資訊，並不是去傳輸視訊，如下：

import java.io.IOException;
import java.util.Collections;
import java.util.HashMap;
import java.util.Map;

import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;

/**
 * @author 李智
 * @date 2017/3/11
 *
 * WebRTC視訊通話
 */

@ServerEndpoint("/acgist.video/{uid}")
public class AcgistVideo {
    // 最大通話數量
    private static final int MAX_COUNT = 10;
    private static final long MAX_TIME_OUT = 1 * 60 * 1000;
    // 使用者和使用者的對話對映
    private static final Map<String, String> user_user = Collections.synchronizedMap(new HashMap<String, String>()); 
    // 使用者和websocket的session對映
    private static final Map<String, Session> sessions = Collections.synchronizedMap(new HashMap<String, Session>());

    /**
     * 開啟websocket
     * @param session websocket的session
     * @param uid 開啟使用者的UID
     */
    @OnOpen
    public void onOpen(Session session, @PathParam("uid")String uid) {
        session.setMaxIdleTimeout(MAX_TIME_OUT);
        sessions.put(uid, session);
    }

    /**
     * websocket關閉
     * @param session 關閉的session
     * @param uid 關閉的使用者標識
     */
    @OnClose
    public void onClose(Session session, @PathParam("uid")String uid) {
        remove(session, uid);
    }

    /**
     * 收到訊息
     * @param message 訊息內容
     * @param session 傳送訊息的session
     * @param uid
     */
    @OnMessage
    public void onMessage(String message, Session session, @PathParam("uid")String uid) {
        try {
            if(uid != null && user_user.get(uid) != null && AcgistVideo.sessions.get(user_user.get(uid)) != null) {
                Session osession = sessions.get(user_user.get(uid)); // 被呼叫的session
                if(osession.isOpen())
                    osession.getAsyncRemote().sendText(new String(message.getBytes("utf-8")));
                else
                    this.nowaiting(osession);
            } else {
                this.nowaiting(session);
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    /**
     * 沒有人在等待
     * @param session 傳送訊息的session
     */
    private void nowaiting(Session session) {
        session.getAsyncRemote().sendText("{\"type\" : \"nowaiting\"}");
    }

    /**
     * 是否可以繼續建立通話房間
     * @return 可以：true；不可以false；
     */
    public static boolean canCreate() {
        return sessions.size() <= MAX_COUNT;
    }

    /**
     * 判斷是否可以加入
     * @param oid 被申請對話的ID
     * @return 如果能加入返回：true；否則返回false；
     */
    public static boolean canJoin(String oid) {
        return !(oid != null && user_user.containsKey(oid) && user_user.get(oid) != null);
    }

    /**
     * 新增視訊物件
     * @param uid 申請對話的ID
     * @param oid 被申請對話的ID
     * @return 是否是建立者：如果沒有申請對話ID為建立者，否則為為加入者。建立者返回：true；加入者返回：false；
     */
    public static boolean addUser(String uid, String oid) {
        if(oid != null && !oid.isEmpty()) {
            AcgistVideo.user_user.put(uid, oid);
            AcgistVideo.user_user.put(oid, uid);

            return false;
        } else {
            AcgistVideo.user_user.put(uid, null);

            return true;
        }
    }

    /**
     * 移除聊天使用者
     * @param session 移除的session
     * @param uid 移除的UID
     */
    private static void remove(Session session, String uid) {
        String oid = user_user.get(uid);

        if(oid != null) user_user.put(oid, null); // 設定對方無人聊天

        sessions.remove(uid); // 異常session
        user_user.remove(uid); // 移除自己

        try {
            if(session != null && session.isOpen()) session.close(); // 關閉session
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

}

自己測試的時候搞個公用的stun伺服器弄一弄就好了。不過人多的時候會延遲很就是了，成功截圖就不放了，人醜家貧。