通过 java servlet 的简单 jquery 请求没有返回任何内容

Question

固定

我一直在按照教程进行非常简单的查询 ajax。

本教程从 JSP 形式获取一个字符串，然后（出于某种原因）使用 map 将其放入一个对象中，然后使用 Gson 将其 return 作为 json 到jquery。我不知道他为什么那样做。

我的版本从 JSP 表单中获取一个搜索查询并尝试 return 一个常量字符串（只是为了测试直到我让它工作）。

我的 JSP 页面加载后，当我在搜索框中输入内容时，我的搜索消失了。所以它在某种程度上起作用。但是我没有向我显示 resultsString "hello"。

我将把代码粘贴到这里，因为它应该非常简单，只看比阅读我的描述更容易。谢谢阅读。

请注意，我花了几个小时试图查看我是否在任何地方使用了错误的名称，但无法发现任何东西。

索引jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Anime List Creator</title>

        <script src="webresources/jquery-2.1.3.min.js"></script>
        <script src="webresources/basic.js"></script>
        <!--<link rel="stylesheet" href="webresources/css/basic.css" type="text/css" media="screen"/>-->
    </head>

    <body>
        <h1>Anime List Creator</h1>

        <form id="searchForm">
            <label for="searchQuery">Make a search</label>
            <input type="text" id="searchQuery" name="searchQuery"/>
            <input type="submit"/>
        </form>

        <p id="displaySearchResults"/>
        <hr/>

    </body>
</html>

javascript

$(document).ready(function(){
    $('#searchForm').submit(function(){

        $.ajax({
            url: 'search',
            type: 'POST',
            dataType: 'text',
            data: $('#searchForm'.serialize()),
            success: function(data){
//                if(data.isValid){
                    alert("hi");
                    $('#displaySearchResults').html("Results:" + data.resultsString);
                    $('#displaySearchResults').slideDown(500);
//                }
//                else{
//                    alert('Enter a valid search term.');
//                }
            }
        });
        return false;
    });
});

SearchServlet（抱歉，很多注释掉了）。

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package main;

import entities.Anime;
import entities.Ann;
import entities.Info;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.HashMap;
import java.util.Map;
import javax.ejb.EJB;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 *
 * @author J
 */
@WebServlet(name = "SearchServlet", urlPatterns = {"/search"})
public class SearchServlet extends HttpServlet {

        @EJB
    private AnnJAXB annj;

//    @EJB
//    private AnnJAXB annJAXB = new AnnJAXB();

    @EJB
    private Ann ann;

    /**
     * Processes requests for both HTTP <code>GET</code> and <code>POST</code>
     * methods.
     *
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    protected void processRequest(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        response.setContentType("text/html;charset=UTF-8");
        try (PrintWriter out = response.getWriter()) {
            /* TODO output your page here. You may use following sample code. */
            out.println("<!DOCTYPE html>");
            out.println("<html>");
            out.println("<head>");
            out.println("<title>Servlet SearchServlet</title>");            
            out.println("</head>");
            out.println("<body>");
            out.println("<h1>Servlet SearchServlet at " + request.getContextPath() + "</h1>");
            out.println("</body>");
            out.println("</html>");
        }
    }

    // <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click on the + sign on the left to edit the code.">
    /**
     * Handles the HTTP <code>GET</code> method.
     *
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        processRequest(request, response);
    }

    /**
     * Handles the HTTP <code>POST</code> method.
     *
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

//        processRequest(request, response);

//        Map <String, Object> map = new HashMap<String, Object>();

        String searchQuery = request.getParameter("searchQuery");

//        map.put("searchQuery", searchQuery);
//        returnResults(response, map);

        returnResults(response, searchQuery);

    }

    private void returnResults(HttpServletResponse response, String searchQuery) throws IOException{

        response.setContentType("text/html");
        response.setCharacterEncoding("UTF-8");

        String resultsString = "hello";

//        try{
//            for (Anime anime : annj.Unmarshalling(searchQuery).getAnn()) {
//
//                resultsString = resultsString + " " + anime.getId() + " " 
//                        + anime.getName() + " " ;
//                
//                
////                out.println("<h1>ID: " + anime.getId() + "</h1>");
////                out.println("<h1>Name: " + anime.getName() + "</h1>");
//
//                for (Info temp : anime.getAnime()) {
//                    if (temp.getSrc() != null) {
//                        resultsString = resultsString + " " + temp.getSrc();
//                    }
//                }
//            }}catch(Exception e){} 

        response.getWriter().write(resultsString);

    }


    /**
     * Returns a short description of the servlet.
     *
     * @return a String containing servlet description
     */
    @Override
    public String getServletInfo() {
        return "Short description";
    }// </editor-fold>

}

我的文件结构：

![http://i.stack.imgur.com/3uhOI.jpg][1]

我的jsp里面的js路径是不是设置错了？

<script src="webresources/basic.js"></script>

http://i.stack.imgur.com/3uhOI.jpg

修复了路径问题。 chrome 控制台现在没有 javascript 错误。但是，当我进行搜索时，仍然没有任何内容出现，甚至 alert "hi"

也没有

已修复：已更改

data: $('#searchForm'.serialize()),

到

data: $('#searchForm').serialize(),

Answer 1

从您的项目结构来看，您的 Web 应用程序资产应该位于的主要文件夹是 Web Pages。您可以识别此文件夹（尽管它有名称），因为其中包含 WEB-INF 文件夹。

问题是您收到 localhost:8080/prototype11/webresources/basic.js 的 404，因为此路径中没有 webresources 文件夹。相反，您已将 JavaScript 文件放入包中。

只需创建适当的文件夹并相应地移动文件。您的网页文件夹结构应如下所示：

- Web Pages
  - webresources
    + basic.js
    + jquery-2.1.3.min.js
  + index.jsp

并从您的源包中删除包 webresources。

除此之外，最好使用绝对路径而不是相对路径来检索资源。在 JSP 中，这可以通过使用 ${pageContext.request.contextPath}:

轻松实现

<script src="${pageContext.request.contextPath}/webresources/jquery-2.1.3.min.js"></script>
<script src="${pageContext.request.contextPath}/webresources/basic.js"></script>

通过 java servlet 的简单 jquery 请求没有返回任何内容

Nothing being returned by simple jquery request through java serlvet

java

jsp

servlets