微信小程序连接Mysql数据库步骤 小程序连接数据库实例

刚开始学小程序没多久，这么一个简单的过程整了一个礼拜，关键是没人指导啊啊啊啊啊……心累，翻阅了n个书籍，查看了m个网站，亲测可以正常连接。现在终于明白了学习效率：培训班＞看视频＞自学。好啦，不多说了，进入正题！

1、数据库插入数据。Mysql数据库我没有放在本地，是放在远程服务器的，其实最终就是IP地址的问题。首先数据库里插入四条语句，如下图所示，

2、tomcat部署php。过程步骤如下，

1）首先下载php程序，是一个zip的压缩包。如下图所示，

2）将下载的php压缩包解压到tomcat的安装路径下，并重命名为php,如下图所示，

3）查看电脑中是否已安装php的方法：计算机-属性-高级设置中点击“环境变量”，添加PATH环境变量，可以添加Admin环境变量，也可以添加系统环境变量，看个人需求，将php解压路径添加到PATH中。之后打开cmd，输入php -v或 php –version，如下图所示，

4）将php路径下的php.ini-development 复制，将副本改名php.ini，之后用记事本打开php.ini。（可以看出;为其注释符）修改其中两项设置：

①去掉extension_dir = "ext"前面的“;”，并且将extension_dir = "ext"修改为绝对路径，

②cgi.force_redirect修改为0，并去掉前面的“;”，即 cgi.force_redirect = 0

如下图，

5）打开tomcat的conf文件夹。

选择context.xml文件，在<Context >加上属性privileged="true"，如下图所示，

6）仍在tomcat的conf文件夹中。

修改web.xml文件，在<web-app>中加入如下的<servlet>

插入代码如下：

<servlet>

<servlet-name>php</servlet-name>

<servlet-class>org.apache.catalina.servlets.CGIServlet</servlet-class>

<init-param>

<param-name>clientInputTimeout</param-name>

<param-value>200</param-value>

</init-param>

<init-param>

<param-name>debug</param-name>

<param-value>0</param-value>

</init-param>

<init-param>

<param-name>executable</param-name>

<param-value>D:\tomcat\php\php-cgi.exe</param-value>

</init-param>

<init-param>

<param-name>passShellEnvironment</param-name>

<param-value>true</param-value>

</init-param>

<init-param>

<param-name>cgiPathPrefix</param-name>

<param-value>WEB-INF/phpbin</param-value>

</init-param>

<load-on-startup>5</load-on-startup>

</servlet>

7）在<web-app>中加入如下的<servlet-mapping>，表示php脚本路径。

代码如下：

<servlet-mapping>

<servlet-name>php</servlet-name>

<url-pattern>/phpbin/*</url-pattern>

</servlet-mapping>

8）新建一个api.php文件，文件内容如下。

在webapps\ROOT\WEB-INF下新建一个phpbin的文件夹，并将api.php放置其中，如下图，

$sql="select * from persons";

$res=$link->query($sql);

$data=$res->fetch_all();

echo json_encode($data);

?>

api.php脚本代码如下(新建txt文件，修改后缀名为php即可)：

<?php

$link = new mysqli('10.103.20.54','root','abcdefg','test');

$link->set_charset("utf8");

if($link->connect_error){

die("连接失败：".$link->connect_error);

}

9）打开tomcat（在bin文件夹下，双击startup.bat,苹果系统双击startup.sh文件即可打开tomcat服务）。

打开浏览器，输入localhost:8080/phpbin/index.php,看到如下页面，表明配置php配置成功！

3、微信小程序端。

1）新建一个项目，在index.wxml里输入：

<view wx:for="{{data}}">

{{item}}

</view>

2）index.js里输入：

onLoad: function() {

let that = this;

wx.request({

url: 'http://localhost:8080/phpbin/api.php',

method: 'GET',

header: {

'Content-Type': 'application/json',

},

data: {

},

success: function (res) {

console.log(res)

that.setData({

data:res.data,

})

},

fail: function () {

console.log("请求数据失败");

},

complete: function () {

}

})

}

3）预览一下，成功！