基于C#的简单http服务器，用于多台工控机数据的监控

最新推荐文章于 2024-05-04 17:26:47 发布

机器人开发者

最新推荐文章于 2024-05-04 17:26:47 发布

阅读量3.5k

点赞数 3

分类专栏：机器视觉文章标签： http服务器 c# web

本文链接：https://blog.csdn.net/chenhezhuyan/article/details/51714316

版权

机器视觉专栏收录该内容

25 篇文章 0 订阅

订阅专栏

最近工作在公司有这么一个需求：在公司车间有多台电脑运行着视觉检测程序，我们在办公室的时候需要清楚车间程序的运行状态（比如NG率等等）。

需求分析：多台电脑的数据上传到一台电脑，那么需要一台服务器，上传的数据可以被多个人看到，最好是以网页的形式，谁都可以访问。这个貌似涉及到服务器(后台)、网站(前端)，虽然自己平时的工作也算是大杂烩，但是涉及面比较广，还是挺有难度的。

最后得出的方案：在办公室使用一台电脑作为服务器，车间电脑使用http协议上传数据到服务器。然后再写一个简单的网页，访问服务器，返回JSON数据，显示出来。这个网站架设在服务器电脑上，使用Windows自带的IIS。

（一）、IIS设置

进入【控制面板】-【程序】，选中《打开或关闭Windows功能》

打开之后，选中其中两项（红色方框）

点击确定之后，等待几分钟，在C盘目录下生成inetpub文件夹，点击进去，有5个文件夹

等下写好的html文件就放在 wwwroot文件夹下，这时候可以在浏览器中输入自己的IP（或者localhost）来访问,，比如直接输入109.17.86.100回车即可出现网页

注意：第一步我们把网站架设好了，网站内容待会解释哈。

（二）服务器

http服务器可以使用Java编写，但是Windows下.NET平台编写很方便

http服务器作用：保存上传的数据，提供网站访问(我监听了2个端口)

直接贴代码：

<span style="font-size:14px;">using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

using System.Net;
using System.Net.Sockets;
using System.IO;
using System.Threading;

namespace Vision_Server
{
    public partial class Form1 : Form
    {
        String[] NGString=new String[39];
        String[] FailString = new String[39];
        String[] TimeString = new String[39];

        Thread uploadThread;
        Thread downloadThread;
        
        public Form1()
        {
            InitializeComponent();
        }


        private void Form1_Load(object sender, EventArgs e)
        {

            for (int i = 0; i < 39; i++)
            {
                NGString[i] = "*";
                FailString[i] = "*";
                TimeString[i] = "*";
            }

            for (int i = 1; i < 40; i++)
            {
                dataGridView_AAM.Rows.Add(i.ToString() + "#", "*", "*", "*", "*");

            }
            //上传数据服务
            uploadThread = new Thread(new ThreadStart(uploadPro));
            uploadThread.Start();

            //下载数据服务
            downloadThread = new Thread(new ThreadStart(downloadPro));
            downloadThread.Start();
        }

        private void uploadPro()
        {

            using (HttpListener listerner = new HttpListener())
            {
                listerner.AuthenticationSchemes = AuthenticationSchemes.Anonymous;//指定身份验证 Anonymous匿名访问
                listerner.Prefixes.Add("http://109.17.86.92:8080/server/");
                listerner.Start();
                while (true)
                {
                    //等待请求连接
                    //没有请求则GetContext处于阻塞状态
                    HttpListenerContext ctx = listerner.GetContext();
                    ctx.Response.StatusCode = 200;//设置返回给客服端http状态代码
                    try
                    {
                        string pro = ctx.Request.QueryString["pro"];
                        string line = ctx.Request.QueryString["line"];
                        string NG = ctx.Request.QueryString["NG"];
                        string fail = ctx.Request.QueryString["fail"];
                        printLog(" pro=" + pro + " line=" + line + " NG=" + NG + " Fail=" + fail);
                        if (pro == "AAM")
                        {
                            int lineIndex = int.Parse(line) - 1;

                            dataGridView_AAM.Rows[lineIndex].Cells[1].Value = NG;
                            dataGridView_AAM.Rows[lineIndex].Cells[2].Value = fail;
                            dataGridView_AAM.Rows[lineIndex].Cells[3].Value = DateTime.Now.ToString();

                            NGString[lineIndex] = NG;
                            FailString[lineIndex] = fail;
                            TimeString[lineIndex] = DateTime.Now.ToString();

                        }

                        //使用Writer输出http响应代码

                        using (StreamWriter writer = new StreamWriter(ctx.Response.OutputStream))
                        {

                            writer.WriteLine("OK");
                            //writer.Close();
                            // ctx.Response.Close();
                        }
                    }
                    catch (Exception ex)
                    {
                        printLog(ex.Message);
                    }

                }
                listerner.Stop();
            }
      
        }

        private void downloadPro()
        {

            using (HttpListener listerner = new HttpListener())
            {
                listerner.AuthenticationSchemes = AuthenticationSchemes.Anonymous;//指定身份验证 Anonymous匿名访问
                listerner.Prefixes.Add("http://109.17.86.92:8888/web/");
                listerner.Start();
                while (true)
                {
                    //等待请求连接
                    //没有请求则GetContext处于阻塞状态
                    HttpListenerContext ctx = listerner.GetContext();
                    ctx.Response.StatusCode = 200;//设置返回给客服端http状态代码
                    try
                    {
                        int locationY = int.Parse(ctx.Request.QueryString["locationY"]);

                        //使用Writer输出http响应代码
                        using (StreamWriter writer = new StreamWriter(ctx.Response.OutputStream))
                        {

                            String retString = "";
                            //返回AAM数据json
                            retString += "{";
                            retString += addMarks("AAM") + ":";
                            retString += "[";
                            for (int i = 1; i < 40; i++)
                            {
                                retString += "{";
                                retString += addMarks("line") + ":" + addMarks(i.ToString()) + ",";
                                retString += addMarks("pro") + ":" + addMarks("AAM") + ",";
                                retString += addMarks("NG") + ":" + addMarks(NGString[i - 1]) + ",";
                                retString += addMarks("fail") + ":" + addMarks(FailString[i - 1]) + ",";
                                retString += addMarks("time") + ":" + addMarks(TimeString[i - 1]);
                                retString += "}";
                                if (i != 39)
                                    retString += ",";
                            }
                            retString += "]";
                            retString += ",";
                            retString += addMarks("locationY") + ":" + addMarks(locationY.ToString());
                            retString += "}";
                            writer.WriteLine(retString);
                            writer.Close();
                            ctx.Response.Close();

                        }

                    }
                    catch(Exception ex)
                    {
                        printLog(ex.Message);
                    }
                }
                listerner.Stop();
            }

            

         }

        private String addMarks(String s)
        {
            return "\"" + s + "\"";
        }

        private void printLog(String str)
        {
            CheckForIllegalCrossThreadCalls = false;
            if (textBox_log.Lines.Length  > 30)
            {
                textBox_log.Text = "";
            }
            String time = DateTime.Now.ToShortTimeString();
            textBox_log.Text += time+">" + str + "\r\n";

        }

        private void button_exit_Click(object sender, EventArgs e)
        {

            uploadThread.Abort();
            downloadThread.Abort();
            Application.Exit();
        }
  
    }
}</span><span style="font-weight: bold; font-size: 24px;">
</span>

界面效果

（三）、web站点

上面的服务器界面只有一台电脑可以显示，为了可以一网页的形式共享，编写一个网页

网页定时刷新，拉去数据到表格中显示

上代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Vision监控</title>

<style type="text/css">

.go_no {

	background-color: #FF3;

}

#apDiv1 {
	position:absolute;
	width:200px;
	height:115px;
	z-index:1;
	left: 526px;
	top: 91px;
}

.mytitle {
	color: #0F0;
}
#AAMTable {
	color: #00F;
}
</style></head>

<center>
<body>
<p><strong class="mytitle">AAM 复合化程序监控(自动刷新)</strong></p>
<table   id="AAMTable" border="1">
  <tr>
    <th width="50" align="center" scope="col">line</th>
    <th width="100" align="center" scope="col">GO-NO</th>
    <th width="50" align="center" scope="col">Fail</th>
    <th width="150" align="center" scope="col">time</th>
  </tr>
  <tr>
    <td align="center">1#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">2#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">3#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">4#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">5#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">6#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">7#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">8#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">9#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">10#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">11#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">12#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">13#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">14#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">15#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">16#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">17#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">18#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">19#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">20#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">21#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">22#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">23#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">24#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">25#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">26#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">27#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">28#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">29#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">30#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">31#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">32#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">33#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">34#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">35#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">36#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">37#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">38#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
  <tr>
    <td align="center">39#</td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
    <td align="center" id="AAMTable"> </td>
  </tr>
</table>
<p> </p>

</body>
</center>
</html>


<script type=text/javascript> 
var locationY=50;
function timedGetText(){
	locationY=document.getElementById("AAMTable").offsetTop;
	var url="http://109.17.86.92:8888/web/?locationY=" + locationY;  //服务器地址
	var time=400;
    var request = new XMLHttpRequest();
    var timeout = false;
	//访问限时，限时长为200ms
    var timer = setTimeout( function(){
        timeout = true;
        request.abort();
    }, time );
    request.open( "GET", url );
    request.onreadystatechange = function(){
        if( request.readyState !== 4 ) return;
        if( timeout ) return;
        clearTimeout( timer );
        if( request.status === 200 ){
				//数据返回成功
            	 var obj =JSON.parse(request.responseText );  //将JSON字符串转换成JSON对象
				 
	             for(var i=0;i<39;i++)
	             {
		            var fail=obj.AAM[i].fail;
	 	            var NG=obj.AAM[i].NG;
					var time=obj.AAM[i].time;
					
					//表格操作
					document.getElementById("AAMTable").rows[i+1].cells[1].innerHTML=NG;
					document.getElementById("AAMTable").rows[i+1].cells[2].innerHTML=fail;
					document.getElementById("AAMTable").rows[i+1].cells[3].innerHTML=time;
	 			}
				var retlocationY=obj.locationY;
				window.scrollBy(0,retlocationY);
        }
    }
    request.send( null );
}

timedGetText();
function myrefresh()
{   //刷新页面
	window.location.reload();
}
setInterval('myrefresh()',2000);   //定时刷新页面，2s一次

</script>

网页效果：