Expand my Community achievements bar.

July 31st AEM Gems Webinar: Elevate your AEM development to master the integration of private GitHub repositories within AEM Cloud Manager.
SOLVED

Make AEM page return JSON data

Avatar

Level 2

[Thread Edited By Adobe]

/*Don’t forget to meet and greet your fellow peers virtually by telling them about yourself here

Go ahead and to it now: https://adobe.ly/3eDnB4v */

 

Actual Post:

hi Everyone,

My requirement is to do some business logic ((this can be only done in client side otherwise i could have written bundles)) in the javascript/jquery and take the output from that script and set that as page response in JSON format. Setting the AEM page response as JSON is the challenge.

I have tried using scriptlets like <%@ page contentType="application/json" %> and <%@ page language="java" contentType="application/json; charset=UTF-8" pageEncoding="UTF-8"%>. But along with JSON it prints HTML also.

We want AEM page to return only JSON not any HTML. Any suggestions please ??

 

desktop_exl_promo_600x100_gdrp.png

1 Accepted Solution

Avatar

Correct answer by
Employee Advisor

Hi,

assuming your page component (not the template but the page component) is located at /apps/myapp/components/mypage

then write a jsp /apps/myapp/components/mypage.json.jsp, which renders the page as JSON.

Then you can request your page located at /content/myapp/mypage (with resourcetype myapp/components/mypage) with "http://host/content/myapp/mypage.json to get your custom output. Another, potentially more flexible approach might be to write a servlet, bind it to the resourcetype myapp/components/mypage and a selector (for example "custom") and the extension "json" and then request the page via "http//host/content/myapp/mypage.custom.json".

Jörg

View solution in original post

12 Replies

Avatar

Level 6

Hi Abhijit,

    Our need also similar but not in javascript we need page JSON in PHP. We are using the  http://host:port//xxx/jcr:content.-1.json. It will return the page in JSON format.  That's how we are getting JSON response from AEM to PHP. 

 

Thanks

Uma

Avatar

Level 2

Thanks for Replying Uma and smacdonald.

The suggestions provided by you would work if you want to return JCR properties of some particular node in JSON format. My Requirement is little different which is as follows:

1) I have a page which has javascripts to do some business logic.

2) The above java script gives me some data's.

3) The above data's i need to provide as JSON reponse so that someone can consume the same by just hitting the page.

The response in the network tab of the browser should be JSON and not HTML. Hope this gives a clear picture what we are trying to do.

P.S.:

<%-- HomePage component. --%><% %><%@include file="/libs/foundation/global.jsp"%><% %><%@page session="false" %><% %> <%@ page contentType="application/json" %> <% JSONObject json = new JSONObject(); json.put("title", "TITLE_TEST"); json.put("link", "LINK_TEST"); out.print(json); %> <%@ page contentType="application/json" %> <%@ page import="org.json.JSONObject" %> <html lang="en"> <head> <meta charset="utf-8"> <title>Calling FPS</title> </head><!--/head--> <body onload="showAlert();"> </body> <script type="text/javascript"> function showAlert() { alert('You triggered an alert!'); } </script> </html>

 

The above page would give me response like

Avatar

Level 4

Hi Abhijit

I don't know I fully understand your requirement. 

My suggestion to get the json response is adding ".infinity.json" at the end of the url.

For Ex: http://localhost:4502/content/geometrixx-outdoors/en/men.html.infinity.json

$.get( "http://localhost:4502/content/geometrixx-outdoors/en/men.html.tidy.infinity.json", function( data ) {
  console.log(JSON.stringify(data));
});

Which will return page as JSON object. It will contain all your page data. But make sure infinity.json will return all the child pages repository data depending on the configuration in your Apache Sling GET Servelt, which may affect performance. You can request specific level json as well. Parse the json and use it accordingly.

Hope this helps! 

Avatar

Level 10

Agree with vjetty - why do you want the page to render in JSON format. The URL provided renders in JSON format. What purpose does this serve to see all of this JSON in a browser? 

Avatar

Level 2

Thanks Vjetty and smacdonald for the reply.

I am aware of infinity.json but i do not want to render the page content in JSON format, rather i have some values which needs to be shown as Page response in JSON format.

In short, if i load my page in browser, then go to network Tab and should see a response in JSON. It can be easily achieved via bundles but the business logic is written in some third party JS, so i need to do it in client side only.

I know I am making you guys little confused. :)

Avatar

Level 9

Hi Abhijeeth,

    Sounds you are going aways from standards which is not advisable. Example html request to have json response.    If you want to go against it either write a response wrapper filter to remove all html & send only Json OR

    Assign the json response to an java script variable & let your integration piece use that variable. 

Thanks,

Avatar

Level 2

Thanks for the suggestion MC Stuff.

Yeah I know its far away from the standards, but my requirement is forcing me to do so. :-(

I am aware of writing a response wrapper filter in server side, how should i achieve the same in client side?? Any suggestions plz.

Avatar

Correct answer by
Employee Advisor

Hi,

assuming your page component (not the template but the page component) is located at /apps/myapp/components/mypage

then write a jsp /apps/myapp/components/mypage.json.jsp, which renders the page as JSON.

Then you can request your page located at /content/myapp/mypage (with resourcetype myapp/components/mypage) with "http://host/content/myapp/mypage.json to get your custom output. Another, potentially more flexible approach might be to write a servlet, bind it to the resourcetype myapp/components/mypage and a selector (for example "custom") and the extension "json" and then request the page via "http//host/content/myapp/mypage.custom.json".

Jörg

Avatar

Level 2

Hi Jörg

I'm attempting to implement this, however, I find that I can only get the URL to resolve to the correct servlet by adding the "jcr:content" node which contains the resourceType

http//host/content/myapp/mypage/jcr:content.custom.json

Without this it is getting resolved by the DefaultGetServlet

Can you or anyone else think why this might be the case?

Thanks, Richard.

Avatar

Employee Advisor

Hi Richard,

I tried

localhost:4502/content/we-retail/us/en.body.html

and it returns only the body of the page, as rendered by /apps/weretail/components/structure/page/body.html.

I wonder what is different on your side.

Jörg

Avatar

Level 2

AEM does not allow us to use the JSON extension.

We always have to use it on jcr:content.custom.json

when the extension is .html we can hit the page directly but if its anything other than that we have to hit jcr:content

 

Any clues as to why it behaves this way ?