网站搭建：从0到1搭建网站

zoukankan html css js c++ java

网站搭建：从0到1搭建网站
1 网站基本概念

网站说白了就是把一些东西放到哪里供其他人访问，并提供了一些可以交互的接口的地方。如果要实现这样一个地方首先，需要一个能放东西的地方这就是服务器。其次，我们要找到这个地方，然而有很多这样的地方，所以我们就需要给很多这样的地方标号，然后按照标号来找到这些地方，并访问。所以就有了IP地址，每个服务器都有一个唯一的IP地址，这样我们可以通过IP地址找到服务器。最后，IP地址都是一堆数字太难记了，有那么多服务器（相应的就有那么多IP地址），根据一串数字来找到服务器对于我们来说太麻烦了，根本记不住。如果有个名字就好了，比如百度的服务器可以用www.baidu.com来记那就好多了。所以就有了域名。为了我们能够用域名来找到服务器，我们需要把各个域名与服务器的IP地址映射起来来。每次当我们用域名来访问服务器的时候，就需要把域名转换为IP地址（这个过程就是DNS(Domain Name System)服务），然后通过IP地址找到服务器。

实际上这些概念实现上很复杂，分别在互联网七层协议中的不同层实现。它们之间层与层之间相互依赖。实际情况也比较复杂，比如从域名到IP的映射之间可以多个域名映射到同一个IP，这就是虚拟主机的概念。不过这些都是后话了。接下来对各个概念尽心详细的解释。

1.1 服务器概念

服务器（server）,是提供计算机服务的设备。由于服务器需要响应服务请求，并进行处理，因此一般来说服务器应具备承担服务并且保证服务的能力。

服务器的构成包括处理器、硬盘、内存、系统总线等，和通用的计算机架构类似，但是由于需要提供高可靠的服务，因此在处理能力、稳定性、可靠性、安全性、可扩展性、可管理性等昂面要求较高。

在网络环境下，根据服务器提供的服务类型不同，分为文件服务器，数据库服务器，应用程序服务器，WEB服务器等。

总的来说服务器就是能够提供服务的机器，这取决于机器上所安装的软件(服务软件)，比如：Web服务器提供Web服务（网站访问），就需要Web服务软件，如Apache、tomact等。

1.2 IP的概念

IP：Internet Protocol,网络之间互联协议。网络之间互联的协议也就是计算机网络相互连接进行通信而设计的协议。在因特网中，它是能链接到网上的所有计算机网络实现相互通信的一套规则，规定了计算机在因特网上进行通信时应当遵守的规则。任何厂家生产的计算机系统，只要遵守了IP协议就可以与因特网互联互通。IP地址具有唯一性。

1.3 域名

域名（Domain Name）,是由一串用点分隔的名字构成（www.baidu.com）的Internet上某一台计算机或计算机组成的名称，用于在数据串数时标识计算机的电子方位（有时也指地理位置，地理上的域名，指代有行政自主权的一个地方区域）。域名时一个IP地址上的“面具”。一个域名的目的是便于记忆和沟通的一组服务器的地址（网站，电子邮件，FTP等）。域名作为力所能及难忘的互联网参与者的名称。

1.4 DNS

DNS(Domain Name System，域名系统)，因特网上作为域名和IP地址相互映射的一个分布式数据库，能够是用户更方便的访问互联网，而不用去记住能够被机器直接读取的IP数串。通过主机名，最终得到该主机名对应的IP地址的过程叫作域名解析（或主机名解析）。

1.5 端口

端口（Port），可以认为设备与外界通讯交流的出口。主要为了解决，一台服务器上有很服务程序我们访问一台服务器的时候如何判断我们要要访问那种服务程序的问题。比如网页服务(http访问)的端口都为80。端口可分为虚拟端口和物理端口，其中虚拟端口指计算机内部或交换机路由器内的端口，不可见。例如计算机中的80端口、21端口、23端口等。物理端口又称为接口，是可见端口。

2 当我们在浏览器中输入一个网址后发生了什么

前面说过域名只是IP地址的"面具"，所以当我们在浏览器中输入了域名后，首先要做的是解析域名，找到域名所对应的IP地址。这个时候浏览器会先访问本地DNS服务。说白了就是在本地电脑里保存了一个文件(windows中是hosts)，该文件中记录了域名与IP地址的映射，如果你输入的域名在该文件中，则浏览器会直接访问该域名对应的IP地址所对应的服务器。如果本地DNS文件中没有该域名，则浏览器会访问DNS服务器(DNS服务器的IP地址就几个，且比较固定，比如114.114.114.114),在DNS服务器上查询该域名所对应的IP。
查到IP后，浏览器则访问该IP所指向的服务器，然后向服务器提出请求，服务器回应后，发送相应的内容到本机，显示在浏览器中。

DNS解析域名的过程和访问IP的过程中还有很多机制，这里不详细说。

3 静态网页与动态网页

3.1 静态网页及其访问过程

称为普通网页。静态网页是指编写完成后，内容就不会在变化的，不管何人何时访问，显示的内容都是一样的。如果要修改网页的内容就必须修改其源代码，然后重新上传到服务器上。一般指.html、.htm、.xml文件等。可以直接打开用浏览其查看的。其访问过程如下图（以Apache为例）：

3.2 动态网页及其访问过程

动态网页指在网页文件中除了HTML标记外，还包括一些实现特定功能的程序代码，这些程序代码使得浏览器与服务器之间可以进行交互，即服务器端可以根据客户端的不同请求动态产生网页内容。动态网页的后缀名通常根据所用的程序设计语言的不同而不同，一般为.asp、.aspx、.cgi、.php、.perl、.jsp等。动态网页可以根据不同的时间，不同的浏览器者显示不同的信息。其访问流程如下(以php为例)：

4 服务器环境搭建

因为没有购买服务器，也没有注册域名。我们计划在本地搭建一个服务器环境，把我们自己本地计算机作为一个服务器。通过本地DNS重映射域名到我们本机的IP地址（127.0.0.1）,这样和实际搭建服务器没有大的区别，唯一的区别是做这些操作水在另一个IP地址的计算机上进行的，域名也是经过注册(开通DNS服务的)，在工信部经过备案的。

这里我们选择Apache2.4服务器软件，php7语言，Mysql5.7数据库。

4.1 软件下载

Apache2.4，文件名：httpd-2.4.33-win64-VC15.zip。官方没有提供windows编译版本，这里是在pachelounge社区下载的：

https://www.apachelounge.com/download/

php7.2.6，文件名：VC15 x64 Thread Safe：

https://windows.php.net/download/

MySQL5.7.22,文件名：mysql-5.7.22-winx64（下载需要注册账号）:

https://dev.mysql.com/downloads/mysql/5.7.html#downloads

4.2 Apache安装

下载并解压文件，这里为方便管理，把Apache、php、mysql放在同一个文件夹下了。这里目录为“D:\Server\Apache”。

4.2.1 Apache目录解释

4.2.2 安装

以管理员身份启动cmd，然后进入Apache目录，调用一下命令：
```
httpd -k install -n apache
net start apache
httpd -n "apache" -t
```
以上命令分别是安装apache服务,并命名为“apache”；启动apache服务；如果启动不成功，第三行则可以查看原因。启动成功。第三行则起测试作用测试作用。运行结果如下图：

另外，卸载Apache服务方法，是以管理员身份运行cmd，然后输入：sc delete Apache().

Apache(),表示你安装的Apache服务名字，有可能是Apache，也可能是Apache2.4,是可以在安装的时候指定的。

4.2.3 配置Apache

在"D:\Server\Apache\conf"目录下有个名为"httpd.conf"的文件，用记事本打开。并修改一些内容，如下：

1、服务器根目录，ServerRoot

修改前：ServerRoot "c:/Apache24"

修改后：ServerRoot "D:/Server/Apache",这个目录是Apache的安装目录，根据自己的目录做相应的修改。

2、服务名称
修改前：#ServerName www.example.com:80
修改后：ServerName localhost:80
3、Apache默认网站目录

修改前：DocumentRoot "c:/Apache24/htdocs"

修改后：DocumentRoot "D:/Documents/MyProjects/Web/"，这个目录是自己网页文件的放置目录，就是网站文件都在该文件夹下。是自己定义的。

4、修改根目录选项

修改前：
```
<Directory "c:/Apache24/htdocs">

    Options Indexes FollowSymLinks

    AllowOverride None

    Require all granted

</Directory>
```
修改后：
```
<Directory "D:/Documents/MyProjects/Web/">

    Options Indexes FollowSymLinks

    AllowOverride None

    Require all granted

</Directory>
```
4.2.4修改本地DNS映射

在文件夹"C:\Windows\System32\drivers\etc"下面有个名为hosts的文件，用记事本打开，并添加如下一行：
```
127.0.0.1 localhost
```
这里是告诉浏览器，把localhost这个域名映射到IP地址为127.0.0.1的服务器，而127.0.0.1指向的服务器就是本机。

4.2.5 启动Apache,并测试

在Apache网站根目录里放入html文件，这里为"D:/Documents/MyProjects/Web/"，就是在4.2.3中修改的目录。

注意，apache默认打开的文件是index.html。所以我们在"D:/Documents/MyProjects/Web/"中创建名为index.html的文件，并编辑以下内容：
```
<!DOCTYPE html>
<html lang="en">

<body>

	Hello world !
</body>
</html>
```
启动Apache，在"D:\Server\Apache\bin"下有个名为ApacheMonitor.exe的程序，可以通过它来管理Apache的启动、关闭与重启。双击，启动后在任务栏右下角有个图标，左击然后启动Apache服务。

在浏览器地址栏输入："http://localhost/"结果如下：

4.3 php安装

下载并解压文件，这里放的目录为：“D:\Server\php”，php目录介绍如下图：

4.4 mysql安装

mysql安装要注意有两个目录，一个是mysql本身的安装目录，另一个是mysql中数据存放的目录。为方便管理这两个目录放在了同一个目录下:

mysql的安装目录："D:\Server\mysql"
mysql的数据存放目录：“D:\Server\mysql\data”

1、把文件解压到"D:\Server\mysql" ，然后在该文件夹中创建data目录。mysql目录介绍如下图：

2、把“D:\Server\mysql\bin”，添加到环境变量，为了方便在cmd中调用mysql命令，否则每次调用mysql命令都要输入路径，或者先通过cmd进入该文件夹。

3、创建mysql配置文件
在目录"D:\Server\mysql" 中创建"my.ini"文件，内容如下：
```
[client]
port=3306
default-character-set=utf8
[mysqld]
port=3306
character_set_server=utf8
basedir=D:/Server/mysql
datadir=D:/Server/mysql/data
```
4、初始化数据库
```
mysqld --initialize
mysqld -install MySQL
net start MySQL
```
其中命令依次为，初始化数据库，安装数据库服务，启动数据库服务

5、修改数据库密码
在“D:\Server\mysql\data” 文件夹下有个名字为xxxxxx.err的文件夹，"xxxxxx"是计算机名。找到该文件并打开，找到"[Note] A temporary password is generated for root@localhost: "。改行后的是初始化数据库root账号的默认密码，我们就是要修改该密码：
```
mysql -u root -p
Enter password: ***********
set password for root@localhost = password('新密码');
```
注意：修改数据库密码命令后面的';'不能丢。如果想退出mysql，则输入quit，回车就可以了。
如下图：

4.5 Apache配置php

我们刚才只是把Apache、php、mysql安装了，它们之间兵们有什么关系，我们需要让他们协同起来一起工作。Apache需要调用php服务，php需要调用mysql服务。先Apache配置php。
1、构造php配置文件
在目录"D:\Server\php"中有个名为php.ini-development的文件，复制一份，并重命名为php.ini，放在该文件夹中。这个是php的配置文件。
2、修改Apache配置文件
打开httpd.conf文件，目录为"D:\Server\Apache\conf",在里面添加如下几行：
```
PHPIniDir "D:/Server/php/"
LoadModule php7_module "D:/Server/php/php7apache2_4.dll"
AddType application/x-httpd-php .php .html .htm
```
第一行是加载php配置文件，第二行是加载php中的一个动态链接库，第三行是把后缀名为.php、.html、.htm的文件交给apache来处理。

到此apache已经配置完php了，现在apache已经可以解析php文件了。在Apache网站根目录里创建一个名为index.php的文件，并编写以下内容:
```
<?php
phpinfo();
?>
```
重启apache。注意：所有对apache配置后都需要重启apache后才能生效。并在浏览器地址栏输入“http://localhost/index.php”,如下图：

4.6 php加载MySQL

用记事本打开php.ini文件，这里目录为"D:\Server\php"

添加如下几行：
```
extension_dir = "D:/Server/php/ext"
extension=php_mysqli.dll
extension=php_pdo_mysql.dll
```
第一行是设置php扩展模块的目录，第二行和第三行都是加载mysql的动态链接库。

到此，php已经可以链接数据库，并访问数据库了。在Apache网站根目录里创建一个名为index.php的文件，并编写以下内容:
```
<?php

$host = "127.0.0.1"; //mysql主机地址
$user = "root"; //mysql 登录账户
$pwd = "你自己的mysql密码"; //mysql登录密码
$conn = new mysqli($host, $user, $pwd); //连接数据库
if (!$conn) {//判断
    echo '连接数据库失败: ' . mysql_error();
}
echo "mysql 连接成功！";
mysqli_close($conn); // 关闭mysql连接

?>
```
重启apache。注意：所有对apache配置后都需要重启apache后才能生效。并在浏览器地址栏输入“http://localhost/index.php”,如下图：

到此网站服务器环境已经配置完成了，只要在apache网站默认目录中放入网站的代码就可以了。

5 虚拟主机设置

之前说过多个域名可以映射到同一个服务器，也就是说一个服务器是可以同时挂在多个网站的。只要域名解析到该服务器，apache会把域名映射到一个文件夹中，也就是说这里的一个域名所对应的只是服务器上的一个文件夹而已。这里可以想想，如果apache(或者其他的自己开发的web服务软件)不是把域名映射到一个文件夹，而是映射到一个IP的话，这应该就是我们购买服务器时候说的公网IP和内网IP中的内网IP了把。而安装web服务软件的把域名映射到新IP的那个服务器的IP应该就是公网IP了。言归正传，设置虚拟主机主要还是apache配置问题，步骤如下：

1、加载httpd-vhosts.conf文件

打开httpd.conf文件，并找到Virtual hosts一项如下图：

把#Include conf/extra/httpd-vhosts.conf，前的"#"删除，表示加载httpd-vhosts.conf这个文件。

2、修改httpd-vhosts.conf文件
打开httpd-vhosts.conf文件，目录在 "D:\Server\Apache\conf\extra",把原来的内容删除掉，添加如下：
```
<VirtualHost *:80>
    DocumentRoot "D:/Documents/MyProjects/Web"
    ServerName localhost
    <Directory "D:/Documents/MyProjects/Web">
	Options Indexes FollowSymLinks
	AllowOverride None
	Require all granted
    </Directory>
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "D:/Documents/MyProjects/BlogWeb"
    ServerName www.denverBlog.com
    <Directory "D:/Documents/MyProjects/BlogWeb">
	Options Indexes FollowSymLinks
	AllowOverride None
	Require all granted
    </Directory>
</VirtualHost>
```
其中第一个是apache的默认目录，如果加载了httpd-vhosts.conf文件必须则必须在httpd-vhosts.conf中添加默认目录的部分，否则默认目录不能访问。

第二个则是我们添加的另一个虚拟主机的目录，其中

DocumentRoot ：表示该虚拟主机的文件目录；

ServerName：表示该虚拟主机的域名。
<Directory "D:/Documents/MyProjects/BlogWeb">：则是该虚拟主机目录的访问权限设置。这里我们是直接从httpd.conf文件文件中复制过来的。

3、给虚拟主机添加本地DNS映射
我们虚拟主机的域名为www.denverBlog.com，正常情况下这个域名是经过注册和备案后指向我们购买的服务器的IP的，但是我们没有服务器，也没有注册域名，还是指向本地计算机。所以我们在本地DNS中添加www.denverBlog.com映射到本地ip：127.0.0.1。操作方法和4.2.4中一样：

在文件夹"C:\Windows\System32\drivers\etc"下面有个名为hosts的文件，用记事本打开，并添加如下一行：

127.0.0.1 www.denverBlog.com

到此我们就可用通过域名www.denverBlog.com来访问“D:/Documents/MyProjects/BlogWeb”文件下的网页内容了。要注意在实际的网站中，这个文件夹和apache文件夹都是在服务器上的，也就是说我们在一个服务器中创建了两个网站，通过两个域名分别来访问它们。而对于服务器和apache来说，这两个网站只是服务器上的两个目录而已。同样的我们可以用这种方式创建n个虚拟主机，不过要考虑到apache的处理能力。

然后重启apache，就可以正常使用了。注意：所有对apache配置后都需要重启apache后才能生效。

4、测试

在"D:/Documents/MyProjects/BlogWeb"中创建一个php文件，并编辑如下内容：
```
<?php
        echo "Hellow world";

        $host = "127.0.0.1"; //mysql主机地址
        $user = "root"; //mysql 登录账户
        $pwd = "scu@hzq159786"; //mysql登录密码
        $conn = new mysqli($host, $user, $pwd); //连接数据库
        if (!$conn) {//判断
            echo '连接数据库失败: ' . mysql_error();
        }
        echo "mysql 连接成功！";
        mysqli_close($conn); // 关闭mysql连接

        phpinfo();
?>
```
在浏览器中输入http://www.denverblog.com/，结果如下：
查看全文