服务器端

服务器端概念

服务器端：简单来说就是一台PC机
1. 生活中使用的是微型机
2. 商业/国家中使用 小型机（大概造价几十万，好的就上百万） 中型机 大型机 超级计算机（国家：天河一/二号、神威太湖之光）
拥有服务器的方式：
1. 买 - 对小型公司来说成本太高
2. 买一台配置好一点的微机 - 对于小型公司推广有用，但是一天同时的访问不能太大
3. 租云服务器端 - 腾讯云/阿里云/新浪云/百度云... - 配置自选的，价格不定
对于开发人员来说
1. 硬件服务器 - PC机
2. 软件服务器 - 中间件（软件可以将你的电脑变为一个台服务器，其他人可以访问）
软件架构：
1. C/S - Client客户端/Server服务器端
  - 举例：QQ、大型网络游戏
  - 优点：用户体验较好、运行稳定、对带宽的要求低
  - 缺点：占硬盘空间、更新过于复杂（务器和客户端都要更新）
2. B/S - Browser浏览器端/Server服务器端
  - 举例：网页版QQ、网页游戏
  - 优点：几乎不占硬盘、更新简单（只需要更新服务器端）
  - 缺点：体验感相对较差（越来越好）、对带宽的要求较高

XAMPP软件

XAMPP软件 - 中间件

安装步骤：双击打开 -> 一路点下去

TOMCAT

TOMCAT - 用于运行java环境的服务

Apache

Apache - 用于运行PHP环境的服务

常见错误及解决办法：
1. 直接弹出一个警告框，你的电脑里缺少api-ms-win-crt-conio-l1-1-0.dll文件
  
  解决：下载该文件并粘贴到c:/windows/sysWow64/里面
2. 错误日志：error：apache shutdown unexpectedly - 端口号被占用了
  
  解决：打开：D:\xampp\apache\conf\httpd.conf文件，查找：ctrl+F：listen 80，随意换为4位数
  
  建议：能用默认端口就不要修改，因为默认端口可以省略不写
3. 切忌安装时一定要安装在盘符下，不可以安装在某个文件夹内
4. 如果以上三种解放方案都不行，说明系统问题-重装系统
如果你的apache成功开启，恭喜你，你的服务器已经开启了（私网）
如何访问apache服务器：其实apache控制着一个文件夹：D:\xampp\htdocs
1. 打开浏览器，地址栏输入：127.0.0.1:端口号或localhost:端口号
2. 搭建一个自己的服务器端应用：
  
  把你的任意一个项目，复制到D:\xampp\htdocs，把之前的东西删掉
3. 其他人也可以来访问了：打开cmd输入ipconfig回车查看ip地址，其他私网的人浏览器输入你的ip就可以访问了
添加网页小图标：
1. 将小图标图片重命名为：favicon.ico
2. 放到D:\xampp\htdocs
修改顶级域名：- 假象（没花钱，只有自己用）
1. 打开C:\Windows\System32\drivers\etc\hosts
2. 在最后添加 127.0.0.1 你想要的域名
3. 不能和其他网站冲突，否则会报错

MySQL

MySQL - 数据库产品

关系数据库 - 以表格为主
- Oracle - Oracle（甲骨文）主要应用于企业级开发市场
- MySQL - Oracle（甲骨文）主要应用于互联网开发市场（中小型公司的首选）
- sql server - 微软主要应用于大学讲课
非关系型数据库 - 没有固定格式的
- 是一种运动 - 反关系型数据库
- 主流产品 - mongoDB

MySQL基本内容

访问：
1. 图形化界面（更简单更方便）
  
  要求：同时打开mysql和apache
  
  访问：127.0.0.1:端口号/phpmyadmin或localhost:端口号/phpmyadmin
2. 命令行方式
  - 如何进入数据库：
  1. 打开cmd
  2. 输入：cd d:/xampp/mysql/bin 回车
  3. 登录：mysql -uroot -p 回车不要加分号
  4. 退出：exit

SQL语句

SQL语句：关系型数据公用的SQL语句

数据库：
1. 创建数据库：CREATE DATABASE IF NOT EXISTS 数据库名称 CHARACTER SET utf8;
2. 查看数据库：SHOW DATABASES;
3. 切换数据库：USE 数据库名称;

数据表：

数据库的数据类型：
- 数值：
  
  Int-整型
  
  Float/Double-浮点型
  
  DECIMAL-精确值
- 字符串：
  
  CHAR - 长度固定的
  
  VARCHAR - 长度可变的
- 日期：
  
  DATE - YYYY/MM/DD
  
  DATETIME - YYYY/MM/DD hh:mm:ss
  
  TIMESTAMP - 时间戳（标识：唯一不重复的）
创建数据库表：

    语法：
        CREATE TABLE 表名(
            字段名 数据类型,
            ...
        );

    举例：
        CREATE TABLE user(
            id INT PRIMARY KEY AUTO_INCREMENT,
            name VARCHAR(30),
            pwd VARCHAR(30),
            email VARCHAR(30),
            vip VARCHAR(1)
        );

        主键约束：PRIMARY KEY
        主键自增：AUTO_INCREMENT

数据：4句以后最常用的操作
1. 增：INSERT INTO 表名 VALUES(字段值,...);
  
  举例：INSERT INTO user VALUES(0,"鲁俊杰","123123","ljj@qq.com","1");
2. 删：DELETE FROM 表名 WHERE id=几;
  
  举例：DELETE FROM user WHERE id=3;
3. 改：UPDATE 表名 SET 字段名=字段值,... WHERE id=几;
  
  举例：UPDATE user SET name="雍燕",email="yongyan@qq.com" WHERE id=4;
4. 查：3种语法：
  
  SELECT * FROM 表名;，获取此表所有的数据
  
  SELECT * FROM 表名 WHERE id=几;，获取id为几的那一条数据
  
  SELECT 字段名,... FROM 表名;，获取此表所有的对应的字段值

PHP

PHP：最简单的一门后端语言

火爆架构：LAMP

php文件后缀名.php

如何运行php文件：
- 打开apache，并且将你的项目放到htdocs文件夹中，打开浏览器输入：127.0.0.1:端口号，打开你需要的文件
- 注意：其实PHP文件也支持前端代码和PHP代码，上网时看到网页后缀.php也不必惊讶
PHP语法基础：
1. 输出方式：
  
  echo(想要输出的内容); 或 echo 想要输出的内容;，只能输出4种标准类型，不能输出别的
  
  var_dump(想要输出的内容);，输出数据类型和值
  
  缺点：输出的太过完整，以后PHP只要输出在页面上的东西，都会被前端使用ajax拿走
2. 变量和常量：
  - 变量：值可以改变
    
    语法：$变量名=值;
    
    注意：使用时$也不能省略
  - 常量：值一旦创建，不可以改变
    
    语法：const 常量名=值;
3. 数据类型：
  - 四种标准/基础类型：
    1. 整型：Int
    2. 浮点型：Float/Double
    3. 布尔：Boolean
    4. 字符串：String
      
      单引号：直接放纯文本
      
      双引号：支持放入变量，举例：echo "我的名字叫{$name}今年{$age}岁喜欢{$hobby}";
  - 两种复合类型：
    1. Array - 数组
      1. 创建：
        
        直接量：$arr=[值1,....]; - 索引数组
        
        内置函数：$arr=array("key"=>value)
      2. 访问：$数组名[下标/"自定义"]
      3. 遍历：循环
    2. Object - 面向对象
  两种特殊类型： 1、Resource - 资源类型：连接上数据库才会看到 2、Null - 释放内存 "" - 有值，值为空 null - 没有
4. 运算符：除了一个不同与js——字符串的拼接使用的是.
5. 分支：和js完全一样
6. 循环：和js完全一样
7. 函数：和js完全一样
8. API：理论上和js完全一样，但是操作却不同，百度搜索相应API即可

全栈

前端->后端

前端需要发起请求：

表单请求提交
- 注意：
  1. input必须添加name属性，input、textarea、select&option还要添加value属性
  2. form表单必须添加action="服务器端文件的路径";
  3. method到底用get还是post，和后端沟通（安全性为主），只负责发送，不负责保存
服务器端需要接收住前端传来的请求消息
- 语法：$_GET/POST/REQUEST["input的name的值"];
- 注意：REQUEST能接住一切请求不管是get还是post

后端<->数据库

后端<->数据库：PHP自带操作MySQL数据的API，只需要学习4句话

创建出连接数据库对象
- 语法：$conn=mysqli_connect("hostname","username","userpwd","dbname");
- 立马为数据库传输设置中文编码，语法：mysqli_query($conn,"SET NAMES utf8");
创建SQL语句：
- 语法：$sql="INSERT/DELETE/UPDATE/SELECT";

某个数据库要执行某个操作

语法：$rs=mysqli_query($conn,$sql);

注意：

$rs对于增删改操作，是一个布尔值，true->成功，false->失败
$rs对于查操作：是一个结果集：

将结果集变为数据
    mysqli_fetch_row($rs)//一次只能得到一行的数据，是一个索引数组
    mysqli_fetch_assoc($rs)//一次只能得到一行的数据，是一个hash数组  
    固定套路：
        while(($row=mysqli_fetch_assoc($rs))!=null){
        $row;//当前行数据
    }

断开和数据库的连接
- 语法：mysqli_close($conn);

扩展：

隐藏作用域：<input type="hidden" name="hide" value="登录" />，不是给用户看/输入，而是用于提交时后端判断执行不同代码的

ajax

同步交互和异步交互

同步：客户端向服务器端发送请求直到服务器端进行响应的全过程，用户只能等待
- 举例：网址提交、表单提交
异步：客户端向服务器端发送请求直到服务器端进行响应的全过程，用户不必等待
- 举例：ajax
js中的异步的技术：

定时器：就算定时器里面的操作再耗时，也不会影响后续代码，用户也能看到后续代码的效果

ajax

ajax：asynchronous javascript and xml：直译：异步的javascript和xml

好处：
1. 不会让用户等待
2. 不用刷新页面也能和服务器端进行交互（比表单强）
3. 将服务器端的数据获取到前端页面
使用步骤：4步
1. 创建ajax核心对象xhr
  
  语法：var xhr=new XMLHttpRequest();
2. 创建和服务器端的连接
  
  语法：xhr.open("GET/POST","xx.php");
3. 向服务器端发送请求消息
  
  语法：xhr.send()
  
  注意：
  - GET方式，xhr.send失效，还不能省略，必须写为xhr.send(null)，请求消息需要拼接到url?后面
    
    语法：xhr.open("GET","xx.php?key=value&key=value...");xhr.send(null);
  - POST方式，xhr.send可用，在之前设置请求头部
    
    语法：xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");xhr.send("key=value&...");
4. 绑定监听状态改变事件
```
xhr.onreadystatechange=()=>{
    if(xhr.readyState==4&&xhr.status==200){
        xhr.responseText;//php放在页面上的东西 - 服务器端响应的消息
    }
}   
```

XML数据格式：

面试题：HTML、XHTML、DHTML、XML分别是什么？
	HTML - 网页（预定义标签）
	XHTML - 更严格的网页
	DHTML - 动态效果的网页：并不是新技术，只是统称：HTML+CSS+JS(dom)
	XML - 配置文件|数据格式 - 现在几乎没人使用，因为最流行的是JSON - 未知的标签语言（没有任何一个预定义的标签，所有标签都需要你自定义）

如何使用：

创建后缀名.xml的文件
声明头部：（version：版本只能用1.0，还有1.1，但是1.1版本几乎无人使用，所以1.0是目前唯一的版本，而且以后都不用学习新的了），encoding：设置中文编码
创建一个根标签：必须是双标签，只能有一个 - 标签名你随意
里面想放什么标签，你随意
打开查看：apache打开，依然使用服务器端方式进行访问
前端依然使用ajax获取xml数据：

语法：
    不同于json：
    url->"xx.xml";
    xhr.reponseText->xhr.responseXML;

    var xhr=new XMLHttpRequest();
    xhr.open("GET","01我们的第一个xml文件.xml");
    xhr.send(null);
    xhr.onreadystatechange=()=>{
        if(xhr.readyState==4&&xhr.status==200){
            var dom=xhr.responseXML;//返回的dom我们可以使用核心DOM进行解析数据
        }
    }

XML缺点：解析数据过于繁琐

JSON数据格式：Javascript Object Notation：js对象表示法

作用：数据格式 - 文本数据，比XML更简洁，更快，更容易解析

认识【JSON字符串】：
- '[1,2,3,4,5]';
- '{"name":"代老湿"}';
- '[{},{},{},{}]';
- '{"names":[姓名1,姓名2,...],"age":[年龄1,年龄2,...]}'
服务器端如何将数据变为JSON字符串：
- PHP：echo JSON_encode($arr);
- Node：JSON.stringify(arr);
前端如何将JSON字符串拿到变为JSON对象：
- eval("("+json字符串+")");
- JSON.parse(json字符串);

扩展

百度地图：

使用步骤：

打开百度搜索百度地图开放平台
注册/登录百度账号
拉到最下面注册成为开发者
来到控制台->应用管理->我的应用->创建应用
应用的名称随意->浏览器端应用->白名单：填入*
成功获取到百度提供的密钥
打开导航条里面的开发文档->javascript API->示例DEMO
挑选你喜欢的百度地图：梭代码->改文字，改经纬度
特殊：百度地图更新分为：普通地图和 GL版地图两者不能混搭使用，其余都可以

jQuery简化ajax

第一层：语法稍显复杂，但功能强大

语法：
        $.ajax({
		"url":"xx.php",//连接服务器端的地址，【必写】
		"type":"GET/POST",//请求的类型，默认值为get - 可选
		"data":"key=value&...",//请求的消息 - 可选
		"dataType":"HTML/JSON/XML/JSONP",//解析响应消息
                "jsonp":"callback",//通行令的名字
		"success":(data)=>{//ajax请求成功，才会执行，并且返回得到的数据，【必写】
			data;//服务器端返回的响应数据
		},
		"error":()=>{
			//只有报错后才会执行 - 直接不写，不需要记忆
		}
	});

第二层：简化第一层：3个API - 不能做跨域

语法：
	1、$("xx").load("xx.php","key=value",data=>{

	    })
            缺点：1、会将数据直接放到页面元素之中，document.write将页面元素给替换掉
                  2、无法设置请求类型，只能是默认的GET
                  3、无法将字符串转为json数据
	
	2、$.get("xx.php","key=value",data=>{

	   },"JSON")

	3、$.post("xx.php","key=value",data=>{

	   },"JSON")

第三层：特殊功能 - 跨域（拿别人电脑上的数据）

浏览器具有保护策略 - 同源策略：要求协议、域名、端口号必须相同，只要有一个不同就会触发此保护机制
跨域jQuery使用到了一个叫jsonp技术

跨域语法：
	  前端：
	  $.getJSON("url?key=?","data",data=>{
		//key=? - jQuery自动传入一个值，其实是一个函数，后端需要接住后在调用：通行令函数
	  })

	  后端：echo $_GET["key"]."(".JSON_encode($arr).")";

目的：
1. 简化版ajax
2. 如何使用ajax去拿去别人电脑上的数据

4、滚动监听触发ajax

举例：
    前端：
        var count=0;
        $(window).scroll(()=>{
            var sh=$(window).scrollTop()+innerHeight;//获取当前滚动条滚动到底部的位置
            var bh=$("body").height();//完整的页面的高度
            if(sh==bh){
                $.get("05server.php",`count=${count}`,data=>{
                    //拿到data你要干啥子
                    count+=2;
                },"JSON")
            }
        })
        
    后端：
	$sql="SELECT * FROM 表名 ORDER BY id DESC LIMIT 开始下标,个数;";

服务器端技术速成之路——01

服务器端

服务器端概念

XAMPP软件

TOMCAT

Apache

MySQL

MySQL基本内容

SQL语句

PHP

全栈

前端->后端

后端<->数据库

ajax

同步交互和异步交互

ajax