Подтвердить что ты не робот

Вызов сервлета java из javascript

Я пытаюсь создать веб-приложение с использованием шаблона проектирования MVC. Для части GUI я хотел бы использовать JavaScript. И для контроллера Java Servlets.

Теперь я никогда не работал с JavaScript, поэтому мне сложно понять, как вызвать Java-сервлет из JavaScript и как получить ответ от сервлета.

Кто-нибудь может мне помочь?

4b9b3361

Ответ 1

Итак, вы хотите запустить Ajax вызов сервлета? Для этого вам нужен объект XMLHttpRequest в JavaScript. Вот пример, совместимый с Firefox:

<script>
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4) {
            var data = xhr.responseText;
            alert(data);
        }
    }
    xhr.open('GET', 'myservlet', true);
    xhr.send(null);
</script>

Это, однако, очень многословно и не очень совместимо с кроссбраузерами. Для наилучшего совместимого с crossbrowser способа запуска адиаксических запросов и прохождения дерева HTML DOM я рекомендую захватить jQuery. Здесь переписывается выше в jQuery:

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
    $.get('myservlet', function(data) {
        alert(data);
    });
</script>

В любом случае, сервлет на сервере должен отображаться на url-pattern из /myservlet (вы можете изменить это на свой вкус) и иметь как минимум doGet() реализованы и записывают данные в ответ следующим образом:

String data = "Hello World!";
response.setContentType("text/plain");
response.setCharacterEncoding("UTF-8");
response.getWriter().write(data);

Это должно показать Hello World! в предупреждении JavaScript.

Вы также можете использовать doPost(), но тогда вы должны использовать 'POST' в xhr.open() или использовать $.post() вместо $.get() в jQuery.

Затем, чтобы отобразить данные на странице HTML, вам нужно манипулировать HTML DOM. Например, у вас есть

<div id="data"></div>

в HTML, где вы хотите отобразить данные ответа, тогда вы можете сделать это вместо alert(data) первого примера:

document.getElementById("data").firstChild.nodeValue = data;

В примере jQuery вы можете сделать это более кратким и приятным способом:

$('#data').text(data);

Чтобы сделать еще несколько шагов, вы хотите иметь простой доступный формат данных для передачи более сложных данных. Обычными форматами являются XML и JSON. Последний является наиболее предпочтительным, поскольку он более краткий и может быть использован как на Java, так и на JavaScript очень простым способом. В Java вы можете использовать Google Gson для преобразования полнофункциональных объектов Java в JSON и наоборот.

List<Product> products = productDAO.list(); // Product is just a Javabean with properties `id`, `name` and `description`.
String json = new Gson().toJson(products);
response.setContentType("application/json");
response.setCharacterEncoding("UTF-8");
response.getWriter().write(json);

В JavaScript вы можете использовать jQuery $.getJSON(), чтобы получить его "мгновенно". Позвольте отобразить его в <table>.

$.getJSON('myservlet', function(data) {
    var table = $('<table>').appendTo($('#data'));
    $.each(data, function(i, product) {
        var row = $('<tr>').appendTo(table);
        $('<td>').text(product.id).appendTo(row);
        $('<td>').text(product.name).appendTo(row);
        $('<td>').text(product.description).appendTo(row);
    });
});

См. также:

Ответ 2

Код здесь будет использовать AJAX для динамического вывода текста в документ HTML5 (Код Ajax похож на книжный Интернет и WWW (Deitel)):

Код Javascript:

var asyncRequest;    
function start(){
    try
    {
        asyncRequest = new XMLHttpRequest();
        asyncRequest.addEventListener("readystatechange", stateChange, false);
        asyncRequest.open('GET', '/Test', true);    //   /Test is url to Servlet!
        asyncRequest.send(null);
    }
    catch(exception)
   {
    alert("Request failed");
   }
}

function stateChange(){
if(asyncRequest.readyState == 4 && asyncRequest.status == 200)
    {
    var text = document.getElementById("text");         //  text is an id of a 
    text.innerHTML = asyncRequest.responseText;         //  div in HTML document
    }
}

window.addEventListener("load", start(), false);

Код Java сервлета:

public class Test extends HttpServlet{
@Override
public void doGet(HttpServletRequest req, HttpServletResponse resp)
    throws IOException{
        resp.setContentType("text/plain");
        resp.getWriter().println("Servlet wrote this! (Test.java)");
    }
}

HTML-документ

 <div id = "text"></div>

ИЗМЕНИТЬ

Я написал ответ выше, когда был новичком в веб-программировании. Я позволил этому стоять, но часть javascript, безусловно, должна быть в jQuery, а в 10 раз проще, чем исходный javascript.

Ответ 3

Я действительно рекомендую использовать jquery для вызовов javascript и некоторую реализацию JSR311, например jersey для уровня обслуживания, который будет делегировать ваши контроллеры.

Это поможет вам со всей базовой логикой обработки вызовов HTTP и сериализации данных, что очень помогает.

Ответ 4

Извините, я прочитал jsp не javascript. Вам нужно сделать что-то вроде (обратите внимание, что это относительный URL-адрес и может отличаться в зависимости от URL-адреса документа, в котором находится этот javascript):

document.location = 'path/to/servlet';

Если ваше сервлет-сопоставление в web.xml выглядит примерно так:

<servlet-mapping>
    <servlet-name>someServlet</servlet-name>
    <url-pattern>/path/to/servlet*</url-pattern>
</servlet-mapping>

Ответ 5

   function callServlet()


{
 document.getElementById("adminForm").action="./Administrator";
 document.getElementById("adminForm").method = "GET";
 document.getElementById("adminForm").submit();

}

<button type="submit"  onclick="callServlet()" align="center"> Register</button>