FMUSER Transmitir vídeo e áudio sem fio mais fácil!
es.fmuser.org
it.fmuser.org
fr.fmuser.org
de.fmuser.org
af.fmuser.org -> Afrikaans
sq.fmuser.org -> albanês
ar.fmuser.org -> árabe
hy.fmuser.org -> armênio
az.fmuser.org -> Azerbaijão
eu.fmuser.org -> Basco
be.fmuser.org -> bielorrusso
bg.fmuser.org -> búlgaro
ca.fmuser.org -> catalão
zh-CN.fmuser.org -> Chinês (simplificado)
zh-TW.fmuser.org -> chinês (tradicional)
hr.fmuser.org -> croata
cs.fmuser.org -> checo
da.fmuser.org -> dinamarquês
nl.fmuser.org -> holandês
et.fmuser.org -> estoniano
tl.fmuser.org -> filipino
fi.fmuser.org -> finlandês
fr.fmuser.org -> francês
gl.fmuser.org -> galego
ka.fmuser.org -> georgiano
de.fmuser.org -> alemão
el.fmuser.org -> grego
ht.fmuser.org -> crioulo haitiano
iw.fmuser.org -> hebraico
hi.fmuser.org -> Hindi
hu.fmuser.org -> húngaro
is.fmuser.org -> islandês
id.fmuser.org -> indonésio
ga.fmuser.org -> irlandês
it.fmuser.org -> italiano
ja.fmuser.org -> Japonês
ko.fmuser.org -> coreano
lv.fmuser.org -> letão
lt.fmuser.org -> Lituano
mk.fmuser.org -> macedônio
ms.fmuser.org -> malaio
mt.fmuser.org -> maltês
no.fmuser.org - norueguês
fa.fmuser.org -> persa
pl.fmuser.org -> polonês
pt.fmuser.org -> português
ro.fmuser.org -> romeno
ru.fmuser.org -> russo
sr.fmuser.org -> Sérvio
sk.fmuser.org -> Eslovaco
sl.fmuser.org -> esloveno
es.fmuser.org -> espanhol
sw.fmuser.org -> Swahili
sv.fmuser.org -> sueco
th.fmuser.org -> Tailandês
tr.fmuser.org -> turco
uk.fmuser.org -> ucraniano
ur.fmuser.org -> Urdu
vi.fmuser.org -> vietnamita
cy.fmuser.org -> Galês
yi.fmuser.org -> iídiche
A transmissão ao vivo interativa envolve o servidor, o cliente do professor, o cliente do aluno iOS / Android e o cliente do aluno Web / Wap. Este artigo enfoca o processo de interação do Maimai, o design do módulo Maimai no front-end e o design de componentes interativos e de bate-papo no front-end. Para a realização da função de chat da própria sala de chat, porque o acesso ao Yunxin IM SDK é realizado principalmente através do pacote de chamadas Api, não entrarei em detalhes.
Antes de projetar o sistema, primeiro precisa considerar as seguintes questões:
• Definição de requisitos e divisão de funções de cada extremidade, como cada extremidade interage
• Acordo entre cada ponta
• O cliente pede ao microfone e ao professor para receber
• Sincronização de informações interativas após o cliente entrar na sala de transmissão ao vivo interativa
Com as perguntas acima, vamos primeiro classificar os serviços nos quais podemos confiar. Os seguintes serviços fornecidos pela NetEase Cloud são mostrados na figura abaixo. Combinado com o design de nossos próprios requisitos de sistema, podemos integrar rapidamente as funções de mensagens instantâneas e transmissão ao vivo interativa.
• O serviço Yunxin IM fornece um conjunto completo de recursos básicos de mensagens instantâneas, que podem integrar rapidamente mensagens instantâneas e recursos de rede em tempo real aos próprios aplicativos da empresa.
• A função de transmissão ao vivo interativa do Yunxin oferece suporte à interação em tempo real entre o anfitrião e o público.
Quadro
Nossas necessidades básicas são principalmente as seguintes três partes:
1. Os alunos entram na sala de chat no cliente do aplicativo e podem iniciar uma solicitação de trigo;
2. Do lado do professor, você pode aprovar ou rejeitar a solicitação do aluno;
3. Depois que o professor concorda com a solicitação de um aluno, o aluno pode entrar na sala de transmissão ao vivo para interagir.
Combine os requisitos e classifique a seguinte solicitação básica de microfone, microfone de conexão e processos interativos, conforme mostrado na figura abaixo. Diferentes estilos de fluxo de dados representam diferentes acordos.
Aqui estão alguns conceitos adicionais:
1. O SDK do cliente Yunxin IM, o cliente envia mensagens P2P para o professor por meio do Yunxin IM
2. SDK de transmissão ao vivo interativa do cliente, o cliente se conecta à transmissão ao vivo interativa
3. Yunxin SDK no lado do professor, aceite mensagens p2p
4. SDK de transmissão ao vivo interativa para o professor, interagir com a transmissão ao vivo do lado do cliente
5. O SDK do Yunxin IM na web, enviando e recebendo mensagens
6. Personalize a mensagem e a estrutura de dados da mensagem enviada por cada extremidade
Design e implementação
Implementação Esta seção apresenta principalmente a implementação do cliente professor e do cliente aluno Web / Wap mencionados na visão geral da seção anterior. Inclui principalmente as seguintes partes: refinamento do processo, módulo de IM do professor, módulo do terminal do aluno da Web, configuração, vantagens e problemas existentes.
Refinamento do processo
Primeiro, vamos apresentar a implementação da extremidade do professor e fazer explicações complementares para alguns dos detalhes na ordem dos números na figura abaixo. O lado do professor tem duas partes principais, uma é nativa, chamada de nativa do professor neste artigo, e a outra é uma página da web, chamada de MI do professor neste artigo. O professor nativo e o professor IM se comunicam por meio de jsbridge e mensagens personalizadas.
Em primeiro lugar, resolva a comunicação do jsbridge entre o professor nativo e o professor MI da seguinte forma:
-notifyQueueChange
-notifyVolume
-notifyCustomMsg
-checar atualização
-notifyLiveStatus
Combine o fluxograma acima e faça uma descrição detalhada do processo:
1. Inicialização do cliente
Cada extremidade obtém um endereço de sala de chat unificado, solicitando ao servidor
2. Inicialização do professor
Depois que o IM do professor é inicializado, ele obtém o endereço da sala de chat por meio da solicitação do servidor (getPresenterLiveInfo), obtém o singleton da sala de chat, informa ao professor que a sala de chat nativa está pronta e obtém os dados da transmissão ao vivo interativa.
3. O processo de convidar o trigo
• O cliente envia uma mensagem p2p ao professor nativo. O professor nativo usa jsbridge para chamar o notificarCustomMsg do professor IM, e o professor IM atualiza a fila de espera para a solicitação Mai que ele mantém.
• O MI do professor clica para concordar ou rejeitar, e o nativo do professor é notificado por meio de uma mensagem, e o nativo do professor informa o cliente da solicitação por meio de P2P.
• O cliente usa o SDK de transmissão ao vivo interativa, conecta o microfone à sala ao vivo e envia uma mensagem ao professor nativo por meio do SDK de transmissão ao vivo interativa.
• O professor nativo chama o método notificarQueueChange para atualizar as listas no IM do professor
• Professor IM, solicitação assíncrona (informServer) para atualizar as filas de upload e download do servidor, enviar mensagens personalizadas (im-sdk) e transmitir para notificar cada cliente.
Módulo de IM do professor
Combinando o fluxograma e a descrição detalhada do processo acima, os módulos front-end são projetados e divididos, conforme mostrado na figura a seguir.
Aqui, LivePcChat é um componente de chat no Tab, LiveInteractivePresenter é um componente que processa operações interativas e XXcache é um componente que encapsula operações de camada de dados correspondentes. A instância do componente específico, chamada, solicitação de dados e processo de processamento são mostrados no diagrama de sequência abaixo:
Módulo de estudante da web
Para o terminal de estudante Web / Wap, porque o próprio terminal de estudante Web / Wap ainda não desenvolveu a função de maiden. Aqui, tome o terminal de aluno da Web como um exemplo para apresentar a realização do terminal de aluno da Web / Wap na lista interativa e na interação de bate-papo. A própria sala de chat e a sala de chat no lado do professor reutilizam os componentes do chat, portanto os módulos também são divididos aqui primeiro. Você pode consultar a divisão de componentes do lado do professor para comparar alguns dos componentes reutilizados pelo lado do professor e pelo lado do aluno. A figura a seguir mostra a divisão do lado do aluno da web.
Pode-se observar pela comparação na tabela abaixo que, além da lógica de processamento relacionada ao Yingmai, outras funções do IM do lado do professor e do lado do aluno da web podem ser reutilizadas.
Configuração
A transmissão ao vivo interativa é uma iteração baseada na transmissão ao vivo original, portanto, aqui devemos garantir a configurabilidade da transmissão ao vivo interativa em várias linhas de produtos educacionais. A configuração mencionada aqui é semelhante à configuração de outros módulos e acesso a componentes no pool de componentes públicos de educação. Ele também se baseia no cache-base do componente geral de educação, que é lido na configuração quando a página ativa ou a página única do projeto é carregada (fundo institucional) Configuração, configuração de uma tecla.
Análise de prós e contras
As vantagens de usar este design são
1. Todas as solicitações do servidor são enviadas através da página web, reduzindo o custo de manutenção do professor;
2. A configurabilidade do módulo. Em diferentes linhas de negócios, ele pode ser configurado para decidir se deseja se conectar à transmissão ao vivo interativa;
3. Os componentes são granulares. Em diferentes módulos, o lado do professor pode acessar o componente de bate-papo e o componente interativo, o componente de microfone e o lado do aluno pode acessar apenas o componente de lista interativa;
4. Ele depende, em grande medida, das funções implementadas pelo sdk Yunxin existente, que pode atender aos requisitos em um tempo relativamente curto.
O problema
1. O processo de Yingmai é mais complicado, porque envolve várias extremidades, e depurar em cada extremidade é uma perda de tempo. Este é também o propósito da organização deste artigo. Depois de compreender o processo de cada extremidade, cada extremidade pode primeiro localizar a extremidade do problema durante a depuração e, em seguida, o problema pode ser encontrado em um determinado link de maneira direcionada.
2. Por ser realizado com base na iteração original, muitos componentes não são encapsulados em componentes padrão educacionais, mas sob a premissa de uma lógica clara, eles podem ser otimizados em iterações subsequentes.
3. Otimize o método de implementação de front-end.
resumir
Por meio deste artigo, resolveremos a lógica de cada extremidade da transmissão ao vivo interativa para facilitar o acesso posterior à compreensão do processo de transmissão ao vivo interativa. Para o cliente e o professor, você pode entender a implementação das interfaces e mensagens fornecidas pelo front end. Se for necessário acessar o módulo de transmissão ao vivo interativo em outro projeto subsequente, ele pode ser rapidamente acessado e depurado e, ao mesmo tempo, pode otimizar ainda mais os problemas existentes levantados acima.
|
Digite o e-mail para obter uma surpresa
es.fmuser.org
it.fmuser.org
fr.fmuser.org
de.fmuser.org
af.fmuser.org -> Afrikaans
sq.fmuser.org -> albanês
ar.fmuser.org -> árabe
hy.fmuser.org -> armênio
az.fmuser.org -> Azerbaijão
eu.fmuser.org -> Basco
be.fmuser.org -> bielorrusso
bg.fmuser.org -> búlgaro
ca.fmuser.org -> catalão
zh-CN.fmuser.org -> Chinês (simplificado)
zh-TW.fmuser.org -> chinês (tradicional)
hr.fmuser.org -> croata
cs.fmuser.org -> checo
da.fmuser.org -> dinamarquês
nl.fmuser.org -> holandês
et.fmuser.org -> estoniano
tl.fmuser.org -> filipino
fi.fmuser.org -> finlandês
fr.fmuser.org -> francês
gl.fmuser.org -> galego
ka.fmuser.org -> georgiano
de.fmuser.org -> alemão
el.fmuser.org -> grego
ht.fmuser.org -> crioulo haitiano
iw.fmuser.org -> hebraico
hi.fmuser.org -> Hindi
hu.fmuser.org -> húngaro
is.fmuser.org -> islandês
id.fmuser.org -> indonésio
ga.fmuser.org -> irlandês
it.fmuser.org -> italiano
ja.fmuser.org -> Japonês
ko.fmuser.org -> coreano
lv.fmuser.org -> letão
lt.fmuser.org -> Lituano
mk.fmuser.org -> macedônio
ms.fmuser.org -> malaio
mt.fmuser.org -> maltês
no.fmuser.org - norueguês
fa.fmuser.org -> persa
pl.fmuser.org -> polonês
pt.fmuser.org -> português
ro.fmuser.org -> romeno
ru.fmuser.org -> russo
sr.fmuser.org -> Sérvio
sk.fmuser.org -> Eslovaco
sl.fmuser.org -> esloveno
es.fmuser.org -> espanhol
sw.fmuser.org -> Swahili
sv.fmuser.org -> sueco
th.fmuser.org -> Tailandês
tr.fmuser.org -> turco
uk.fmuser.org -> ucraniano
ur.fmuser.org -> Urdu
vi.fmuser.org -> vietnamita
cy.fmuser.org -> Galês
yi.fmuser.org -> iídiche
FMUSER Transmitir vídeo e áudio sem fio mais fácil!
Contato
Endereço:
No.305 Sala HuiLan Edifício No.273 Huanpu Road Guangzhou China 510620
Categorias
Newsletter