全栈 - 10 数据库用MAMP和WAMP搭建Web环境

时间 2019-11-15

标签数据库 mamp wamp 搭建 web 环境栏目 SQL 繁體版

原文原文链接

这是全栈数据工程师养成攻略系列教程的第十期：10 数据库用MAMP和WAMP搭建Web环境。javascript

如今人人都有本身的台式机或者笔记本，在咱们的我的电脑上搭建一个Web环境，包括Web服务器和数据库等，对后续不少开发工做而言都是很是有用的。php

Web环境

为何须要一个Web环境呢？在数据可视化中很重要的一部分，即是基于Web网站进行一些动态交互可视化，这时候便须要一个Web环境用以部署咱们的网站项目。html

一般来讲，一个Web环境中会包含如下几个组件：前端

Web服务器：例如Apache和Nginx，用于接收和处理Web请求；
数据库：最经常使用的即关系型数据库MySQL，用于存储和读取数据；
后端语言：例如PHP和Python等，用于开发Web项目。

在本地搭建并启动Web环境以后，咱们即可以在浏览器中访问根目录中的网站项目。根目录是可配置的，能够设置成我的电脑上任意目录下的文件夹。使用后端语言开发一个Web项目，将其部署在根目录下，就能够经过浏览器访问咱们的项目，进行浏览网页、数据交互等操做，就如同访问豆瓣、链家等网站同样，不一样的只是这些网站部署于外网可访问的服务器上，而咱们的网站只能在本机上访问。java

固然，咱们不用一个个单独地去安装以上说起的组件，而是像Anaconda那样，安装一个包含所有所需内容的套件便可，即XAMP。主要是MAMP和WAMP，分别对应Mac OS和Windows两大经常使用我的电脑操做系统，根据本身的操做系统选择相应的软件并下载安装便可。web

MAMP：Mac OS上的Apache、MySQL和PHP，www.mamp.info/en/；
WAMP：Windows上的Apache、MySQL和PHP，www.wampserver.com/en/。

MAMP有普通版和升级版两种，前者免费并且功能足以知足需求，WampServer下载时根据系统配置选择64bit或32bit便可。数据库

偏好设置

搭建环境天然会涉及到很多配置项内容，或者称做软件的偏好设置，这里以MAMP为例讲解须要了解的设置。运行MAMP以后，能够看到如下软件界面，很是简单清爽，只有三个按钮，分别对应偏好设置、打开欢迎页面、开启/中止服务。json

运行MAMP软件以后，会自动开启Web服务，开启成功后会在浏览器中弹出欢迎页面，至关于自动点击了第三个键和第二个键。欢迎页面以下图所示，能够查看PHP版本信息，提供了使用phpMyAdmin操做MySQL数据库的连接入口以及数据库信息，并给出了PHP、Python、Perl等语言链接并操做数据的样例代码。其中，phpMyAdmin是一款基于PHP开发的前端数据库图形化管理工具。除此以外，能够发现欢迎页面的连接是以localhost开头的，此即本地Web服务的一个别名，和movie.douban.com相似，但别人在他们的手机或电脑上则没法经过localhost访问你的本机Web环境。后端

须要重点介绍地是MAMP软件界面中的偏好设置这一按钮，英文显示为Preferences，点击以后能够进行如下五方面的偏好设置：开启/中止服务选项、端口配置、PHP配置、Web服务器配置、数据库配置。浏览器

在开启/中止服务选项中，能够设置每次运行MAMP以后是否自动开启相关服务，以及在退出MAMP以后是否自动关闭相关服务；
在端口配置中，能够对Apache、Nginx、MySQL所使用的端口进行配置。在讲解url的结构时曾简单提到过端口的概念，在同一台机器上，不一样服务使用同一个域名，所以须要使用不一样的端口以进行区分，例如Web服务、数据库服务、ssh服务的默认端口分别是80、330六、22。MAMP的默认端口配置是Apache和Nginx为888八、MySQL为8889，使用一些不经常使用的端口主要是为了不和其余服务的冲突；
在PHP配置中，能够设置PHP版本为5.x或7.x，以及是否启动缓存，PHP版本主要会影响到一些兼容性问题，例如phpMyAdmin的使用可能对PHP版本有一些要求；
在Web服务器配置中，能够选择将Apache或Nginx做为所使用的Web服务器，使用默认的Apache便可。另外还能够在这里设置Web环境的根目录，例如以用户桌面为根目录，则在浏览器中访问localhost:8888便可看到桌面上的所有文件，其中8888为Apache的端口；
在数据库配置中，能够看到当前所使用的MySQL版本号。

以上配置内容中，最为重要的是各项服务的端口配置，以及Web环境的根目录设置。只有理解了这两点内容，才能弄清楚应当把Web项目拷贝到哪里，以及如何在浏览器中访问到咱们的项目。

Hello World

既然讲到了新的东西，那么是时候来一发Hello World了。开启Web服务以后，在根目录中新建一个hello.html，而后用Sublime进行编辑。html即Hyper Text Markup Language，超文本标记语言，使用html语言编写而且以.html为后缀名的文件，是Web网站项目中最多见的一种静态模版文件。在hello.html中输入如下代码，而后在浏览器中能够经过localhost:8888/hello.html访问到刚才所写的文件，并看到期待的Hello World。

<html>
    <header></header>
    <body>
        <h1>Hello World</h1>
    </body>
</html>复制代码

固然，也能够经过直接双击hello.html的方式运行，一样能够在浏览器中打开并看到Hello World。但此时连接是以file开头，说明这一操做是经过文件系统完成的，而并不是以前所用的Web环境。

PHP是一种很是简单的后端语言，在PHP中也可使用html语法。在根目录中新建一个hello.php，而后用Sublime进行编辑并输入如下代码，其中第一行和第四行分别是php代码文件的头和尾，第二行用echo命令打印出来一条文本，第三行使用phpinfo()函数打印出当前所用PHP版本的一些信息，注意每行PHP代码须要用分号结束。编写完毕后，在浏览器中便可经过localhost:8888/hello.php访问到hello.php，并看到相应的打印内容。

<?php
    echo 'Hello World';
    phpinfo();
?>复制代码

以上两个例子都说明了，当Web服务开启以后，咱们能够经过浏览器访问根目录中的内容，并让浏览器加载和渲染html、php等Web项目文件。

后续章节中，咱们将结合实际项目进一步理解Web环境的做用。例如，当一个html文件中经过AJAX请求了同级目录中的json数据时，若是仅经过双击的方式运行html文件，AJAX请求将失败；而只有在一个Web环境中运行这一html文件，AJAX请求才能成功，数据才能被获取到并进一步展现。固然，若是Web项目中涉及到了数据库的使用，Web环境则是更加必不可少的。

视频连接：用MAMP和WAMP搭建Web环境

全栈 - 10 数据库 用MAMP和WAMP搭建Web环境

Web环境

偏好设置

Hello World

若是以为文章不错，不妨点一下左下方的喜欢～

全栈 - 10 数据库用MAMP和WAMP搭建Web环境