{"id":26371770,"url":"https://github.com/danielfreitassc/websocket-stomp-tester","last_synced_at":"2026-01-04T03:11:23.573Z","repository":{"id":217437248,"uuid":"743860269","full_name":"DanielFreitassc/Websocket-stomp-tester","owner":"DanielFreitassc","description":null,"archived":false,"fork":false,"pushed_at":"2025-03-15T00:54:14.000Z","size":167,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-15T01:33:10.985Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://stomp-client.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/DanielFreitassc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-01-16T06:25:16.000Z","updated_at":"2025-03-15T00:54:17.000Z","dependencies_parsed_at":null,"dependency_job_id":"ffc1e527-8895-49ed-bd98-aa18d627fcf5","html_url":"https://github.com/DanielFreitassc/Websocket-stomp-tester","commit_stats":null,"previous_names":["danielfreitassc/projects_assembly","danielfreitassc/webpagerestaurante","danielfreitassc/stomp-client"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DanielFreitassc%2FWebsocket-stomp-tester","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DanielFreitassc%2FWebsocket-stomp-tester/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DanielFreitassc%2FWebsocket-stomp-tester/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DanielFreitassc%2FWebsocket-stomp-tester/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/DanielFreitassc","download_url":"https://codeload.github.com/DanielFreitassc/Websocket-stomp-tester/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243955722,"owners_count":20374372,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-03-17T00:46:58.253Z","updated_at":"2026-01-04T03:11:23.564Z","avatar_url":"https://github.com/DanielFreitassc.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Websocket-Stomp-Tester 🚀\n\n## Visão Geral 📋\n\nO **Websocket-Stomp-Tester** é uma aplicação de cliente WebSocket construída para testar comunicação em tempo real usando o protocolo **STOMP** (Streaming Text Oriented Messaging Protocol). Ele permite a conexão com um servidor WebSocket, se inscrever em tópicos para receber mensagens, e enviar mensagens para destinos específicos de forma fácil e interativa. Ideal para testar implementações de STOMP e WebSockets de maneira prática!\n\n## Funcionalidades 🎯\n\n### 1. **Conectar ao WebSocket 🌐**\n   - O cliente pode se conectar ao WebSocket através de um URL configurável.\n   - Após a conexão, o status é exibido para o usuário, garantindo que tudo está funcionando.\n   - Quando conectado, a interface exibe \"Conectado\" e desabilita o campo de URL.\n\n### 2. **Inscrever-se em Tópicos 📬**\n   - Antes de enviar qualquer mensagem, você precisa se inscrever em um tópico STOMP para começar a receber mensagens.\n   - O aplicativo mantém uma lista dos tópicos aos quais você se inscreveu.\n   - Cada inscrição é registrada para que você saiba quais tópicos está monitorando.\n\n### 3. **Enviar Mensagens 📨**\n   - Envie mensagens em formato JSON para destinos STOMP configurados **apenas após se inscrever em um tópico**.\n   - A interface utiliza um editor de código **AceEditor** para fornecer uma experiência amigável ao editar JSON.\n   - As mensagens enviadas são publicadas no servidor STOMP configurado.\n\n### 4. **Visualizar Mensagens Recebidas 📲**\n   - As mensagens recebidas dos tópicos inscritos são exibidas na interface em tempo real.\n   - Cada nova mensagem é adicionada à lista de mensagens recebidas.\n\n---\n\n## Como Usar 🛠️\n\n### Passo 1: **Conectar ao WebSocket**\n\n- **URL WebSocket**: Digite o URL do seu servidor WebSocket. Exemplo: `ws://localhost:8080/addEndpoint`.\n- Clique em **Conectar** para estabelecer a conexão.\n  - O botão ficará desabilitado enquanto a conexão estiver ativa.\n\n### Passo 2: **Inscrever-se em Tópicos**\n\n- **Tópico**: Digite o nome do tópico ao qual deseja se inscrever. Exemplo: `/topic/updates`.\n- Clique em **Inscrever** para começar a receber mensagens desse tópico.\n  - A lista de tópicos inscritos será atualizada automaticamente.\n\n### Passo 3: **Enviar Mensagens**\n\n- **Destino**: Defina o destino da mensagem. Exemplo: `/app/sendData`.\n- **Mensagem**: Digite sua mensagem em formato JSON (por exemplo: `{\"a\": 1, \"b\": \"example\"}`).\n- **Importante**: Você **precisa se inscrever em um tópico** antes de enviar qualquer mensagem.\n- Clique em **Enviar** para publicar a mensagem no servidor STOMP.\n\n### Passo 4: **Visualizar Mensagens Recebidas**\n\n- As mensagens recebidas nos tópicos aos quais você está inscrito serão listadas na seção de **Mensagens Recebidas**.\n- As mensagens aparecem na ordem de chegada.\n\n---\n\n## Componentes e Tecnologias ⚙️\n\n### 1. **STOMP** 📡\n   - O protocolo **STOMP** é utilizado para comunicação de mensagens de texto entre o cliente e o servidor.\n   - A biblioteca **@stomp/stompjs** é usada para gerenciar a comunicação WebSocket e STOMP.\n\n### 2. **AceEditor** 🖋️\n   - O editor de código **AceEditor** oferece uma experiência interativa para editar JSON de maneira eficiente.\n   - Ele fornece funcionalidades como **auto-completar**, **destaque de sintaxe** e **snippets**.\n\n### 3. **React** ⚛️\n   - A aplicação é construída com **React** para garantir uma interface interativa e reativa.\n   - O estado da aplicação é gerenciado com hooks como `useState` e `useEffect`.\n\n---\n\n## Fluxo de Comunicação 🛣️\n\n1. **Conexão**: O cliente se conecta a um servidor WebSocket e, ao ser bem-sucedido, ativa o protocolo STOMP.\n2. **Inscrição em Tópico**: O cliente se inscreve em tópicos para começar a receber mensagens.\n3. **Envio de Mensagem**: Após se inscrever em um tópico, o cliente pode enviar uma mensagem para um destino STOMP específico.\n4. **Recebimento de Mensagens**: O servidor envia mensagens para o cliente através dos tópicos aos quais ele está inscrito.\n\n---\n\n## Exemplo de Uso 🎬\n\n1. **Conectar** ao WebSocket com o URL `ws://localhost:8080/addEndpoint`.\n2. **Inscrever-se no tópico** `/topic/updates` para começar a receber atualizações.\n3. **Enviar uma mensagem JSON**:\n   - Destino: `/app/sendData`\n   - Mensagem: `{\"message\": \"Hello, World!\"}`\n4. Visualizar as **mensagens recebidas** na interface.\n\n---\n\n## Notas Importantes ⚠️\n\n- Certifique-se de que o servidor WebSocket está configurado corretamente para suportar o protocolo STOMP.\n- A formatação do JSON deve ser válida. Utilize o editor para garantir que a sintaxe está correta.\n- **Lembre-se**: para enviar uma mensagem, é necessário estar inscrito em pelo menos um tópico.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdanielfreitassc%2Fwebsocket-stomp-tester","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdanielfreitassc%2Fwebsocket-stomp-tester","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdanielfreitassc%2Fwebsocket-stomp-tester/lists"}