> ## Documentation Index
> Fetch the complete documentation index at: https://www.mintlify.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# WebSocket playground

> Add interactive WebSocket playgrounds to your documentation so users can test real-time connections, send messages, and view event streams.



## AsyncAPI

````yaml asyncapi.yaml channelOne
id: channelOne
title: Test channel
description: >-
  This is a websocket channel.

  It can have _markdown_ in the description.

  * Use the "echo-websocket.hoppscotch.io" server to receive timestamped
  messages every second.

  * Use the "echo.websocket.org" server to send test messages to the websocket.
  This server will echo back any messages you send to it.
servers:
  - id: echo-websocket
    protocol: wss
    host: echo-websocket.hoppscotch.io
    bindings: []
    variables: []
  - id: echo
    protocol: wss
    host: echo.websocket.org
    bindings: []
    variables: []
address: /
parameters: []
bindings: []
operations:
  - &ref_3
    id: sendTestMessage
    title: Send test message
    type: receive
    messages:
      - &ref_6
        id: TestMessage
        payload:
          - name: Test message
            description: Test message sent to the echo server
            type: object
            properties:
              - name: text
                type: string
                description: The text of your message
                required: true
              - name: subtext
                type: string
                description: Optional second message field
                required: false
              - name: from
                type: string
                description: The name of the sender
                required: false
        headers: []
        jsonPayloadSchema: &ref_0
          type: object
          properties:
            text:
              type: string
              description: The text of your message
              x-parser-schema-id: <anonymous-schema-2>
            subtext:
              type: string
              description: Optional second message field
              x-parser-schema-id: <anonymous-schema-3>
            from:
              type: string
              description: The name of the sender
              x-parser-schema-id: <anonymous-schema-4>
          required:
            - text
          x-parser-schema-id: <anonymous-schema-1>
        title: Test message
        description: Test message sent to the echo server
        example: |-
          {
            "text": "<string>",
            "subtext": "<string>",
            "from": "<string>"
          }
        bindings: []
        extensions:
          - id: x-parser-unique-object-id
            value: TestMessage
          - id: x-parser-message-name
            value: TestMessage
    bindings: []
    extensions: &ref_1
      - id: x-parser-unique-object-id
        value: channelOne
  - &ref_4
    id: receiveTestMessage
    title: Receive test message
    type: send
    messages:
      - &ref_7
        id: TestMessage
        payload:
          - name: Test message
            description: Test message sent to the echo server
            type: object
            properties:
              - name: text
                type: string
                description: The text of your message
                required: true
              - name: subtext
                type: string
                description: Optional second message field
                required: false
              - name: from
                type: string
                description: The name of the sender
                required: false
        headers: []
        jsonPayloadSchema: *ref_0
        title: Test message
        description: Test message sent to the echo server
        example: |-
          {
            "text": "<string>",
            "subtext": "<string>",
            "from": "<string>"
          }
        bindings: []
        extensions:
          - id: x-parser-unique-object-id
            value: TestMessage
          - id: x-parser-message-name
            value: TestMessage
    bindings: []
    extensions: *ref_1
  - &ref_5
    id: receiveTimestamp
    title: Receive timestamp
    type: send
    messages:
      - &ref_8
        id: Timestamp
        payload:
          - type: string
            description: Timestamp message sent from echo hoppscotch server
            examples: &ref_2
              - 22:02:27 GMT+0000 (Coordinated Universal Time)
            x-parser-schema-id: Timestamp
            name: Timestamp
        headers: []
        jsonPayloadSchema:
          schema:
            type: string
            description: Timestamp message sent from echo hoppscotch server
            examples: *ref_2
            x-parser-schema-id: Timestamp
        title: Timestamp
        description: Timestamp message sent from echo hoppscotch server
        example: '"22:02:27 GMT+0000 (Coordinated Universal Time)"'
        bindings: []
        extensions:
          - id: x-parser-unique-object-id
            value: Timestamp
          - id: x-parser-message-name
            value: Timestamp
    bindings: []
    extensions: *ref_1
sendOperations:
  - *ref_3
receiveOperations:
  - *ref_4
  - *ref_5
sendMessages:
  - *ref_6
receiveMessages:
  - *ref_7
  - *ref_8
extensions:
  - id: x-parser-unique-object-id
    value: channelOne
securitySchemes: []

````

## Related topics

- [Playground](/es/api-playground/overview.md)
- [AsyncAPI setup](/api-playground/asyncapi-setup.md)
- [Configuración de AsyncAPI](/es/api-playground/asyncapi-setup.md)