在学习JavaScript,jQuery的ajax部分的时候,一直不明白要如何进行,不知道服务器要怎么弄,什么都不知道,当初在学ajax的时候,除了看一下ajax的内容,实践极少,因为,不知道要怎么做。
现在,如何来实践ajax,如何实现前后端的交互,我这里选择的Apache+PHP+mysql。并且,我这里安装的各个版本都是很早以前的版本,选这个是因为安装过程比较简单,不过是相对比较简单,虽然早,但是对于一般的测试还是够用的。
 
搭建Apache + php+MySQL 平台 
这是我在本地形成的一个文件夹,其中除了workspace是自己创建的,其余都是解压出来的文件
 1:资源的准备
php下载
到官网,直接百度PHP,进入官网(这里php  apache 推荐都到官网下载,除了速度慢点,其余到没什么)
右上角,随便点击一个版本,进入
找到windows downloads,点击进入
页面右下角,找到archives,点击进入
到了这样的一个页面:
之后,下载自己需要的 .msi,.zip文件即可
下载到某一个文件,解压即可,如果文件名太长,可以修改,尽量简单
这个是我下载的: 
下载的时候,要注意,php 和Apache 的版本要匹配(V9-V9   ,   V11-V11   , ...,x86-x86 , x64-x64)
 
下载Apache
同样,官网进入
点击进入下载界面
找到archive download site.点击进入
 
来到
找到下面的binaries  (二进制文件)
点击进入,找到win 32,在列表最下面,点击进入
到win32
之后,在这个页面的下面,选择你自己需要的.msi 版本即可
这几个下载的准备文件,尽量都放在同一目录下,在同一层
这个是我下载的:
 
MySQL
下载过程网速自己体会。。。
直接找了百度,下载,但是,如果可以,还是到官网下载
(这里的Navicat for MySQL 有破解补丁,有需要,可以自己找找)
之后,该解压的解压
这样,所有的软件就准备OK了!
 
2:配置环境
这个是我下载的版本,很久之前的版本,我一开始也是下载的最新版本,但是,配置了很久,都不成功
索性就下之前的,配置成功了!
然后,双击,安装
这个过程,网上有很多过程,可以自行查看
会形成一个文件,里面有一个Apache2.2 和 一个index.html文件,我直接把这两个文件提了出来,和php文件在同一层
又创建了一个工作空间,workspace
 
之后,配置几个文件:
按路径打开(这个路径,每个人的不一定一样)
这里有两个文件,即最后两个,php.ini 是没有的,直接复制php.ini-development,然后,修改为pnp.ini,即可
然后,分别打开这两个文件,尽量用合适问软件打开,会比较好修改
比如:notepad++(这里用的就是这个软件,比较方便)
Ctrl+f:用于搜索,这是一个比较实用,方便的操作
---------------------------------------------------------------------------------------------------------------------------------
httpd.conf

#加上这些,如果原来有,就注释掉(尽量定格写)
ServerRoot "D:/wapm/Apache2.2"
Listen
#LoadModule vhost_alias_module modules/mod_vhost_alias.so
#在这句之后加
LoadModule php5_module "D:\wapm\php5.3.10\php5apache2_2.dll"
PHPIniDir "D:\wapm\php5.3.10"
AddType application/x-httpd-php .php .html .htm
#你解压的php文件里面任意一个文件的所在位置
ServerName localhost:
DocumentRoot "D:/wapm/workspace"
#这个是刚才创建的workspace,之后,你可以把原来这个位置下的内容放到这个工作空间下 <Directory "D:/wapm/workspace">
#这下面这几行上面的这个<Directory ... >修改为上面的,
#not change
#
# Possible values for the Options directive are "None", "All",
# or any combination of:
# Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews <Directory />
Options FollowSymLinks
AllowOverride None
Order deny,allow
Deny from all
</Directory> <IfModule dir_module>
DirectoryIndex index.php index.html
</IfModule>
--------------------------------------------------------------------------------------------------------------------
php.ini  
; On windows:
;下面这一句
extension_dir = "D:\wapm\php5.3.10\ext"
;在解压的PHP文件中有 ext 这样一个文件
;extension=php_soap.dll
;extension=php_sockets.dll
;extension=php_sqlite.dll
;extension=php_sqlite3.dll
;extension=php_sybase_ct.dll
;extension=php_tidy.dll
;extension=php_xmlrpc.dll
;extension=php_xsl.dll
;extension=php_zip.dll
;在上面这些中找到,下面这几句,修改,或去掉前面的分号,或者直接在下面加这几句
extension=php_mysqli.dll
extension=php_curl.dll
   extension=php_gd2.dll
   extension=php_mbstring.dll
   extension=php_mysql.dll
   extension=php_xmlrpc.dll ;还有,找到并修改 timezone(修改区域时间)
date.timezone = Asia/Shanghai

----------------------------------------------------------------------------------------------------------------------------

差不多,我的这两个文件就做了以上的处理。
接下来,找到
 
双击,或者,右键,打开
就可以开启了
如果没报错,就说明OK。
Apache在本地安装之后,我就让它一开机就自动打开。
(要确定配置文件没有配置完整/正确)
 之后,安装MySQL,和Navicat for MySQL,OK!
具体安装,可以自行搜索
 
检查:
在浏览器url输入框输入localhost
 OK!
环境搭建成功!
3:ajax+PHP测试:
在workspace下新建文件 ajax,在ajax 文件下 建立 .html .php  等文件
这里,直接使用了jQuery 的ajax,用于简单测试的时候,可以偷点懒
 
ajax_php_test.html: 
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>ajax+php 测试</title>
<script type="text/javascript" src="jquery-3.2.1.js"></script>
</head>
<body>
<div>获取的数据:</div>
<input id="load" type="button" value="从后台获取数据" />
<div id="data"></div>
<script type="text/javascript">
$("#load").bind("click",function(){
var $this=$(this);
$("#data").html('正在加载中!').load("test.php",function(){
$this.attr("disabled", "true");
});
});
</script>
</body>
</html>
 
test.php: 
<?php
header("Content-Type:text/plain;charset=utf-8");
echo "这是从服务器的数据!";
?>

 
双击 .html 文件,自浏览器打开,点击按钮后:
会发现没有获取到PHP 文件的数据
因为,这个不是http应用,而是file本地文件服务
在URL 做如下修改,在点击按钮后:
OK,正确的获取到了 PHP文件的内容了! 
注:,这个图标,是我以前安装过的一个集成的环境,不用在意。
 
这样,搭建好了环境,就可以进行前后端交互了。
 
 
 
 
 
 
 
 
 
 
 

ajax+php(环境搭建+测试)的更多相关文章

  1. 大数据基础-2-Hadoop-1环境搭建测试

    Hadoop环境搭建测试 1 安装软件 1.1 规划目录 /opt [root@host2 ~]# cd /opt [root@host2 opt]# mkdir java [root@host2 o ...

  2. Nginx配置多个基于域名的虚拟主机+实验环境搭建+测试

    标签:Linux 域名 Nginx 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://xpleaf.blog.51cto.com/9 ...

  3. kafka windows环境搭建 测试

    http://www.cnblogs.com/alvingofast/p/kafka_deployment_on_windows.html 照着例子搭建成功

  4. kafka环境搭建测试

    一.安装 1. 下载:去kafka官网下载:https://www.apache.org/dyn/closer.cgi?path=/kafka/0.9.0.1/kafka_2.11-0.9.0.1.t ...

  5. 0028ssm环境搭建(springmvc+spring+mybatis)

    spring整合springmvc和mybatis主要分为如下几个步骤: 1.spring环境搭建 2.springmvc环境搭建 3.spring整合springmvc 4.spring整合myba ...

  6. Linux测试环境搭建的学习建议

    随着Linux应用的扩展许多朋友开始接触Linux,根据学习Windwos的经验往往有一些茫然的感觉:不知从何处开始学起.这里介绍学习Linux测试环境搭建的一些建议. 一.Linux测试环境搭建从基 ...

  7. 用java开发微信公众号:测试公众号与本地测试环境搭建(一)

    本文为原创,原始地址为:http://www.cnblogs.com/fengzheng/p/5023678.html 俗话说,工欲善其事,必先利其器.要做微信公众号开发,两样东西不可少,那就是要有一 ...

  8. 测试环境搭建心得 vs2008+SQL2008 PHP+APACHE+mysql Team Foundation Server2013

    大四即将结束,大学的最后一个假期,找到一份实习工作,担任测试工程师.在过年前的最后一周入职,干了一周的活儿.主要工作就是搭建测试环境. VMware 主要熟悉VMware软件,装系统基本都没什么问题. ...

  9. webDriver环境搭建与测试

    1.安装jdk 2.安装eclipse 3.安装selenium 由于使用的是开发语言是java,因此需要安装java版的selenium包.下载地址:http://pan.baidu.com/s/1 ...

随机推荐

  1. ”TCP连接“究竟是什么意思?

    我们经常听到"建立TCP连接","服务器的连接数量有限"等,但仔细一想,连接究竟是个什么东西,是和电话一样两端连起一根线?似乎有点抽象不是么? 1. 久违的分组 ...

  2. firefly rk3288 内核模块编译

    在驱动开发的过程中,常常需要对代码进行返回的调试,如果返回的编译再烧写内核,势必会浪费开发人员大量的时间和心力,加班加点那是时常的事.为此linux提供了编译内核模块的方式,无需返回烧写内核,只需in ...

  3. 在 macOS High Sierra 10.13 搭建 PHP 开发环境

    2017 年 9 月 26 日,苹果公司正式发布了新一代 macOS,版本为 High Sierra (11.13). macOS High Sierra 预装了 Ruby(2.3.3).PHP(7. ...

  4. javascript插入before(),after()新DOM方法

    随着web的技术突飞猛进的发展.HTML5 ES6等新技术的发展,与此同时DOM等标准也在悄悄的进步,各大浏览器也在悄悄的发展适配新的属性和方法,今天我们来看看Javascript新的DOM的方法 二 ...

  5. HDU-2222文字检索

    题目: In the modern time, Search engine came into the life of everybody like Google, Baidu, etc. Wiske ...

  6. NOIP2017SummerTraining0717

    个人感受:自己水平是真的差劲,和他们不是一个档次的,第二题,如果不是陈载元暴力过了,我也不会那么早去A了第二题,第一题真的是无语,以前做到过,还想到了每个对应值a[i]-i,但是没想出来,真的是 可惜 ...

  7. ES6-模块化

    ES6-模块化 在es6标准中,js原生支持modulele. ES6模块需要使用babel转码,这里简单解释一下什么是babel转码. babel就是将‘ES6模块化语法’转化为‘CommonJS模 ...

  8. NSString与NSMutableString的浅拷贝与深拷贝

    浅拷贝:指针拷贝,指针与原指针地址相同,没有创建新的对象. 深拷贝:内容拷贝,创建了新的对象,指针地址与原对象的指针地址不同. NSString测试代码如下 打印结果如下(后面打印出的两个NSCFCo ...

  9. 吐槽CSDN--想钱想疯了--推荐文章里面广告博文去不掉

    CSDN广告手段高,广告博文删不掉! 如图所示,我自己的博客文章下面有个相关文章推荐,这是csdn新出的信息流式内容呈现方式,也没什么太大问题.只是,你在里面放广告"羊毛衫,弹力裤" ...

  10. Android 屏幕相关概念(1)

    1.  术语和概念 术语 说明 备注  Screen size(屏幕尺寸)  指的是手机实际的物理尺寸,比如常用的2.8英寸,3.2英寸,3.5英寸,3.7英寸  摩托罗拉milestone手机是3. ...