快速上手wap网站开发

本文介绍了使用VS2008进行WAP网站开发的步骤,包括配置环境、数据库搭建、创建登录和文章分页显示页面。重点提及了ASP.NET Mobile Templates的使用和Mobile控件的特性,适合初学者参考。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 

近来工作比较紧张,一直想写一些东西,无奈没有时间,现在开发的市移动wap论坛终于告一段落,现在将开发过程简单记录一下,以备日后参考,都是一些简单的使用过程,可为初次接触wap开发的提供一点点参考,高手可以忽略。

  开发工具:vs2008     模拟器:vs自带仿真管理器   framework版本:2.0

一。配置环境:

     vs2008中已经没有了新建wap的选项,所需的wap模板需要从网上下载:

    下载地址:http://www.brsbox.com/filebox/down/fc/911fb64660cbf75f42146ac021d642fe,这是我的网络硬盘,下载下来是一个ASPNETMobileTemplates.rar的文件,根据里面的说明将文件拷贝到所需的文件夹。

       模拟器可用openware((官方免费注册下载地址)http://developer.openwave.com/dvl/tools_and_sdk/phone_simulator/),也可用vs自带的设备仿真器(要先安装ActiveSync,),在工具—设备仿真管理器—选择pocket pc 2003中的pocket pc 2003 se仿真器—右键点解连接,然后再右键点击插入底座,运行后即可使用,不过在仿真管理器中地址不要用local,要用本机ip地址

 

二。建立数据库:

       数据库采用sqlserver,建立一个名为wapDB的数据库,如下图:

 

      

       然后添加一个用户表userinfo,如下图:

 

 

      

       为数据库添加一条记录,如下图:

 

 

       建立表document,用来存储发布的文章,表结构如下图:

 

       先为document表添加20条数据,用来显示,如下图:

 

       至此,数据库建立完毕,下面我们将采用vs2008来具体开发。

 

三。建立工程,开始开发:

        首先,我们建立一个testWap的项目,如下图:

 

 

       将新建项目默任生成的default.aspx删除,新建一个login.aspx的mobile web form模板(在第一步环境配置中按照说明将ASPNETMobileTemplates.rar中的文件拷贝到各个文件夹后,就会在新建项目中最下面的模板中显示mobile模板了),如下图:

        建立好以后,按照上述方法再添加一个index.aspx的文件。

        至此,我们所需的文件已经全部建立完成,login.aspx用来登录,登录后到index.aspx页面,此页面用来分页显示document文章表中的内容,并且可以添加文章记录。(注意,做好网页后,需要在记事本中将我们刚才建立的login.aspx、index.aspx打开重新保存一下,保存编码改为utf-8,覆盖原文件即可,这样做是因为项目采用utf-8编码,如果不这样的话,页面含有中文的话就会显示为乱码。),如下图:

 

       然后开始编码,具体编码和asp.net中的编码过程一样,不同的就是换成了mobile控件,这里需要注意的vs下开发wap不支持可视化设计,我们只能在后台手工编码,当添加<mobile>控件的时候,只要打上<m就会出现你所需要的mobile控件,mobile控件的具体有哪些和都有什么属性请参考其他文档,日后若有时间,我会将mobile控件的使用说明详细介绍一下,这里给大家引荐一个网址,这里面有mobile控件的介绍和使用说明,http://www.wapkf.com/article/aspnet-wap/Article_005_3.html

我们这里只用到了objectlist控件和textbox、textview控件以及command、Label控件,command控件其实就是button按钮,在mobile里叫command。

       这里我们建立三个文件:

        login.aspx:登录页面

        index.aspx:分页显示文章页面,带有快速发表

        view.aspx:显示文章具体内容页面

三个页面源代码:

login.aspx     前台代码具体如下:

 

  1. <%@ Page Language="C#" AutoEventWireup="true" Inherits="testWap.login" Codebehind="login.aspx.cs" %>
  2. <%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>
  3. <html xmlns="http://www.w3.org/1999/xhtml" >
  4. <body>
  5. <mobile:Form id="Form1" runat="server">    <!--表单-->
  6.       <mobile:Label ID="z1" Runat="server" Font-Size="Large" ForeColor="#3333cc">登录窗口</mobile:Label>
  7.       <!--lbl_out:信息标签,初始隐藏,登录失败后或退出系统时显示信息-->
  8.       <mobile:Label ID="lbl_out" Runat="server" ForeColor="Red" Visible="false"></mobile:Label> 
  9.       用户名:<br />
  10.       <mobile:TextBox ID="tb_User" Runat="server" Size="10" ></mobile:TextBox><!--用户名输入框:tb_User-->
  11.       密码:<br />
  12.       <mobile:TextBox ID="tb_Pwd" Runat="server" Size="10" Password="True"></mobile:TextBox><!--密码输入框:tb_Pwd-->
  13.       <mobile:Command ID="Button1" Runat="server" OnClick="Button1_OnClick" >登录</mobile:Command><!--登录按钮-->
  14. </mobile:Form>
  15. </body>
  16. </html>

login.aspx.cs     后台代码具体如下:

  1. using System;
  2. using System.Collections;
  3. using System.ComponentModel;
  4. using System.Data;
  5. using System.Drawing;
  6. using System.Web;
  7. using System.Web.Mobile;
  8. using System.Web.SessionState;
  9. using System.Web.UI;
  10. using System.Web.UI.MobileControls;
  11. using System.Web.UI.WebControls;
  12. using System.Web.UI.HtmlControls;
  13. using System.Data.SqlClient;
  14. namespace testWap
  15. {
  16.     public partial class login : System.Web.UI.MobileControls.MobilePage
  17.     {
  18.         protected void Page_Load(object sender, EventArgs e)
  19.         {
  20.             #region 系统退出时将信息标签lbl_out赋值并且显示
  21.             if (Session["loginOutInfo"] != null)
  22.             {
  23.                 string outInfo = Session["loginOutInfo"].ToString();
  24.                 this.lbl_out.Text = outInfo;
  25.                 this.lbl_out.Visible = true;
  26.                 Session.Clear();
  27.             }
  28.             #endregion
  29.         }
  30.         /// <summary>
  31.         /// 登录验证
  32.         /// </summary>
  33.         /// <param name="sender"></param>
  34.         /// <param name="e"></param>
  35.         protected void Button1_OnClick(object sender, EventArgs e)
  36.         {
  37.             string username = this.tb_User.Text.Trim();
  38.             string userpwd = this.tb_Pwd.Text.Trim();
  39.             string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
  40.             string strSql = "select * from userinfo where user_name='"+username+"' and user_pwd='"+userpwd+"'";
  41.             SqlConnection conn = new SqlConnection(strCon);
  42.             conn.Open();
  43.             SqlDataAdapter da = new SqlDataAdapter(strSql, conn);
  44.             DataSet ds = new DataSet();
  45.             da.Fill(ds);
  46.             conn.Close();
  47.             int rowCount = ds.Tables[0].Rows.Count;
  48.             if (rowCount > 0)
  49.             {
  50.                 Session["username"] = ds.Tables[0].Rows[0]["user_name"].ToString().Trim();
  51.                 Response.Redirect("index.aspx");
  52.             }
  53.             else
  54.             {
  55.                 this.lbl_out.Text = "用户名密码错误,请重新登录!";
  56.                 this.lbl_out.Visible = true;
  57.             }
  58.         }
  59.     }
  60. }

index.aspx     前台代码具体如下:

  1. <%@ Page Language="C#" AutoEventWireup="true" Inherits="testWap.index" Codebehind="index.aspx.cs" %>
  2. <%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>
  3. <html xmlns="http://www.w3.org/1999/xhtml" >
  4. <body>
  5. <mobile:Form id="Form1" runat="server">    <!--表单-->
  6. <mobile:Label ID="lbl_uname" Runat="server"></mobile:Label>
  7. <mobile:Label ID="wt" Runat="server" Font-Size="Large" ForeColor="Red">文章列表</mobile:Label>
  8. <mobile:ObjectList ID="ObjectList1" Runat="server"><!--ObjectList控件-->
  9.   <DeviceSpecific>
  10.     <Choice>
  11.       <ItemTemplate>
  12. <mobile:Link Runat="server" Text='<%# ((ObjectListItem)Container)["doc_title"] %>' NavigateUrl='<%# "view.aspx?id="+((ObjectListItem)Container)["doc_id"]%>' ID="Title" NAME="Title" Wrapping="Wrap">
  13. </mobile:Link>
  14.       </ItemTemplate>
  15.     </Choice>
  16.   </DeviceSpecific>
  17. </mobile:ObjectList>
  18. <br />
  19. <mobile:Label id="lbl_page" runat="server" Visible="False">1</mobile:Label><!--页码:lbl_page-->
  20. <mobile:Label id="lbl_pagecount" runat="server" Visible="False">1</mobile:Label><!--总页数:lbl_pagecount-->
  21. <mobile:Link ID="lnk_top" Runat="server" BreakAfter="False">首页 | </mobile:Link><mobile:Link id="lnk_pre" runat="server"> 上一页</mobile:Link>
  22. <mobile:Link id="lnk_end" runat="server" Visible="False" BreakAfter="false">尾页 | </mobile:Link><mobile:Link id="lnk_next" runat="server"> 下一页</mobile:Link>
  23. <br />
  24. <mobile:Label id="lbl_fabu" Runat="server">发布文章:</mobile:Label>
  25. <mobile:Label ID="lbl_error" Runat="server" Visible="false" ForeColor="Red"></mobile:Label>
  26. <mobile:TextBox ID="tb_title" Runat="server"></mobile:TextBox>
  27. <mobile:TextBox ID="tb_content" Runat="server"></mobile:TextBox>
  28. <mobile:Command ID="Button2" Runat="server" OnClick="Button2_OnClick" BreakAfter="false">发表</mobile:Command><mobile:Command ID="Button1" Runat="server" OnClick="Button1_OnClick">退出</mobile:Command>
  29. </mobile:Form>
  30. </body>
  31. </html>

index.aspx.cs     后台代码具体如下:

 

  1. using System;
  2. using System.Collections;
  3. using System.ComponentModel;
  4. using System.Data;
  5. using System.Drawing;
  6. using System.Web;
  7. using System.Web.Mobile;
  8. using System.Web.SessionState;
  9. using System.Web.UI;
  10. using System.Web.UI.MobileControls;
  11. using System.Web.UI.WebControls;
  12. using System.Web.UI.HtmlControls;
  13. using System.Data.SqlClient;
  14. namespace testWap
  15. {
  16.     public partial class index : System.Web.UI.MobileControls.MobilePage
  17.     {
  18.         protected void Page_Load(object sender, EventArgs e)
  19.         {
  20.             if (Session["username"] == null)
  21.             {
  22.                 Session["loginOutInfo"] = "登录时间到,请重新登录!";
  23.                 Response.Redirect("login.aspx");
  24.             }
  25.             this.lbl_uname.Text = "欢迎您:"+(string)Session["username"];
  26.             if (Session["ok"] != null)
  27.             {
  28.                 this.lbl_error.Text = "发表成功!";
  29.                 this.lbl_error.Visible = true;
  30.                 Session["ok"] = null;
  31.             }
  32.             if (!IsPostBack)
  33.             {
  34.                 Bind();
  35.             }
  36.         }
  37.         private void Bind()
  38.         {
  39.             string rPage = Request.QueryString["Page"];
  40.             int page = 1;
  41.             if (rPage != null)
  42.             {
  43.                 try
  44.                 {
  45.                     page = int.Parse(rPage);
  46.                 }
  47.                 catch
  48.                 {
  49.                     page = 1;
  50.                 }
  51.             }
  52.             Session["page"] = page;
  53.             PagedDataSource ps = new PagedDataSource();
  54.             string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
  55.             string strSql = "select * from document order by doc_id desc";
  56.             SqlConnection conn = new SqlConnection(strCon);
  57.             conn.Open();
  58.             SqlDataAdapter da = new SqlDataAdapter(strSql, conn);
  59.             DataSet ds = new DataSet();
  60.             da.Fill(ds);
  61.             conn.Close();
  62.             ps.DataSource = ds.Tables[0].DefaultView;
  63.             ps.AllowPaging = true;
  64.             ps.PageSize = 5;
  65.             ps.CurrentPageIndex = page - 1;
  66.             this.lnk_top.Visible = true;
  67.             this.lnk_pre.Visible = true;
  68.             this.lnk_next.Visible = true;
  69.             this.lnk_end.Visible = true;
  70.             this.lnk_top.NavigateUrl = "index.aspx?page=1";
  71.             this.lnk_pre.NavigateUrl = "index.aspx?page=" + (page - 1);
  72.             this.lnk_next.NavigateUrl = "index.aspx?page=" + (page + 1);
  73.             this.lnk_end.NavigateUrl = "index.aspx?page=" + ps.PageCount;
  74.             if (page == 1)
  75.             {
  76.                 this.lnk_top.Visible = false;
  77.                 this.lnk_pre.Visible = false;
  78.             }
  79.             if (page == ps.PageCount)
  80.             {
  81.                 this.lnk_next.Visible = false;
  82.                 this.lnk_end.Visible = false;
  83.             }
  84.             if (ps.PageCount == 1)
  85.             {
  86.                 this.lnk_top.Visible = false;
  87.                 this.lnk_pre.Visible = false;
  88.                 this.lnk_next.Visible = false;
  89.                 this.lnk_end.Visible = false;
  90.             }
  91.             this.lbl_pagecount.Text = Convert.ToString(ps.PageCount);
  92.             this.ObjectList1.DataSource = ps;
  93.             this.ObjectList1.DataBind();
  94.         }
  95.         protected void Button2_OnClick(object sender, EventArgs e)
  96.         {
  97.             string title = this.tb_title.Text.Trim();
  98.             string content = this.tb_content.Text.Trim();
  99.             if (title == "" || title == null || content == "" || content == null)
  100.             {
  101.                 this.lbl_error.Text = "文章标题或内容不能为空!!";
  102.                 this.lbl_error.Visible = true;
  103.                 return;
  104.             }
  105.             string strSql = "insert document values('" + title + "','" + content + "')";
  106.             string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
  107.             SqlConnection conn = new SqlConnection(strCon);
  108.             conn.Open();
  109.             SqlCommand com = new SqlCommand(strSql, conn);
  110.             com.ExecuteNonQuery();
  111.             conn.Close();
  112.             Session["ok"] = "ok";
  113.             Response.Redirect("index.aspx");
  114.         }
  115.         protected void Button1_OnClick(object sender, EventArgs e)
  116.         {
  117.             try
  118.             {
  119.                 Session.Clear();
  120.                 Session["loginOutInfo"] = "退出成功!";
  121.             }
  122.             catch
  123.             {
  124.                 Session["loginOutInfo"] = "退出成功!";
  125.             }
  126.             Response.Redirect("login.aspx");
  127.         }
  128.     }
  129. }

view.aspx    前台代码具体如下:

 

 

  1. <%@ Page Language="C#" AutoEventWireup="true" Inherits="testWap.view" Codebehind="view.aspx.cs" %>
  2. <%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>
  3. <html xmlns="http://www.w3.org/1999/xhtml" >
  4. <body>
  5. <mobile:Form id="Form1" runat="server">
  6. <mobile:Label ID="Label1" Runat="server" ForeColor="#0000cc" >帖子内容</mobile:Label>
  7. <mobile:Label ID="z1" Runat="server" ForeColor="#0066ff"> 标题:</mobile:Label>
  8. <mobile:TextView ID="tv_title" Runat="server" Wrapping="Wrap"></mobile:TextView>
  9. <mobile:Label ID="z2" Runat="server" ForeColor="#0066ff"> 内容:</mobile:Label>
  10. <mobile:TextView ID="tv_Content" Runat="server" Wrapping="Wrap"></mobile:TextView>
  11. <mobile:Link ID="lnk_FanHui" Runat="server" BreakAfter="false">返回上层</mobile:Link> | 
  12. <mobile:Command ID="Command1" Runat="server" OnClick="Button1_OnClick">退出</mobile:Command>
  13. </mobile:Form>
  14. </body>
  15. </html>
  1. using System;
  2. using System.Collections;
  3. using System.ComponentModel;
  4. using System.Data;
  5. using System.Drawing;
  6. using System.Web;
  7. using System.Web.Mobile;
  8. using System.Web.SessionState;
  9. using System.Web.UI;
  10. using System.Web.UI.MobileControls;
  11. using System.Web.UI.WebControls;
  12. using System.Web.UI.HtmlControls;
  13. using System.Data.SqlClient;
  14. namespace testWap
  15. {
  16.     public partial class view : System.Web.UI.MobileControls.MobilePage
  17.     {
  18.         protected void Page_Load(object sender, EventArgs e)
  19.         {
  20.             if (Session["username"] == null || Session["page"] == null)
  21.             {
  22.                 Session["loginOutInfo"] = "登录时间到,请重新登录!";
  23.                 Response.Redirect("login.aspx");
  24.             }
  25.             int docid = int.Parse(Request["id"].ToString());
  26.             string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
  27.             string strSql = "select * from document where doc_id=" + docid;
  28.             SqlConnection conn = new SqlConnection(strCon);
  29.             conn.Open();
  30.             SqlDataAdapter da = new SqlDataAdapter(strSql, conn);
  31.             DataSet ds = new DataSet();
  32.             da.Fill(ds);
  33.             conn.Close();
  34.             this.tv_title.Text = ds.Tables[0].Rows[0]["doc_title"].ToString();
  35.             this.tv_Content.Text = ds.Tables[0].Rows[0]["doc_content"].ToString();
  36.             int page = (int)Session["page"];
  37.             this.lnk_FanHui.NavigateUrl = "index.aspx?page="+Convert.ToString(page);
  38.         }
  39.         protected void Button1_OnClick(object sender, EventArgs e)
  40.         {
  41.             try
  42.             {
  43.                 Session.Clear();
  44.                 Session["loginOutInfo"] = "退出成功!";
  45.             }
  46.             catch
  47.             {
  48.                 Session["loginOutInfo"] = "退出成功!";
  49.             }
  50.             Response.Redirect("login.aspx");
  51.         }
  52.     }
  53. }

以上程序完毕,这是个简单的发表分页的wap项目,比较简单,仅供参考,内容还有很多不完善之处,比如登录的验证需要完善,数据库连接可以放到config中,这里只是为了简单而写成这样的。

 

在wap开发中的一点心得:

     需将文件另保存为utf-8格式。

     wap控件每个默认后面自动分行,若想不分行需将控件的BreakAfter属性置为False。

     wap控件中的内容自动分行:Wrapping="Wrap"

 

view.aspx.cs     后台代码具体如下:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值