上节课，我们将个人简介网站编写完成了。
这节课，要将网站发布到局域网可以访问。

不同操作系统选择不同的Web服务程序

前面课程里面有讲过不同的计算机上有不同的操作系统。
大多数人使用的Windows系统，前面的教程是树莓派Raspbian系统，学哥常用的是Mac系统。
那么在不同的操作系统上，就可能需要安装不同的Web服务器程序，来对外提供Web服务。
下面针对2种具体的代表性操作系统，详细说明应该如何安装配置Web服务程序。
分别是：Windows7、Raspbian。
Windows系统是使用人数最多的系统，Windows7是比较常用的。
树莓派电脑是前面课程中很多同学用来学习的电脑，Raspbian系统也可作为Linux的代表性。
下节课将说明如何将网站部署到阿里云的Ubuntu系统服务器上，Ubuntu也是基于Linux的，很多操作步骤和Raspbian类似。
如果有同学使用的是Mac系统，那么可以考虑安装一个虚拟机程序VMware Fusion，然后在里面安装一个Windows系统或者Ubuntu系统都可以。具体如何安装虚拟机程序，不是学哥教程的重点，因此请大家去网上搜索关键字“Mac Vmware Fusion Windows”。

Windows7系统安装phpStudy

学哥推荐phpstudy程序，可以很方便的安装配置好Web服务程序。
它包含了常见的Web服务程序包括Apache或者Nginx，和PHP，和数据库MySQL，集成在一起了。
下载地址：http://www.phpstudy.net/phpstudy/phpStudy20161103.zip
将下载好的phpStudy20161103.zip文件移动到C盘根目录下：

2-11-1.jpg

然后，鼠标右键单击，在弹出菜单里面选择【全部提取(T)...】：

2-11-2.jpg

然后，点击【提取】按钮，完成之后，看到目录C:\phpStudy20161103下面出现了几个文件：

2-11-3.jpg

然后，鼠标双击文件phpStudy20161103.exe，启动安装程序:

2-11-4.jpg

修改目标文件夹为C:\phpStudy，点击OK按钮，等待解压完成，出现确认界面：

2-11-5.jpg

点击按钮【是】，phpStudy程序将启动，会弹出防火墙确认mysqld画面：

2-11-6.jpg

点击按钮【允许访问】，然后在另外一个弹出防火墙确认Apache HTTP Server画面：

2-11-7.jpg

点击按钮【允许访问】，完成之后，可以看到phpStudy程序已经启动好了：

2-11-8.jpg

看到phpStudy程序的运行状态里面，Apache和MySQL后面是2个绿灯，则表示Web服务程序环境配置好了。
如果看到有红灯，则说明可能有问题，这时候就需要排查原因。
一般来说，可能出错的原因主要是电脑系统里面可能曾经已经安装过其它Web服务程序，占用了80端口；
或者是已经安装了MySQL数据库程序，占用了3306端口。
这时候，解决办法一般是先删除其它相关软件，然后关闭并重新启动phpStudy程序进行尝试。
如果还有错误，则需要到C:\phpStudy20161103目录下查看manual.chm文件，里面有关于常见错误的解决方案。
今后，在学习PHP和MySQL的时候，还会用到这个Web服务程序phpStudy。

将网站程序部署到phpStudy对应目录

来整理一下，前面的个人简介网站程序总共有哪些：
index.html
index.css
project1.html
project2.html
images\128128.gif
images\appkeys1.png
images\appkeys2.png
images\appkeys3.png
images\back.png
images\back1.jpg
images\background1.jpg
images\coke11.png
images\coke12.png
images\coke13.png
images\coke14.png
总共是3个html文件，1个css文件，1个images目录，images目录下有11个图片文件。
打开“文件资源管理器”程序，找到目录“C:\phpStudy\WWW”，将4个文件和images目录复制到这个WWW目录下：

2-11-9.jpg

然后，程序就部署好了，就可以打开浏览器访问啦。
打开Chrome浏览器，输入地址http://localhost/index.html就可以看到个人简介网站了：

2-11-10.jpg

可以看到，这里的localhost就是一个网络ip，相当于告诉Web服务程序，访问的是本机。
localhost只有当Web服务程序和浏览器客户端是同一台机器时才有效。
如果换了另外一台计算机，输入http://localhost/index.html就看不到网站了，因为另外一台计算机上面并没有运行phpStudy这个Web服务程序，也没有部署网站。
那么，在局域网的另外一台计算机上，应该如何通过浏览器访问这个网站呢？

局域网另外一台计算机访问网站

前面课程里有讲过，两台计算机之间要互相访问的前提是，存在物理连接，也就是能够有网络连接。
也就是2台计算机通过网络可以连接在一起。
网络连接最重要的是知道对方的地址，也就是网络IP地址。
通过另外一台计算机来访问Web服务程序，就必须知道提供Web服务程序的计算机的网络地址。
在Windows系统里面，可以通过在cmd命令行环境里面输入命令ipconfig来查看当前计算机的网络IP地址。
在phpStudy程序所在的计算机上，点击左下角的【开始】图标，然后在“搜索程序和文件”这个输入框中输入【cmd】，然后按回车键，就可以打开cmd.exe程序，在里面输入命令ipconfig回车，来查看网络IP地址：

2-11-11.jpg

可以看到，“IPv4 地址”对应就是当前计算机的网络IP地址，学哥这个网络环境是192.168.36.230。
然后在另外一台计算机上面，打开Chrome浏览器，输入网址：http://192.168.36.230/index.html，就可以看到网站了：

2-11-12.jpg

如果，访问的地址不正确，或者两个计算机并没有网络连通，可能就看不到网站了，这时候就需要检查网络。
可以在另外一台计算机上面通过在cmd命令行环境输入ping 192.168.36.230来测试是否能够网络连通：

2-11-13.jpg

如果看到回复的文字里面有，时间<x秒的信息，就说明是网络连通的。
如果看到请求超时的信息，就说明网络是不通的。这时候就要去检查网络连接或者路由器设置等等。

树莓派电脑安装Web服务程序

打开树莓派电脑的程序“LX终端”，按次序输入以下命令：
安装和启动nginx服务程序:
$sudo apt-get update
$sudo apt-get install -y nginx
$sudo /etc/init.d/nginx start

2-11-14.jpg

然后在树莓派电脑上打开【Chromium网页浏览器】，输入网址：http://localhost，可以看到如下的效果：

2-11-15.jpg

说明nginx这个Web服务程序安装和启动好了。

将网站程序部署到nginx对应目录

如果是在树莓派电脑上编写的个人简介网站程序，那么程序应该是在/home/pi这个目录下。
将前面说明的4个文件和images目录复制到/var/www/html目录下：

2-11-16.jpg

然后在树莓派电脑上打开【Chromium网页浏览器】，输入网址：http://localhost/index.html，可以看到如下的效果：

2-11-17.jpg

如果不是在树莓派电脑上编写的个人简介网站程序，但是又想将网站部署到树莓派电脑上，那么就需要利用ftp软件工具将程序代码上传到树莓派电脑上，这个可以参考第1章的课程，如何上传文件。
如果是要在另外一台计算机上面访问树莓派电脑作为主机的网站，则需要知道树莓派电脑的IP地址。
可以在树莓派电脑的“LX终端”里面输入命令ifconfig来查询树莓派电脑的IP地址：

2-11-18.jpg

然后在另外一台计算机上面访问: http://192.168.5.109/index.html，类似访问前面Windows电脑上部署的网站一样的。

测试网站

网站程序部署好了之后，就可以在另外的计算机上通过浏览器来进行测试了。
一般为了保证让尽可能多人可以正常访问我们部署的网站，需要在常用的一些浏览器程序上进行测试。
例如：IE浏览器，Edge浏览器，Chrome浏览器，Safari浏览器，Firefox浏览器。
在另外的计算机上安装好这些浏览器，然后输入网站地址，分别进行测试每一个页面，确保显示效果都是符合预期的。
这里课程的主要目的还是讲解编程，关于测试就不深入讲解了，等大家如果从事IT行业之后再进行深入学习。

课后练习

准备好100元钱放在支付宝里面，用于购买阿里云网站服务器。

往期教程

因为教程是系列教程，前后关联性非常强，请大家按照微信公众号【零基础学编程】的历史消息发布时间先后次序进行阅读。