SOURCE

let config = {
    APPID: 1739272706,
    server: ['wss://webliveroom-test.zego.im/ws', 'wss://webliveroom-test-bak.zego.im/ws'],
    user: {
        userID: 'jsrun-userid-' + new Date().getTime(),
        userName: 'jsrun-userName',
    },
    pubishStreamID: 'jsrun-pushID' + new Date().getTime(),
    tokenServer: 'https://wsliveroom-alpha.zego.im:8282/token',
    localVideo: document.querySelector('#localVideo')
};
/* 
appID 为应用ID，请从 即构管理控制台-https://console-express.zego.im/ 获取

server 为接入服务器地址，请登录即构管理控制台（https://console-express.zego.im/），在对应项目下单击 “配置”，弹出基本信息后单击 “环境配置” 下的 “查看” 按钮，在弹窗中依次选择 “集成的SDK” 和 “Web” 平台便可获取对应的 server 地址
*/

// 初始化实例
const zg = new ZegoExpressEngine(config.APPID, config.server);

// 回调事件,登录前绑定
function eventListen() {
    // 房间状态监听
    zg.on('roomStateUpdate', (roomID, state, errorCode, extendedData) => {
        console.log('roomStateUpdate change to: ', state)
        if (state == 'DISCONNECTED') {
            // 与房间断开了连接
        }

        if (state == 'CONNECTING') {
            // 与房间尝试连接中 
        }

        if (state == 'CONNECTED') {
            // 与房间连接成功
        }
    });
    //推流状态变更通知
    zg.on('publisherStateUpdate', result => {
        console.log('publisherStateUpdate', result.streamID, result.state)
    })
    //推流质量
    zg.on('publishQualityUpdate', (streamID, stats) => {
        console.log('publishQualityUpdate', streamID, stats)
    })
}

// token 需要在自己的业务服务期实现, 这里的测试tokenserver只限于测试时使用
async function getToken(tokenServer, appID, userID) {
    return new Promise((res, rej) => {
        /* 即构提供开发阶段获取token接口:https://wsliveroom-alpha.zego.im:8282/token，只能用于测试环境，正式环境一定要由客户业务服务器实现token
           */
        $.get(tokenServer, { 'app_id': appID, 'id_name': userID }, token => {
            //获取token成功
            res(token);
        });
    }
    )
}

async function login(roomID) {
    // 获取token
    const token = await getToken(config.tokenServer, config.APPID, config.user.userID);
    // 绑定相关回调
    eventListen();
    // 登录房间
    const result = await zg.loginRoom(roomID, token, config.user);

    return result
}

async function publishStream() {
    let localStream, result;
    try {
        // 创建本地流 
        localStream = await zg.createStream();
        // 渲染本地流
        localVideo.srcObject = localStream;
        // 发布本地流
        // localStream 为创建流获取的MediaStream对象
        result = await zg.startPublishingStream(config.pubishStreamID, localStream);

        return result;
    } catch (err) {
        console.error('createStream faild,reason:', err);
    }

}

async function run() {
    // 获取输入的房间ID
    let roomID = document.querySelector('#roomID').value;
    // 登录
    let loginSuc = await login(roomID);
    let publishSuc = await publishStream();
}

<div>
	roomID:<input id="roomID"/> <button onclick="run()">输入房间ID推流</button>
</div>
<div>
<video id="localVideo" muted autoplay></video>
</div>

#localVideo {
    width: 640px;
    height: 480px;
    background: black;
}