有段时间没有发表文章了，这篇文章是本人从自己微信公众号截出来的，用以弥补一下空白，哈哈。
PHP开发环境有很多，这里用我的来讲，笔者用的是PhpStorm+Xampp,
image
image
先打开XAMPP，这是平台环境，需要使用它集成的apache和mysql。
打开XAMPP后启动apache和mysql
image
运行mySql
image
点击Shell运行工具，登陆命令:mysql -u root -p，root是开始时默认的用户名，默认用户密码为空。
image
由于mysql后面被并购了，所以后面的版本是MariaDB,但是MariaDB保留了Mysql的功能，所以Mysql的操作还是行的通的。
image
show databases，显示所有数据库，这里笔者已经创建好数据库test了。创建命令是CREATE DATABASE test;创建表是CREATE TABLE。
对于不了解数据库操作的也可以使用视图化操作，浏览器输入：http://localhost/phpmyadmin/会打开管理视图。
image
test数据库websites表的结构如下图，因为xampp的mysql的表结构设置不了自增长id，所以笔者是用sql命令创建的。读者可以不设置id。
image
下面讲解php代码连接，一般ajax连接另一个地址会报错：跨域错误，这是一种保护行为，不让外部代码轻易访问公司数据库。我们自己访问就需要做一个跨域，跨域有很多种方法，这里说的仅是PHP后台设置可跨域：就是在头部加入
header("Access-Control-Allow-Origin:*");*代表所有网站都可以访问，也可以设置固定地址。
笔者的PHP代码有详细注释，所以这里直接贴代码了。
<?php
header("Access-Control-Allow-Origin:*");//此处使网站可以进行跨域访问
header("Content-Type:application/json;charset=UTF-8");
//此处声明返回的是json类型及字符集为utf-8
$servername = "localhost"; //服务器
$username = "root"; //用户名
$password = ""; //密码
$dbname = "test"; //数据库
// 创建连接
$conn = new mysqli($servername, $username, $password,$dbname);
//设置编码，防止中文混乱
$conn->query("set names 'utf-8'");
// 检测连接
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
// 创建数据库查询语句
$sql = "select * from websites";
//接收查询结果
$result = $conn->query($sql);
$json ="";
$data =array(); //定义好一个数组.PHP中array相当于一个数据字典.
//定义一个类,用到存放从数据库中取出的数据
class websites
{
public $weibsitename ;
public $weibsiteurl ;
public $country ;
}
if (isset($_POST['code']) && $_POST["code"] == 1){ //如果code存在且等于1,创立条件，这只是个简单的例子，所以用code==1来判断
//判断是否存在数据
if($result->num_rows > 0){
//依次按字段遍历取出元素
while($row = $result->fetch_array()){
$websites =new websites();
$websites->websitename = $row["name"];
$websites->websiteurl = $row["url"];
$websites->country = $row["country"];
$data[]=$websites;;
}
$json = json_encode($data);//把数据转换为JSON数据.
echo "{".'"data"'.":".$json.",".'"code"'.":".'"1"'."}"; //输出数据格式
}
else{
echo "查询到0结果";
}
}
else{
echo "{".'"errorcode"'.":".'"0"'."}"; //如果传入的参数不对，则返回{'errorcode':0}实际应用也可以加msg：参数不对
}
?>
这样后台Php代码就写完了，前端先写一个表格，比如我要取数据库第二列数据。HTML代码和js代码如下，有点懒，就没写css了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-1.10.1.min.js"></script>
</head>
<body>
<table border="1" cellpadding="0" cellspacing="0">
<tr>
<th>网站名</th>
<th>url</th>
<th>国家</th>
</tr>
<tr>
<td id="webName"></td>
<td id="url"></td>
<td id="country"></td>
</tr>
</table>
</body>
<script>
$(function(){
$.ajax({
url:"http://localhost/conMysql.php",
data:{"code":"1"},
dataType:"json",
type:"post",
success:function(res){
if(res.data){
$("#webName").text(res.data[1].websitename);
$("#url").text(res.data[1].websiteurl);
$("#country").text(res.data[1].country);
}
else if(res.errorcode == 0){
alert("传入参数错误");
}
},
error:function(){
console.log("网络异常");
}
})
});
</script>
</html>
数据格式为json，传入参数为code:1。运行结果如下：
image
Php的地址跟这个不一样，形成跨域(PS:这里之前的图弄错了，没有设置端口号，正确的形成跨域应该改个80以外的端口号)
image
用network可以查看到取得的数据：
image
接收到的完整数据：(ps:network的response太长，不好截图)
image
