Nota
O acesso a esta página requer autorização. Podes tentar iniciar sessão ou mudar de diretório.
O acesso a esta página requer autorização. Podes tentar mudar de diretório.
Introdução à Biblioteca de UI dos Serviços de Comunicação do Azure para integrar rapidamente experiências de comunicação nas suas aplicações. Este artigo descreve como integrar componentes de chat da biblioteca de interface do utilizador numa aplicação e configurar a experiência para os utilizadores da aplicação.
A Biblioteca da Interface do Usuário dos Serviços de Comunicação do Azure renderiza uma experiência de chat completa diretamente em seu aplicativo. Ele cuida da conexão aos serviços de chat dos Serviços de Comunicação do Azure e atualiza a presença de um participante automaticamente. Como desenvolvedor, você precisa decidir onde na experiência do usuário do seu aplicativo deseja que a experiência de bate-papo comece e criar apenas os recursos dos Serviços de Comunicação do Azure, conforme necessário.
Nota
Para obter mais informações sobre a biblioteca da interface do usuário da Web, consulte o livro de histórias da biblioteca da interface do usuário da Web.
Pré-requisitos
- Uma conta do Azure com uma subscrição ativa. Crie uma conta gratuitamente.
- Um recurso implantado dos Serviços de Comunicação do Azure. Crie um recurso dos Serviços de Comunicação do Azure.
- Um token dos Serviços de Comunicação do Azure. Veja este exemplo.
Aceda a estes inícios rápidos
Aceda a estes livros de histórias
Importante
Esta funcionalidade dos Serviços de Comunicação do Azure está atualmente em pré-visualização. Os recursos na visualização estão disponíveis publicamente e podem ser usados por todos os clientes novos e existentes da Microsoft.
As APIs e SDKs de visualização são fornecidos sem um contrato de nível de serviço. Recomendamos que você não os use para cargas de trabalho de produção. Determinadas funcionalidades podem não ser suportadas ou recursos podem ser restringidos.
Para obter mais informações, consulte Termos de uso suplementares para visualizações do Microsoft Azure.
Obtenha a aplicação Android de exemplo em Exemplos do Azure SDK para Android para bate-papo na Biblioteca de Interface do Utilizador dos Serviços de Comunicação do Azure de código aberto para Android.
Pré-requisitos
- Uma conta do Azure e uma assinatura ativa do Azure. Crie uma conta gratuitamente.
- Um sistema operacional com Android Studio.
- Um recurso implantado dos Serviços de Comunicação do Azure. Anote o URL do ponto de extremidade.
- Um token de acesso e um identificador de usuário dos Serviços de Comunicação do Azure.
- Uma thread de chat dos Serviços de Comunicação do Azure com o utilizador da etapa anterior adicionado a ela.
Configurar o projeto
Conclua as seções a seguir para configurar o projeto.
Criar um novo projeto Android
No Android Studio, crie um novo projeto.
No menu Arquivo , selecione Novo>Novo Projeto.
Em Novo Projeto, selecione o modelo de projeto Atividade com Visualizações Vazias.
Selecione Avançar.
Nomeie o projeto UILibraryQuickStart. Para idioma, selecione Java/Kotlin. Para o SDK mínimo, selecione API 23: Android 6.0 (Marshmallow) ou posterior.
Selecione Concluir.
Instalar os pacotes
Conclua as seções a seguir para instalar os pacotes de aplicativos necessários.
Adicionar uma dependência
No arquivo UILibraryQuickStart/app/build.gradle no nível do aplicativo (na pasta do aplicativo), adicione a seguinte dependência:
dependencies {
...
implementation 'com.azure.android:azure-communication-ui-chat:+'
...
}
Adicionar repositórios Maven
O repositório de pacotes do Azure é necessário para integrar a biblioteca.
Para adicionar o repositório:
- Nos seus scripts Gradle de projeto, assegure-se de que os seguintes repositórios estejam adicionados. Para Android Studio (2020.*),
repositoriesestá emsettings.gradle, emdependencyResolutionManagement(Gradle version 6.8 or greater). Para versões anteriores do Android Studio (4.*),repositoriesestá no nívelbuild.gradledo projeto, emallprojects{}.
// dependencyResolutionManagement
repositories {
...
maven {
url "https://pkgs.dev.azure.com/MicrosoftDeviceSDK/DuoSDK-Public/_packaging/Duo-SDK-Feed/maven/v1"
}
...
}
Executar o código
No Android Studio, crie e inicie o aplicativo.
- Selecione Iniciar.
- O cliente de chat ingressa no thread de bate-papo e você pode começar a digitar e enviar mensagens.
- Se o cliente não puder ingressar no thread e você vir
chatJoinerros de falha, verifique se o token de acesso do usuário é válido e se o usuário foi adicionado ao thread de chat por chamada à API REST ou usando a interface de linha deazcomando.
Importante
Esta funcionalidade dos Serviços de Comunicação do Azure está atualmente em pré-visualização. Os recursos na visualização estão disponíveis publicamente e podem ser usados por todos os clientes novos e existentes da Microsoft.
As APIs e SDKs de visualização são fornecidos sem um contrato de nível de serviço. Recomendamos que você não os use para cargas de trabalho de produção. Determinadas funcionalidades podem não ser suportadas ou recursos podem ser restringidos.
Para obter mais informações, consulte Termos de uso suplementares para visualizações do Microsoft Azure.
Obtenha a aplicação de exemplo para iOS em SDK de Exemplos do Azure para bate-papo, na Biblioteca de UI dos Serviços de Comunicação Azure, de código aberto, para iOS.
Pré-requisitos
- Uma conta do Azure e uma assinatura ativa do Azure. Crie uma conta gratuitamente.
- Um Mac com Xcode 13 ou posterior e um certificado de programador válido instalado no seu porta-chaves. Os CocoaPods também devem ser instalados para buscar dependências.
- Um recurso implantado dos Serviços de Comunicação do Azure. Anote o URL do ponto de extremidade.
- Um token de acesso e um identificador de usuário dos Serviços de Comunicação do Azure.
- Um thread de chat dos Serviços de Comunicação do Azure. Adicione o usuário que você criou na etapa anterior a este tópico de bate-papo.
Configurar o projeto
Conclua as seções a seguir para configurar o projeto de início rápido.
Criar um novo projeto Xcode
No Xcode, crie um novo projeto.
No menu Arquivo , selecione Novo>Projeto.
Em Escolha um modelo para o seu novo projeto, selecione a plataforma iOS e o modelo App. O guia de início rápido utiliza os storyboards do UIKit.
Em Escolha opções para seu novo projeto, para o nome do produto, digite UILibraryQuickStart. Para a interface, selecione Storyboard. O início rápido não cria testes, portanto, você pode desmarcar a caixa de seleção Incluir testes .
Instalar o pacote e as dependências
(Opcional) Para MacBook com M1, instale e ative o Rosetta no Xcode.
No diretório raiz do projeto, execute
pod initpara criar um Podfile. Se você encontrar um erro, atualize o CocoaPods para a versão atual.Adicione o seguinte código ao seu Podfile. Substitua
UILibraryQuickStartpelo nome do projeto.platform :ios, '14.0' target 'UILibraryQuickStart' do use_frameworks! pod 'AzureCommunicationUIChat', '1.0.0-beta.5' endExecute o
pod install --repo-update.No Xcode, abra o arquivo xcworkspace gerado.
Desativar o User Script Sandboxing
Alguns dos scripts dentro das bibliotecas vinculadas gravam arquivos durante o processo de compilação. Para habilitar a gravação de arquivos, desative o User Script Sandboxing no Xcode.
No projeto Xcode, em Configurações de compilação, defina a opção Área restrita de script de usuário como Não. Para encontrar a configuração, altere o filtro de Básico para Todos ou use a barra de pesquisa.
Inicializar o composto
Para inicializar o composto:
Aceda a
ViewController.Adicione o seguinte código para inicializar seus componentes compostos para um bate-papo. Substitua
<USER_ID>pelo identificador do usuário. Substitua<USER_ACCESS_TOKEN>pelo seu token de acesso. Substitua<ENDPOINT_URL>pelo URL do ponto final. Substitua<THREAD_ID>pelo ID do seu tópico de chat. Substitua<DISPLAY_NAME>pelo seu nome. (O limite de comprimento para<DISPLAY_NAME>é de 256 caracteres).import UIKit import AzureCommunicationCommon import AzureCommunicationUIChat class ViewController: UIViewController { var chatAdapter: ChatAdapter? override func viewDidLoad() { super.viewDidLoad() let button = UIButton() var configuration = UIButton.Configuration.filled() configuration.contentInsets = NSDirectionalEdgeInsets(top: 10.0, leading: 20.0, bottom: 10.0, trailing: 20.0) configuration.baseBackgroundColor = .systemBlue button.configuration = configuration button.layer.cornerRadius = 10 button.setTitle("Start Experience", for: .normal) button.addTarget(self, action: #selector(startChatComposite), for: .touchUpInside) button.translatesAutoresizingMaskIntoConstraints = false self.view.addSubview(button) button.widthAnchor.constraint(equalToConstant: 200).isActive = true button.heightAnchor.constraint(equalToConstant: 50).isActive = true button.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true button.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true } @objc private func startChatComposite() { let communicationIdentifier = CommunicationUserIdentifier("<USER_ID>") guard let communicationTokenCredential = try? CommunicationTokenCredential( token: "<USER_ACCESS_TOKEN>") else { return } self.chatAdapter = ChatAdapter( endpoint: "<ENDPOINT_URL>", identifier: communicationIdentifier, credential: communicationTokenCredential, threadId: "<THREAD_ID>", displayName: "<DISPLAY_NAME>") Task { @MainActor in guard let chatAdapter = self.chatAdapter else { return } try await chatAdapter.connect() let chatCompositeViewController = ChatCompositeViewController( with: chatAdapter) let closeItem = UIBarButtonItem( barButtonSystemItem: .close, target: nil, action: #selector(self.onBackBtnPressed)) chatCompositeViewController.title = "Chat" chatCompositeViewController.navigationItem.leftBarButtonItem = closeItem let navController = UINavigationController(rootViewController: chatCompositeViewController) navController.modalPresentationStyle = .fullScreen self.present(navController, animated: true, completion: nil) } } @objc func onBackBtnPressed() { self.dismiss(animated: true, completion: nil) Task { @MainActor in self.chatAdapter?.disconnect(completionHandler: { [weak self] result in switch result { case .success: self?.chatAdapter = nil case .failure(let error): print("disconnect error \(error)") } }) } } }Se você optar por colocar a visualização de bate-papo em um quadro menor do que o tamanho da tela, recomendamos a largura mínima de 250 e a altura mínima de 300.
Executar o código
Para compilar e executar a sua aplicação no simulador iOS, selecione Produto>Executar. Também pode utilizar o atalho de teclado (⌘-R). Em seguida, experimente a experiência de bate-papo no simulador.
- Selecione Iniciar experiência.
- O cliente de chat ingressa no thread de bate-papo e você pode começar a digitar e enviar mensagens.
- Se o cliente não puder ingressar no thread e você vir
chatJoinerros de falha, verifique se o token de acesso do usuário é válido e se o usuário foi adicionado ao thread de chat por chamada de API REST ou usando a interface de linha de comando az.
Limpar recursos
Se quiser limpar e remover uma assinatura dos Serviços de Comunicação do Azure, você pode excluir o recurso ou grupo de recursos.
A exclusão do grupo de recursos também exclui quaisquer outros recursos associados a ele.
Saiba mais sobre a limpeza de recursos.