VB TCP Socket服务器适配CSHTML页面JavaScript客户端方案咨询

你的核心问题是协议不兼容：你用VB搭建的是原生TCP Socket服务器，但Socket.io是基于WebSocket的上层框架，两者通信协议完全不同，所以Socket.io客户端根本连不上。另外，浏览器端JavaScript受安全策略限制，无法直接创建原生TCP连接，必须通过HTTP/WebSocket这类浏览器允许的协议来实现。

下面给你两种可行的解决方案，按需选择：

方案一：ASP.NET后台中转（推荐，无需修改现有TCP服务器） #

通过ASP.NET后台代码作为中间层，前端JS调用后台接口，由后台去连接你的VB TCP服务器，再把结果返回给前端。

步骤1：编写后台处理方法（以Razor页面为例） #

在你的CSHTML对应的.cs文件中添加以下代码（C#，如果用VB可以自行转换）：

public async Task<IActionResult> OnPostGetTcpData()
{
    string tcpResponse = string.Empty;
    // 替换为你的VB TCP服务器IP和端口
    string serverIp = "127.0.0.1";
    int serverPort = 8888;

    using (var tcpClient = new System.Net.Sockets.TcpClient())
    {
        await tcpClient.ConnectAsync(serverIp, serverPort);
        using (var networkStream = tcpClient.GetStream())
        {
            // 发送和VB客户端一致的请求内容
            byte[] requestBytes = System.Text.Encoding.UTF8.GetBytes("你的请求字符串");
            await networkStream.WriteAsync(requestBytes, 0, requestBytes.Length);

            // 接收服务器返回的数据
            byte[] buffer = new byte[1024];
            int bytesRead = await networkStream.ReadAsync(buffer, 0, buffer.Length);
            tcpResponse = System.Text.Encoding.UTF8.GetString(buffer, 0, bytesRead);
        }
    }
    return new JsonResult(tcpResponse);
}

步骤2：前端JS调用后台接口 #

在CSHTML页面中添加按钮和JS代码（无需额外依赖库）：

<button id="getTcpDataBtn">获取TCP服务器数据</button>
<div id="responseResult"></div>

<script>
    document.getElementById('getTcpDataBtn').addEventListener('click', async () => {
        const resultElement = document.getElementById('responseResult');
        try {
            // 调用后台Handler方法，注意替换为你的页面路径
            const response = await fetch('/YourPageName?handler=GetTcpData', {
                method: 'POST',
                headers: {
                    // 带上防伪造Token，避免请求被拦截
                    'RequestVerificationToken': document.querySelector('input[name="__RequestVerificationToken"]').value
                }
            });
            const data = await response.json();
            resultElement.textContent = `服务器返回：${data}`;
        } catch (err) {
            resultElement.textContent = `请求失败：${err.message}`;
        }
    });
</script>

方案二：修改VB服务器支持WebSocket（适合长期优化） #

如果可以修改你的VB TCP服务器，让它支持WebSocket协议，那么前端可以直接用浏览器原生WebSocket API连接，不需要中间层。

前端JS代码示例 #

<button id="connectWsBtn">连接WebSocket服务器</button>
<button id="sendRequestBtn">发送请求</button>
<div id="wsResult"></div>

<script>
    let wsConnection;
    const resultElement = document.getElementById('wsResult');

    // 连接WebSocket服务器
    document.getElementById('connectWsBtn').addEventListener('click', () => {
        // 替换为你的服务器IP和端口，ws://为明文连接，wss://为加密连接
        wsConnection = new WebSocket('ws://127.0.0.1:8888');

        wsConnection.onopen = () => resultElement.textContent = '连接成功';
        wsConnection.onmessage = (event) => resultElement.textContent = `服务器返回：${event.data}`;
        wsConnection.onerror = (err) => resultElement.textContent = `连接错误：${err.message}`;
        wsConnection.onclose = () => resultElement.textContent = '连接已关闭';
    });

    // 发送请求
    document.getElementById('sendRequestBtn').addEventListener('click', () => {
        if (wsConnection && wsConnection.readyState === WebSocket.OPEN) {
            wsConnection.send('你的请求内容');
        } else {
            resultElement.textContent = '请先连接服务器';
        }
    });
</script>

注意：此方案需要你修改VB服务器，实现WebSocket的握手流程和数据帧解析（WebSocket有特定的协议格式，不是原生TCP的明文传输）。

关键注意事项 #

• 两种方案都不需要额外安装NuGet包或依赖库，使用.NET和浏览器原生API即可。
• 测试时确保VB服务器处于运行状态，且ASP.NET项目能访问到服务器的IP和端口（本地测试用127.0.0.1即可）。
• 方案一的后台代码要和VB客户端的请求格式完全一致，否则服务器可能无法正确响应。

内容的提问来源于stack exchange，提问作者Peter