当前位置:   article > 正文

微信小程序通过asp.net访问sql server数据库_微信小程序连接sql server数据库

微信小程序连接sql server数据库

今天来说一下微信小程序如何通过asp.net访问sql server数据库,因为js代码不宜直接访问数据库,所以要用asp.net的网站来充当一个webapi。这是本人第一次写微信小程序开发的相关文章,不足之处难免。
  在讲正题前,不得不提到一个重要名词JSON,JSON是一种轻量级的数据交换格式。采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。相信有一定移动端开发基础的人一定对不陌生。很多第三方平台的webapi都通过JSON来共享数据,如图1,通过经纬度查询料某地的天气(网站为devapi.qweather.com,需要先注册然后申请key),返回的结果就一个JSON。
  好了,进入正题,首先我们将实现过程分三块,第一块是数据库,即数据层,第二块是webapi,通过asp.net调用数据库,将结果以json格式输出,即使业务层,第三块是微信小程序,微信小程序wx.request来访问webapi,查询数据。为了尽量简洁讲解,这里尽量简化了设计需求。
  第一块:建立数据库,在sql server上建立一个数据库,新建一张表,这里取名为Product,字段也十分简单,一个Id,用于主键,一个Name用于产品名称,一个Num用于数量。表格建立后,根据表格编写四个最基本存储过程,列出所有数据,添加数据、根据主键删除数据、根据主键修改数据、根据主键查询数据,当然也可在asp.net直接调用。
  第二块:webapi编码。打开vs.net,新建一个网站,在资源管理器添加一个新项,弹出对话框,选择一般处理程序(如图2),即扩展名为ashx,这里命名为ProductHandler.ashx。将其设为起始页,运行之,可以看到默认输出了"Hello World",一会我们对其改造。
  第一步引用一个叫“Newtonsoft.Json”的库文件,我们用它处理json。
  第二步,在web.config中配置数据库链接,也就是添加一个connectionStrings节点,具体配置如下,读者请根据实际替换Data Source、Initial Catalog等属性。

 <connectionStrings>
    <add name="WebSite" connectionString="Data Source=localhost;Initial Catalog=dbtest;User ID=sa;Password=123"/>
  </connectionStrings>
  • 1
  • 2
  • 3

第三步,新建一个类,它与刚才建立的表名对应的种子类——Product.cs,代码如下

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

/// <summary>
///Product 的摘要说明
/// </summary>
public class Product
{
    public bool IsCorrect;
    public string LastError;
    public List<XProduct> ArrXProduct;
    
    public Product()
	{
		//
		//TODO: 在此处添加构造函数逻辑
		//


	}
}

public class XProduct
{
    //与字段对应
    public int Id = 0;
    public String Name = "";
    public int Num = 0;

}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32

第四步,打开刚才的ProductHandler.ashx,对其编码如下

<%@ WebHandler Language="C#" Class="ProductHandler" %>

using System;
using System.Web;

using System.Collections.Generic;
using System.Linq;

using System.Web.Services;
using System.Data;
using System.Data.SqlClient;

using Newtonsoft.Json;

using System.Configuration;

public class ProductHandler : IHttpHandler {

    public void ProcessRequest (HttpContext context) {
        //listproduct(context);
        context.Response.ContentType = "text/plain";

        if (context.Request["op"]==null)
        {
            context.Response.Write("未知的操作参数");
            return;
        }
        string op = context.Request["op"].ToString();

        switch (op)
        {
            case "list":
                listproduct(context);
                break;
            case "add":
                Add(context);
                break;
            default:
                context.Response.Write("未知的操作参数");
                break;



        }






        //context.Response.Write(name);



    }

    public void Add(HttpContext context)
    {
        String Name = "";
        int Num = 0;
        string result = "";

        if (context.Request["name"]==null || context.Request["num"]==null)
        {
            result= "参数获取失败";
            context.Response.Write(result);
            return;
        }
        else
        {
            Name = context.Request["name"].ToString();
            Num = int.Parse(context.Request["num"].ToString(), 0);
        }



        SqlConnection conn;
        string sqlconn = ConfigurationManager.ConnectionStrings["WebSite"].ConnectionString;
        conn = new SqlConnection(sqlconn);
        try
        {
            conn.Open();
            SqlCommand cmd = new SqlCommand("p_my_ProductAdd", conn);
            cmd.CommandType = CommandType.StoredProcedure;
            SqlParameter RETURN_VALUEParam = cmd.Parameters.Add("@RETURN_VALUE", SqlDbType.Int, 4);
            RETURN_VALUEParam.Direction = ParameterDirection.ReturnValue;

            SqlParameter NameParam = cmd.Parameters.Add("@Name", SqlDbType.VarChar, 50);
            NameParam.Value = Name;

            SqlParameter NumParam = cmd.Parameters.Add("@Num", SqlDbType.Int);
            NumParam.Value = Num;

            cmd.ExecuteNonQuery();
            cmd.Dispose();
            result = "添加成功";
        }
        catch (SqlException ex)
        {

            result = ex.Message;
        }
        catch (System.Exception ex)
        {
            result = ex.Message;

        }
        finally
        {
            conn.Close();
        }


        context.Response.Write(result);
    }

    private void listproduct(HttpContext context)
    {

        context.Response.ContentType = "text/plain";
        //context.Response.Write("Hello World");
        SqlConnection conn;
        SqlDataReader dr = null;
        string result = "";
        string sqlconn = ConfigurationManager.ConnectionStrings["WebSite"].ConnectionString;

        //conn = new SqlConnection(Application["ConnectString"].ToString());
        conn = new SqlConnection(sqlconn);
        List<XProduct> ArrXProduct = new List<XProduct>();
        Product MyProduct = new Product();
        try
        {
            conn.Open();
            SqlCommand cmd = new SqlCommand("p_my_ProductList", conn);
            cmd.CommandType = CommandType.StoredProcedure;
            SqlParameter RETURN_VALUEParam = cmd.Parameters.Add("@RETURN_VALUE", SqlDbType.Int, 4);
            RETURN_VALUEParam.Direction = ParameterDirection.ReturnValue;

            MyProduct.LastError = "";
            MyProduct.IsCorrect = true;
            dr = cmd.ExecuteReader();
            while (dr.Read())
            {

                XProduct MyXProduct = new XProduct();




                MyXProduct.Id = int.Parse(dr["Id"].ToString());

                MyXProduct.Name = dr["Name"].ToString();

                MyXProduct.Num = int.Parse(dr["Num"].ToString());

                ArrXProduct.Add(MyXProduct);
            }
            MyProduct.ArrXProduct = ArrXProduct;
            dr.Close();
            cmd.Dispose();
        }
        catch (SqlException ex)
        {
            MyProduct.IsCorrect = false;
            MyProduct.LastError = ex.Message;
            ArrXProduct.Clear();
            MyProduct.ArrXProduct = ArrXProduct;


        }
        catch (System.Exception ex)
        {
            MyProduct.IsCorrect = false;
            MyProduct.LastError = ex.Message;
            ArrXProduct.Clear();
            MyProduct.ArrXProduct = ArrXProduct;


        }
        finally
        {
            conn.Close();
        }

        result = JsonConvert.SerializeObject(MyProduct); //将列表及是否正确等信息以JSON格式输出

        context.Response.Write(result);
    }


    public bool IsReusable {
        get {
            return false;
        }
    }

}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • 106
  • 107
  • 108
  • 109
  • 110
  • 111
  • 112
  • 113
  • 114
  • 115
  • 116
  • 117
  • 118
  • 119
  • 120
  • 121
  • 122
  • 123
  • 124
  • 125
  • 126
  • 127
  • 128
  • 129
  • 130
  • 131
  • 132
  • 133
  • 134
  • 135
  • 136
  • 137
  • 138
  • 139
  • 140
  • 141
  • 142
  • 143
  • 144
  • 145
  • 146
  • 147
  • 148
  • 149
  • 150
  • 151
  • 152
  • 153
  • 154
  • 155
  • 156
  • 157
  • 158
  • 159
  • 160
  • 161
  • 162
  • 163
  • 164
  • 165
  • 166
  • 167
  • 168
  • 169
  • 170
  • 171
  • 172
  • 173
  • 174
  • 175
  • 176
  • 177
  • 178
  • 179
  • 180
  • 181
  • 182
  • 183
  • 184
  • 185
  • 186
  • 187
  • 188
  • 189
  • 190
  • 191
  • 192
  • 193
  • 194
  • 195
  • 196
  • 197

到此api端的代码已经完成,再次运行网站,然后在地址配置参数op=list,可以看到查询结果已经用json的格式输出了。
  第三块内容启动微信开发者工具,新建一个项目,填写事先申请的app id,这里选择“不使用云开发”和js-基础版的模板。会自动得index和log的page,将log对应的三个文件全部删除,同时在app.json的列表将log的配置删除,删除index.wxml中的布局代码,删除index.wxss中的样式表代码,删除index.js中的无用代码,只保留onLoad等基本函数,和data,交将data定义的变量也清除,接着点击微信开发者工具右上角的详情,切换到本地设置标签,勾选“不校验合法域名”这个选项(如图3)。完成之后就以编码了(注意本文省略样式表的代码)。
  第一步,打开index.js,代码如下,注意将域名替换你自己的,下同。

// index.js


Page({
  data: {
    List:[]
   
  },
   /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.listproudct();
  },

  listproudct()
  {
    var that=this;
    wx.request({
      url: 'http://localhost:10524/ProductHandler.ashx',
      data:{
       op:"list"
      },
      success:function(res){
        console.log(res.data.ArrXProduct);
        // that.data.List=res.data.ArrXProduct;
         that.setData({
           List:res.data.ArrXProduct
         })
        for (var i=0;i<that.data.List.length;i++)
        {
          console.log(that.data.List[i].Name)
        }


      }
      
      
    
    })
  }
 
  
})
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44

第二步,打开index.wxml文件,布局代码如下

<navigator url="../addproduct/addproduct"><button type="primary">添加产品</button></navigator>

<scroll-view scroll-x="true">
  <view>
    <view class="list-item" wx:for="{{List}}" wx:for-item="prdouct">
    <text>名称:{{prdouct.Name}}数量:{{prdouct.Num}}</text>
    </view>
  </view>
</scroll-view>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

接着我们建立一个addproduct的page文件,用它向数据库添加文件,同样的也用通过wx.request来完成。
  第三步,打开addproduct.js,代码如下

// pages/addproduct/addproduct.js
var num;
var name;
Page({

  /**
   * 页面的初始数据
   */
  data: {

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },

  bindproductinput(e)
  {
    this.name=e.detail.value
  },
  bindnuminput(e)
  {
    this.num=e.detail.value
  },
  insertproduct()
  {
    var that=this;
    wx.request({
      url: 'http://localhost:10524/ProductHandler.ashx',
      data:{
       op:"add",
       name:that.name,
       num:that.num
      },
      success:function(res){
        console.log(res.data);
        wx.showToast({
          title: res.data,
        })
       

      }
      
      
    
    })
  }
})
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100

第四步,打开addproduct.wxml文件,布局代码如下

<view class="container">
<view>产品名称:<input placeholder="请输入产品名称" class="box" bindinput="bindproductinput"/></view>
<view>产品数量:<input placeholder="请输入产品数量" class="box" type="number" bindinput="bindnuminput"/></view>
<button type="primary" bind:tap="insertproduct">提交</button>
<navigator url="../index/index"><button type="primary">返回列表</button></navigator>
</view>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

在微信开发者工具自带的模拟器中运行,我们可以在index页面看到产品列表,单击添加产品按钮,跳转到addproduct,我们可以添加新产品。一个最简单的微信小程序通过asp.net访问sql server代码就完成了,当然由于是localhost,所以只能在自带的模拟器中运行,如果要用有开发者权限的手机“真机调试”,还得组建一个局域网,发布asp.net的网站,然后布置到iis中,使充当服务器的电脑和手机处于同一局域网中。如果发布到互联网,要记得登录到微信公众号管理员后台,添加自己的服务器域名到白名单。如何组件局域网,发布到互联网请读者自行参考文档。
 源码放到了csdn上。请自行下载https://download.csdn.net/download/wstcl/88938668?spm=1001.2014.3001.5501。
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/IT小白/article/detail/478814
推荐阅读
相关标签
  

闽ICP备14008679号