做个小工具-WebSocket客户端

原创

已于 2022-12-07 22:39:09 修改 · 1.5k 阅读

标签

#websocket #microsoft #网络协议

于 2022-12-07 22:38:47 首次发布

本文介绍了一个基于WatsonWebsocket组件开发的WebSocket客户端应用。该客户端具备连接管理、数据发送接收及编码格式选择等功能。

由于工作的原因经常需要用到一些socket，串口等调试工具，但是好多工具要么只有其中几个或者各种收费，不断提醒捐助等。所以还是自己做一个吧。毕竟也不复杂。今天先做个WebSocket客户端。WebSocket使用了开源组件WatsonWebsocket。

先上图
View的代码

<local:PageWithId x:Class="ToolsAssistant.Views.WebSocketClientView"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:ToolsAssistant.Views" xmlns:viewmodels="clr-namespace:ToolsAssistant.ViewModels" d:DataContext="{d:DesignInstance Type=viewmodels:WebSocketClientViewModel}"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800" Unloaded="Page_Unloaded" Loaded="Page_Loaded"
      Title="WebServerClientView" Background="White">
    
    <Grid>
        <Grid.Resources>
            <Style x:Key="btn_style" TargetType="Button">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Content, ElementName=btn_connect}" Value="连接">
                        <Setter Property="IsEnabled" Value="False"/>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Content, ElementName=btn_connect}" Value="断开">
                        <Setter Property="IsEnabled" Value="true"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
            <Style x:Key="radio_style" TargetType="RadioButton">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Content, ElementName=btn_connect}" Value="连接">
                        <Setter Property="IsEnabled" Value="False"/>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Content, ElementName=btn_connect}" Value="断开">
                        <Setter Property="IsEnabled" Value="true"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="40"/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Border BorderThickness="1" BorderBrush="Gray" Margin="3" CornerRadius="5" Grid.Row="0">
            <StackPanel  Orientation="Horizontal">
                <Label Content="ws://" Margin="3" VerticalContentAlignment="Center"></Label>
                <TextBox Text="{Binding Url}" Margin="3" Width="200" VerticalContentAlignment="Center"/>
                <Button x:Name="btn_connect" Margin="3" Content="{Binding ConnectString}" Width="60" Command="{Binding ConnectCommand}">
                </Button>
            </StackPanel>
        </Border>
        <Border BorderThickness="1" BorderBrush="Gray" Margin="3" CornerRadius="5" Grid.Row="1">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="40"/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <StackPanel Grid.Row="0" Orientation="Horizontal">
                    <Button Content="发送" Command="{Binding SendCommand}" Width="60" Margin="3" Style="{StaticResource btn_style}">
                    </Button>
                    <Button Content="清空" Command=