Javascript 如何对返回html页面的对象执行简单的跨域ajax调用_Javascript_Jquery_Html_Ajax_Jsp

Javascript 如何对返回html页面的对象执行简单的跨域ajax调用

javascript jquery html ajax jsp

Javascript 如何对返回html页面的对象执行简单的跨域ajax调用,javascript,jquery,html,ajax,jsp,Javascript,Jquery,Html,Ajax,Jsp,我看过几个讨论使用ajax进行跨域调用的网站。它们似乎都过于复杂或具体。下面是一个简单的html页面，我希望能够将请求参数发送到服务器上的特定JSP <!DOCTYPE html> <html> <head> <title>jQuery AJAX POST Form</title> <meta charset="utf-8"> </head> <body> <div id="r

我看过几个讨论使用ajax进行跨域调用的网站。它们似乎都过于复杂或具体。下面是一个简单的html页面，我希望能够将请求参数发送到服务器上的特定JSP

<!DOCTYPE html>
<html>
<head>
    <title>jQuery AJAX POST Form</title>
    <meta charset="utf-8">
</head>
<body>

<div id="response">
    <pre></pre>
</div>

<form id="my-form">
    <input type="text" id="userName" name="first-name" placeholder="User Name" />
    <input type="text" id="password" name="last-name" placeholder="Password" />

    <button type="submit">Submit</button>
</form>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
    (function($){
        function processForm( e ){
            $.ajax({
                url: 'myserver.com:8080/myApp/user-login.jsp',
                crossDomain: true,
                dataType: 'html',
                type: 'post',
                contentType: 'application/x-www-form-urlencoded',
                data: $(this).serialize(),
                success: function( data, textStatus, jQxhr ){
                    $('#response pre').html( data );
                },
                error: function( jqXhr, textStatus, errorThrown ){
                    console.log( errorThrown );
                }
            });

            e.preventDefault();
        }

        $('#my-form').submit( processForm );
    })(jQuery);
</script>
</body>
</html>

我得到一个显示我已登录的html页面

当我尝试使用上述方法时，我发现不支持跨域查询。

被调用的JSP将返回一个HTML页面。我在这里遗漏了什么？

这是每个人都会遇到的常见错误，但解决这个错误的方法是

Jsoup

。

$.ajax({
 xhrFields: {
    withCredentials: false
      },
                        url: 'gethtmlservlet?urlofjsp=myserver.com:8080/myApp/user-login.jsp', 
                        type: 'post',
                        success: function( data, textStatus, jQxhr ){
                          cosnole.log(data);
                        },
                        error: function( jqXhr, textStatus, errorThrown ){
                            console.log( errorThrown );
                        }
                    });

首先使用ajax调用调用servlet&将我在下面的

ajax调用中编写的代码放入
$.ajax({
 xhrFields: {
    withCredentials: false
      },
                        url: 'gethtmlservlet?urlofjsp=myserver.com:8080/myApp/user-login.jsp', 
                        type: 'post',
                        success: function( data, textStatus, jQxhr ){
                          cosnole.log(data);
                        },
                        error: function( jqXhr, textStatus, errorThrown ){
                            console.log( errorThrown );
                        }
                    });

另外，在执行之后，您将获得整个html页面。。。
$.ajax({
 xhrFields: {
    withCredentials: false
      },
                        url: 'gethtmlservlet?urlofjsp=myserver.com:8080/myApp/user-login.jsp', 
                        type: 'post',
                        success: function( data, textStatus, jQxhr ){
                          cosnole.log(data);
                        },
                        error: function( jqXhr, textStatus, errorThrown ){
                            console.log( errorThrown );
                        }
                    });

在ajax调用的url中传递servlet的url
import org.jsoup.Jsoup;
  import org.jsoup.nodes.Document;
  import org.jsoup.nodes.Element;

     public class gethtmlservlet extends HttpServlet {   

     protected void processRequest(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {

            response.setContentType("text/html;charset=UTF-8");
            PrintWriter out = response.getWriter();

            try {
            String jspurl = request.getparameter("urlofjsp"); 

             Document htmldocument = Jsoup.connect(jspurl).get();
                 out.println(htmldocument);
             Elements iframe = productdocument.select("iframe");

              }
              catch(Exception e)
              {
                 System.out.println(e);
              }
            }
        }

我知道这已经太晚了，但也许这一次会对某人有所帮助
这个给定HTML页面的url是什么？确切的错误是什么？JSP页面需要添加一个CORS头，如下所示：我无法访问我想从web页面调用的每个JSP。我可以输入带有参数的URL，正如我所展示的那样，它可以正常工作。如何从jQuery执行相同的操作？@rckrd无法在Ajax中进行跨域引用请注意，它不是我的servlet，也不是在我的服务器上。我相信我需要找回HTML并将其捕获为字符串，然后“剪切”出我需要的内容，然后使用从其他提要中类似地捕获的数据进行组装，并创建聚合。