WebChart网页局域网聊天系列(一):ActiveX插件编写

第一步：创建ActiveX控件类库，在解决方案中右击添加Window窗体控件库

在该类库属性中，设置 使程序集COM可见，同时设置为COM互操作注册

另外在自动生成的文件中AssemblyInfo.cs，添加[assembly: AllowPartiallyTrustedCallers()]

以上操作的目的是，让其他框架页可以访问该ActiveX里的方法

第二步：添加前台接口类，主要给web页面调用

    [Guid("806635E5-AFF1-4BBE-960F-121910EB7F7A"),InterfaceType(ComInterfaceType.InterfaceIsDual),ComVisible(true)]

    public interface ISendMsg

    {

        [DispId(1)]

        int Conn(string ip,int port);

        [DispId(2)]

        void Send(string msg);

    }

 添加了这个方法，网页页面就可以访问这两个方法了

第三步：添加ActiveX触发接口，用于触发传递到Web页面的事件

    [Guid("D6F88421-BE17-4310-9692-A07A00CDF474"),InterfaceType(ComInterfaceType.InterfaceIsIDispatch),ComVisible(true)]

    public interface IMsgEvent

    {

        [DispId(21)]

        void OnMsgHander(string msg);

    }

 第四步：在ActiveX类库中，实现前台接口类的实现方法

[Guid("8366F83A-F207-4B41-ACD1-49A3EBAFE192"), ProgId("Socket_Ocx.UserMain"), ClassInterface(ClassInterfaceType.None), ComDefaultInterface(typeof(ISendMsg)),ComSourceInterfaces(typeof(IMsgEvent)), ComVisible(true)]

    public partial class UserMain : UserControl, ISendMsg

    {

        private Socket client;

        public delegate void MsgHander(string msg);

        public event MsgHander OnMsgHander;



        public UserMain()

        {

            InitializeComponent();

        }



        /// <summary>

        /// 连接到WEB通信服务器，同时开启接收消息线程

        /// </summary>

        /// <param name="ip"></param>

        /// <param name="port"></param>

        /// <returns></returns>

        public int Conn(string ip, int port)

        {

            int result = 0;

            IPEndPoint iep = new IPEndPoint(IPAddress.Parse(ip),port);

            client = new Socket(AddressFamily.InterNetwork, SocketType.Stream, ProtocolType.Tcp);

            try

            {

                client.Connect(iep);

                result = 1;

                Thread nowThread = new Thread(new ThreadStart(ReciveData));

                nowThread.Start();

            }

            catch

            {

                result = 0;

            }

            return result;

        }



        //发送消息给WEB服务器

        public void Send(string msg)

        {

            try

            {

                byte[] data = Encoding.UTF8.GetBytes(msg);

                client.Send(data);

            }

            catch (Exception ex)

            {



            }

        }



        /// <summary>

        /// 接收WEB服务器发来的消息

        /// </summary>

        private void ReciveData()

        {

            int res;

            while (true)

            {

                try

                {

                    byte[] bytes = new byte[1024];

                    res = client.Receive(bytes);

                    string msg = Encoding.UTF8.GetString(bytes, 0, res);

                    OnMsgHander(msg);

                }

                catch (Exception ex)

                {



                }

            }

        }

    }

 第五步：Web页面连接及接收发送数据

<object id="ocx" classid="clsid:8366F83A-F207-4B41-ACD1-49A3EBAFE192">

</object>

 前台脚本编写，代码如下：

	<script for="ocx" language="JavaScript" event="OnMsgHander(s)">

		if(document.getElementById("txtAllMsg").value == ""){

			document.getElementById("txtAllMsg").value = s;

		}

		else{

			document.getElementById("txtAllMsg").value += "\r\n"+ s;

		}

   </script>

   <script type="text/javascript">

		function onLogin(){

			var user = document.getElementById("txtUserName").value;

			var pswd = document.getElementById("txtPswd").value;

			if(user==""||pswd==""){

				alert("请输入用户名及密码！");

				return;

			}

			document.getElementById("divMax").style.display="none";

			document.getElementById("txtUser").value = user;

			document.getElementById("spanUser").innerHTML = user;

			init();

		}

		

		function init(){

			var res = ocx.Conn('127.0.0.1',2000);

		}

		

		function onSend(){

			var msg = document.getElementById("txtSendMsg").value;

			if(msg==""){

				alert("您的发送内容为空！");

				return;

			}

			var user = document.getElementById("txtUser").value;

			ocx.Send(user+":"+msg);

			if(document.getElementById("txtAllMsg").value == ""){

				document.getElementById("txtAllMsg").value = user+":"+msg;

			}

			else{

				document.getElementById("txtAllMsg").value += "\r\n"+ user+":"+msg;

			}

			document.getElementById("txtSendMsg").value ="";

		}

	</script>

 以上展示的是客户端基本结构及主要代码，下一篇主要接收服务器端主要结构及代码

源代码：WebChart.rar