Ajax请求中url的绝对路径和相对路径_ajax url 绝对路径

link管理
链接快照平台
输入网页链接，自动生成快照
标签化管理网页链接
一、绝对路径：包括协议名称、主机地址、端口、web项目名称等的完整请求路径。

$.ajax({ url:"http://localhost:8080/webname/test" });
好处：比如在webA项目中的ajax需要请求webB项目中的服务，则必须使用绝对路径。
 坏处：使用绝对路径要求不能更改web项目的名称，如果webB项目重命名了，则对应的ajax请求都需要修改；往往项目开发调试和部署时run的环境不同，路径不同，不可能每次发布或调试把项目中路径全部修改一遍。




    
 
二、相对路径：不需要协议名、主机地址、端口、web项目名称，只需要请求的路径。
 
项目路径：http://localhost:8080/webname
 页面路径：/webname/index.html（A页面），/webname/test/test.html（B页面）
 请求路径：/request/ajaxtest，request/ajaxtest
 1、如果请求路径以根路径开头（常见），则无论什么ajax在什么页面，该请求都是相对于服务器的根路径，最后的请求路径都是：http://localhost:8080 + /request/ajaxtest（url地址）
 例如： 
$.ajax({
    url :"/request/ajaxtest"
});
原因：以"/"开头，是表示该请求基于从服务器的根路径，即不是相对于html的路径，所以请求路径是：http://localhost:8080 + /request/ajaxtest
 2、如果请求不以根路径开头，则该请求路径是相对于当前html所在的路径的。
 （1）假如请求在A页面（ …/webname/index.html） 
$.ajax({
        url:"request/ajaxtest"
    });
最终的请求路径是：http://localhost:8080/webname/request/ajaxtest。
 原因：index.html页面对应的路径是"/webname/index.html"，所以将url在这个路径下就是最终的请求路径。
 （2）假如请求在B页面（…/webname/test/test.html） 
$.ajax({
        url:"request/ajaxtest"
    });
最终的请求路径是：http://localhost:8080/webname/test/request/ajaxtest。 原因：test.html页面对应的路径是“/webname/test/”，所以这里url要跟在test这一级下面。 
备注：1、2两种方式在项目中使用基本使用 方式1。比如我们的登陆页面 login.html 是在 web（有的是Webcontent）目录下，这时我调一个接口直接使用1、2两种方式都可以访问后台；但是业务页面肯定会新建文件夹，那么就要使用“方式1”了，如果使用“方式2”的方式，登陆地址会加上当前页面的地址 比如： http：localhost：8080/项目名/ 。。。（html地址）/ 接口地址，显然访问不到后台了。 
举例1：如下图项目结构，在web根目录下ajax.html想调用src/Servlet/AjaxServlet(url以’/'开头)；
 
 ajax.html 
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery-2.1.0.min.js"></script>
    <script>
        //定义方法
        function  fun() {
            //使用$.ajax()发送异步请求
            $.ajax({
                url:"/ajaxServlet" , // 请求路径(如果url使用'/'开头表示使用web根目录，即“http://localhost:8080/”,可以直接调用servlet)
                type:"POST" , //请求方式
                data:{"username":"jack","age":23},
                success:function (data) {
                    alert(data);
                },//响应成功后的回调函数
                error:function () {
                    alert("出错啦...")
                },//表示如果请求响应出现错误，会执行的回调函数
                dataType:"text"//设置接受到的响应数据的格式
            });
    </script>
</head>
    <input type="button" value="发送异步请求" onclick="fun();">
    <input>
</body>
</html>
AjaxServlet.java 
@WebServlet("/ajaxServlet")
public class AjaxServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1.获取请求参数
        String username = request.getParameter("username");
        //2.打印username
        System.out.println(username);
        //3.响应
        response.getWriter().write("hello : " + username);
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
此时，在浏览器输入http://localhost:8080/ajax.html再点击按钮是可以调用到servlet的：
 
 举例2：如下图项目结构，在web根目录下ajax.html想调用src/Servlet/AjaxServlet(url不以’/'开头)；
 
 ajax.html 
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery-2.1.0.min.js"></script>
    <script>
        //定义方法
        function  fun() {
            //使用$.ajax()发送异步请求
            $.ajax({
                url:"ajaxServlet" , // 请求路径(如果url不使用'/'开头表示使用当前html文件所在的目录为相对路径，当前路径为“http://localhost:8080/”,可以直接调用servlet)
                type:"POST" , //请求方式
                data:{"username":"jack","age":23},
                success:function (data) {
                    alert(data);
                },//响应成功后的回调函数
                error:function () {
                    alert("出错啦...")
                },//表示如果请求响应出现错误，会执行的回调函数
                dataType:"text"//设置接受到的响应数据的格式
            });
    </script>
</head>
    <input type="button" value="发送异步请求" onclick="fun();">
    <input>
</body>
</html>
AjaxServlet.java 
@WebServlet("/ajaxServlet")
public class AjaxServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1.获取请求参数
        String username = request.getParameter("username");
        //2.打印username
        System.out.println(username);
        //3.响应
        response.getWriter().write("hello : " + username);
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
此时，在浏览器输入http://localhost:8080/ajax.html再点击按钮是可以调用到servlet的：
 
 举例3：如下图项目结构，在web根目录下hhh文件夹里的ajax.html想调用src/Servlet/AjaxServlet；
 
 ajax.html 
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery-2.1.0.min.js"></script>
    <script>
        //定义方法
        function  fun() {
            //使用$.ajax()发送异步请求
            $.ajax({
                url:"../ajaxServlet" , // 请求路径(如果url不使用'/'开头表示使用当前html文件所在的目录为相对路径，当前路径为“http://localhost:8080/hhh/”,需要使用../回退到web根目录http://localhost:8080/，再调用servlet)
                type:"POST" , //请求方式
                data:{"username":"jack","age":23},
                success:function (data) {
                    alert(data);
                },//响应成功后的回调函数
                error:function () {
                    alert("出错啦...")
                },//表示如果请求响应出现错误，会执行的回调函数
                dataType:"text"//设置接受到的响应数据的格式
            });
    </script>
</head>
    <input type="button" value="发送异步请求" onclick="fun();">
    <input>
</body>
</html>
AjaxServlet.java 
@WebServlet("/ajaxServlet")
public class AjaxServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1.获取请求参数
        String username = request.getParameter("username");
        //2.打印username
        System.out.println(username);
        //3.响应
        response.getWriter().write("hello : " + username);
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
此时，在浏览器输入http://localhost:8080/hhh/ajax.html再点击按钮是可以调用到servlet的：
 
  1.绝对地址，带有协议名称的是绝对地址例如http://www.baidu.com
  2.相对地址，没有协议开头的，例如 user/some.do，
  相对地址不能独立使用，必须有一个参考地址。通过参考地址+相对地址本身才能指定资源。
  3.参考地址
  1)在你的页面中的，访问地址不加"/"
  访问的是http://localhost:8080/SpringMVC/index.jsp
  当前页面的地址:http
绝对路径是指文件在硬盘上的真实路径，而相对路径指的是相对于另一个文件来书，本文件的路径。（个人理解是，既然能用相对路径表示那也就说明了这两个问价同属于一个文件集下，如果一个在你的电脑，一个在我的电脑那也就无从可来所谓的相对路径，甚至说是在同一个电脑中一个在E盘一个在C盘）。但是在做web项目时应该采用相对路径，绝对路径容易造成文件的寻找失败。打个比喻就是，绝对路径就好比在地球上时以地球...
即包含完全请求路径，即请求头，主机地址，端口，项目名等都有，在这个例子中，绝对路径为http://localhost:8080/HotelSSM/system/login
url中的相对路径分为两种：
有’/‘符号，在这个例子中，/system/login即为这一种，开头的’/'是指根路径，其相对的是服务器的根路径，即为http://localhost:8080。所以当我填写为/system/login时，访问的路径会变为http://localhost:8080/system.
                                    浏览器会拿到当前页面的地址，以及当前页面的请求方法，重新发一次请求，同时抛弃当前页面。浏览器要想发起请求,必须是一个完整的url地址.属性值，然后把表单中的数据组织到请求体中，发出。浏览器会拿到a元素的href地址，并发出一个。浏览器会自动解析URL，并发出一个。和当前页面的path密切相关。单页面应用使用的是绝对路径.浏览器会拿到对应的地址，发出。的请求，同时抛弃当前页面。和当前页面的path无关。请求，同时抛弃当前页面。请求，同时抛弃当前页面。，并注明了获取服务的。浏览器会获取按钮所在的。
URL（Uniform Resource Locator）： 统一资源定位符，也就是我们通常所说的网址。就好比一个城市里的街道门牌号码一样。它指定了如HTTP或FTP等Internet协议，是惟一能够识别Internet上具体的计算机、目录或文件位置的命名约定。
URL的格式由下列三部分组成：
第一部分是协议(或称为服务方式);
第二部分是存有该资源的主机IP地址(有时也包括端口号);
第三部分是主机资源的具体地址，如目录和文件名等。
第一部分和第二部分之间用“：//”符号隔开，第二部分和第三部分用
                                    我在ASPX页面中只接受excel文件的文件上传控件。如果将正确的文件发布到控件，则该文件路径将通过jQuery Ajax调用发送到Web服务。我的web服务将对excel文件执行一些计算并在本地保存该文件。使用Ajax通过JSON访问文件路径我在Visual Studio Development Sever中成功运行此项目。但是，当我将其部署到生产服务器上时，该文件路径会导致错误，因为它在生产服...
url:“http://localhost:8080/webname/test”
好处：比如在webA项目中的ajax需要请求webB项目中的服务，则必须使用绝对路径。
坏处：使用绝对路径要求古地理更web项目的名称，如果webB项目重命名了，则对应的ajax请求都需要修改。
二、相对路径：不需要协议名、主机地址、端口、web项目名称，只