前端AJAX在Apache中的配置问题(总结)

本人在学习前端AJAX的过程中需要相关的服务器配置实现。首先下载XAMPP,作用是建站集成。我使用的是Apache
我修改了端口号,点击config,选择第一个http.cong,在记事本中ctrl+f将所有的80改成81之后保存
前端AJAX在Apache中的配置问题(总结)_第1张图片
点击start,在浏览器端口输出http://localhost:81/,出现了XAMPP的登录页面。
但是现在,问题来了,我是用的是WebSorm , 在这个文件夹下面布置的Ajax文件。
前端AJAX在Apache中的配置问题(总结)_第2张图片
想了很多办法,其中包括在WebSorm软件下的Settings中更改端口号,或者增加服务器。。。
但是行不通。又上网搜了下,正确的做法是这样的。
找到我们的XAMPP的安装文件加下
前端AJAX在Apache中的配置问题(总结)_第3张图片
修改httpd.conf文件,在244,245行,默认是我们的安装路径
这里写图片描述
改为在WebSorm中在文件夹下面布置的Ajax文件夹的路径。
这里写图片描述
改好后,重新启动服务器。输入http://localhost:81/
然后我们就看到了文件夹下一下的内容
前端AJAX在Apache中的配置问题(总结)_第4张图片
希望后面搞前端的同学可以少走些弯路了。。。

测试代码,新建一个ajax-03.txt,写入内容。 ajax-03.html发送ajax,如下

<html>
<head>
head>

<body>

<script type="text/javascript">

function ajaxFunction(the_request_url)
{
    var xmlHttp;

    try {
        xmlHttp = new XMLHttpRequest() ;   
    }    
    catch(e) {
        try {
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch(e) {
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e) {
                alert("您的浏览器不支持ajax") ;
                return false;
            }    
        }    
    }

    if (xmlHttp) {
        xmlHttp.open('GET', the_request_url, true);     
        xmlHttp.onreadystatechange = function() {
            if (xmlHttp.readyState ==4 ) {
                if (xmlHttp.status == 200 ) {
                    document.getElementById('vv').innerHTML = xmlHttp.responseText;        
                }     
            }   
        };
        xmlHttp.send(null);
    } else {
        alert('error');     
    }
}


script>

<input type="button" id="test" value="test" onclick="javascript:ajaxFunction('ajax-3.txt')" />
<br/><br/>
<div id="vv">test ajaxdiv>

body>

html>

点击test按钮,就会出现ajax技术取出的ajax-3.txt’内容。
这里写图片描述

你可能感兴趣的:(ajax技术)