Sending a JSON object from JSP to JavaScript using AJAX

Question

Sending a JSON object from JSP to JavaScript using AJAX

Is there a way to transfer JSON values from JSP to JavaScript as an object using AJAX without resorting to global JavaScript variables, which can expose the JSON content in the page's source?

The desired scenario is as follows:

The JSP URL is opened in a browser.
Data is generated within a scriptlet and converted to JSON format
The JSON object is then passed to JavaScript

Based on the scenario above, it seems that JavaScript needs to trigger the AJAX call to the JSP. However, this approach will result in the JSP code being executed twice:

When the page loads - data preparation occurs
On each subsequent AJAX call, the same code will run again

Unfortunately, there are several constraints: no jQuery, no other libraries, no servlets, and no additional JSPs. :(

EDIT:

There is another complication: I need to pass multiple JSON objects to JavaScript, and using response.getWriter().write(); won't suffice.

Merging all JSON objects into one string for transmission doesn't seem like the best solution.

The parsing of the response object in JavaScript http.responseText could become unmanageable.

java javascript ajax jsp

Answer 1

Answer №1

Is there a need for ajax in this situation? If you are aware that you must load certain data from the server onto a JSP page, you can achieve that using scriptlets directly:

For example:

<%@ page import="com.mypackage.PersonDAO" %>
<html>
<body>
<table>
<th>Name</th><th>Email</th><th>Contact</th>

<%
List<Person> myList = PersonDAO.getAllPersons();
for(Person person:myList)
{ 

%>
<tr>
<td><%=person.getName()%></td>
<td><%=person.getEmail()%></td>
<td><%=person.getContact()%></td>
</tr>
<%}%>
</table>
</body>
</html>

This is just a basic example. More advanced tasks can be accomplished using JSTL.

Therefore, no jQuery, servlets, ajax, or additional JSP pages are necessary :)

UPDATE

If you require data in your JavaScript before the page loads, you can utilize jQuery's holdReady() method.

$.holdReady( true );
$.get( url, function() {
// Perform something
$.holdReady( false );
});

However, remember that modern browsers come equipped with developer tools like Firebug for Mozilla, which can capture any ajax calls made. To enhance security, consider encrypting the calls though it may add complexity. If you provide more details about your implementation scenario, I can offer further suggestions.

Answer 2

Is there a need for ajax in this situation? If you are aware that you must load certain data from the server onto a JSP page, you can achieve that using scriptlets directly:

For example:

<%@ page import="com.mypackage.PersonDAO" %>
<html>
<body>
<table>
<th>Name</th><th>Email</th><th>Contact</th>

<%
List<Person> myList = PersonDAO.getAllPersons();
for(Person person:myList)
{ 

%>
<tr>
<td><%=person.getName()%></td>
<td><%=person.getEmail()%></td>
<td><%=person.getContact()%></td>
</tr>
<%}%>
</table>
</body>
</html>

This is just a basic example. More advanced tasks can be accomplished using JSTL.

Therefore, no jQuery, servlets, ajax, or additional JSP pages are necessary :)

UPDATE

If you require data in your JavaScript before the page loads, you can utilize jQuery's holdReady() method.

$.holdReady( true );
$.get( url, function() {
// Perform something
$.holdReady( false );
});

However, remember that modern browsers come equipped with developer tools like Firebug for Mozilla, which can capture any ajax calls made. To enhance security, consider encrypting the calls though it may add complexity. If you provide more details about your implementation scenario, I can offer further suggestions.

Sending a JSON object from JSP to JavaScript using AJAX

Answer №1

Similar questions

Sending data from an HTML textarea to a PHP variable without user input

Challenges regarding OAuth2 and the angular-auth2-oidc Library - Utilizing PKCE Code Flow

Implementing React router for dynamic page rendering

Is there a way to sort search outcomes by a drop-down menu in Next.js?

Every item in my array is replaced by the most recently added element

I am looking to manage the error handling service, and my next step is to intentionally insert a single error into my service and have it automated

Abort an ajax request if it is taking too long to finish

I am experiencing an issue where the Laravel URL is not being passed to the controller

Resizing images using a dynamic frame size

Dynamic sidebar that adheres to the content and is placed alongside it using JavaScript

The z-index overlapping problem in webkit browsers is a result of Angular 7 animations

Internet Explorer experiencing problems with JSON when using ajax请求

What is the best way to combine an array of objects into a single object in typescript?

What sets apart the float and integer data types when they share the same size?

Interactive calendar feature with a popup that appears when hovering over an event

I need assistance with this ajax/javascript/php

Adding CSS styles to an HTML page using JavaScript

How can I restrict the navigation buttons in FullCalendar to only allow viewing the current month and the next one?

PHP Object-Oriented Programming Issue with PDO and AJAX

Utilizing Material-UI Select for creating a number range dynamically