New Features in AEM 6.1

New Features in AEM 6.1


Adobe Experience Manager 6.1 is an upgrade release to the Adobe Experience Manager 6.0 code base. It provides new and enhanced functionality, key customer fixes, high priority customer enhancements and general bug fixes oriented toward product stabilization. It also includes all Adobe Experience Manager 6.0 feature pack, hot fix, and service pack releases.


The list below provides an overview - while the subsequent pages list the full details.


EXPERIENCE MANAGER PLATFORM


The platform of Adobe Experience Manager 6.1 build on top of updated versions of the OSGi-based framework (Apache Sling and Apache Felix) and the Java Content Repository: Apache Jackrabbit Oak 1.2.


The Quickstart uses the Eclipse Jetty 9.2.9 as servlet engine.


1) Security :


AEM 6.1 includes a range a new and improved capabilities to maintain a secure deployment and run a secure web property. Most notable is a new Cross-Site Request Forgery (CSRF) protection, with that the server does extra checks on POST, PUT and DELETE HTTP requests from browser to avoid CSRF attacks.


Further, the 'nosamplecontent' server run mode was extended to also deploy a range of 'secure by default' best practices, that with previous releases had to be manually configured.


2) Repository :


Since the introduction of Apache Jackrabbit Oak with AEM 6.0 in 2014, the successor of CRX2, Adobe and the community have improved and extended a wide range of aspects.


Here a few highlights:

Introduce cold standby topology with TarMK for simplified disaster recovery deployments
Substantial search improvements, in default configuration at install/update and possibilities to tune the search performance.
New UI that shows slow queries and explain query execution in details, and tool to manage search index.
Simplified maintenance operations, adding support to purge audit logs and compaction to reclaim disk space.
Added option to use a relational database as repository persistence. More details
Note, Adobe has removed support for CRX2 with 6.1. The release update routine converts the existing CRX2 repository to Oak during the update (CRX2Oak).3) Component Framework



In Version 6.0, Adobe introduced Sightly and Sling Models, as new way to develop components, in an time efficient and secure way. AEM version 6.1 delivers incremental improvements to the new approach.


New in Sightly 1.1:

New <sly> element as alternative to data-sly-unwrap
URI manipulation options (e.g. ${'http://foo.com/test.html '@ scheme='https', extension='json'} outputs https://foo.com/test.json)
Allow java.util.Locale objects to be used in i18n locale option
data-sly-repeat (alternative to data-sly-list that repeats the whole element, instead of just the content)
improved performance (on par with JSP) and around 150 bug fixes since 6.0
the specification and implementation for Apache Sling of Sighlty are open source (since end of 2014)

4) User Interface :
Experience Manager 6.1 includes the Classic UI (same as in AEM 6.0) and Touch-optimized UI. The Touch-optimized UI in 6.1 is substantially extended to efficiently cover every-day use cases of marketing and content management practitioners. The user interface and interaction patterns aligns with the Adobe Marketing Cloud. Please refer to the individual areas of AEM on the detailed enhancements done to the Touch-optimized UI.


For Web Developers, 6.1 includes Plug-ins for Eclipse, Extension for Brackets and the web-based UI CRXDE Lite. Brackets, integrated with the Creative Cloud Extract service, allows efficient update of templates/components based on designs created in Adobe Photoshop.
Workflow


The focus for AEM 6.1 was to improve the throughput of workflow tasks that can be executed by the workflow engine, by optimizing various parts of the way workflow steps are run within AEM. Customers that update to 6.1 should see that workflows take less time to complete (in particular with lots of them running in parallel), and take less resources to run on the server.
Summary of improvements:


Introduction of transient workflows, that runs the workflow tasks in memory and don't persist them in the repository. This has to be enabled on the workflow level, and is useful for shot-lived workflow where no audit, or history is needed.
Internal changes, such as reducing JCR observation listeners, amount of Sling Jobs needed to run workflow tasks.
APIs
AEM 6.1 introduces a new simplified remote HTTP API based on JSON+Siren. This allows easier interaction with 3rd party tools to read and write content into/from the repository, compared to lower-level Sling HTTP API.


5) Supported Platforms :
With 6.1, Adobe recommends to use Java 8 with a 64bit JVM as default. Exceptions are deployments on web application servers - such as IBM WebSphere that come recommended with their JVMs. Please consult the Supported Platform list for all details.


6) Languages :
Including which are available in AEM 6.0 languages, additionally certified for GB18030-2005 CITS to use the Chinese Encoding Standard.

Some Deprecated features from API side:

Security (User/Groups) :
From com.day.cq.security.* to org.apache.jackrabbit.api.security.*


Security (login) :
from loginAdministrative (org.apache.sling.jcr.api) to Apache Sling Service Authentication


Sightly :
Sightly i18n source option should no longer be used, use locale option instead: ${'Assets' @ i18n, locale=request.locale.language}


The Sightly Use helper class com.adobe.cq.sightly.WCM Usehas been deprecated and is now replaced bycom.adobe.cq.sightly.WCMUsePojo which uses the new Sightly API from Apache Sling.


The com.adobe.granite.sightly.* API has been deprecated as the Sightly engine has been donated to the Apache Foundation and is now provided by Apache Sling, through org.apache.sling.scripting.sightly.*. An adapter is provided to support code that was using the old API.


XSS :
The com.adobe.granite.xssprotection has been deprecated in favour of org.apache.sling.xss. All XSS API calls are delegated to the Sling implementation, with the Granite bundle only loading the product's AntiSamy policies.


Vault :
The package com.day.jcr.vault.* API is marked as deprecated starting 6.0. Vault has been donated to the Apache Foundation and is now org.apache.jackrabbit.vault.*


ClientLibs :
The ClientLib granite.ui.bootstrap and granite.ui.bootstrap.embedded are marked as deprecated starting 6.1


CRXDE (Eclipse-based) :
Adobe is not planning to further enhance the Eclipse-based CRXDE. Recommendation is to used the new Eclipseplug-ins shipped with 6.0 that also work with 5.6.x.


JSP components :
JSP components were deprecated starting 6.0 and removed in 6.1. Most components have been implemented as HBS components based on SCF, with few exceptions, such as the Poll component.

Source : https://docs.adobe.com/docs/en/aem/6-1/release-notes.html

Thanks,
Achyuth

Facebook integration with AEM

we need to be social and expand our social network. Thus, it is very important to connect our website with social sites.

1.Go to the https://developers.facebook.com and login with your facebook ID.

2. Click on the platform on which you need this configuration according to the requirement. I am using this configuration for website.

3.Choose the appropriate name for the application.

4. Choose the category and click on create App ID.

5) Now go to the settings. and see your app ID and App secret there. You also need to set site domain localhost and click on save changes.

(Site Domain is the url from where your application is sending request to facebook API)

6).Now in your AEM instance , go to http://localhost:4502/etc/cloudservices.html.Nowgo to Facebook Connect.

7) Go to show Configuration and click on (+) sign

8)

9) Enter your App ID and App Secret from the facebook .You can add a group for the user,but it is optional.

Now go to siteadmin
10) On which page you want to do facebook connection go to that page, and perform right click on it. Go to properties:

11) Add your application to that page.

For the coding part and component go to here and check the functionality.

Enjoy your day



Regards:
Achyuth

SAML WITH AEM 6.1

With AEM6.1 there are some changes in configuration of SAML Authentication handler compared to earlier version of AEM. This section concentrates only on configuration changes of SAML 2.0 with AEM6.1

STEPS

1. Add IdP public cert to AEM truststore

• Go to: http://localhost:4502/libs/granite/security/content/useradmin.html
• Select any user because TrustStore is global to AEM
• Create trust store by supplying the password & then manage trust store
• Upload the IdP certificate & make note of the certificate Alias

2. Add SP key and certificate chain to AEM keystore (authentication-service)

• Go to: http://localhost:4502/libs/granite/security/content/useradmin.html
• Select authentication-service
• Create KeyStore by supplying the password
• If encrypting SAML assertions then go to manage KeyStore for uploading the private & public key

3. Configure the SAML authentication handler in the web console

• Go to: http://localhost:4502/system/console/configMgr
• Search for Adobe Granite SAML 2.0 Authentication Handler
• Add a new handler configuration and alias here should match with step1.

4. Configure Referrer Filter

• Configure host at:http://localhost:4502/system/console/configMgr/org.apache.sling.security.impl.ReferrerFilter

EARLIER VERSION

https://helpx.adobe.com/experience-manager/kb/saml-demo.html
https://helpx.adobe.com/experience-manager/kb/simple-saml-demo.html

VIDEO

Sightly api, comparing, accessing arrays with sightly in AEM

Here we will discuss about:
· How to use arrays with slightly
· How to compare
· How to use API - Some scenarios


Arrays :
Here a sample around arrays:
// accessing a value from properties
${ properties['jcr:title'] }


// printing an array
${ aemComponent.names }


Printing the array, separated by ;
${ aemComponent.names @ join=';' }


// dynamically accessing values
<ul data-sly-list="${aemComponent.names}">
<li>${ properties[ item ]}</li>
</ul>


Comparisons:
Here some use-cases on comparing values


<div data-sly-test="${ properties.jcr:title == 'test'}">TEST</div>
<div data-sly-test="${ properties.jcr:title != 'test'}">NOT TEST</div>


<div data-sly-test="${ properties['jcr:title'].length > 3 }">Title is longer than 3</div>
<div data-sly-test="${ properties['jcr:title'].length >= 0 }">Title is longer or equal to zero </div>


<div data-sly-test="${ properties['jcr:title'].length > aemComponent.MAX_LENGTH }">
Title is longer than the limit of ${aemComponent.MAX_LENGTH}
</div>


Now we will look at the API part and some scenarios here:


Use-API :
In my prvious article I explained that you can call methods from your custom-classes via the data-sly-use notation.
Now explaining, you can also pass in parameters from your components.
<div data-sly-use.aemComponent="${'com.myproject.components.SightlyComponent' @ firstName= 'feike', lastName = 'visser'}">
${aemComponent.fullname}
</div>


Java-code in the Use-Api
public class SightlyComponent extends WCMUse {
// firstName and lastName are available via Bindings
public String getFullname() {
return get("firstName", String.class) + " " + get("lastName", String.class);
}
}


The basic notation of the use-api looks like this is a Sightly component.


<div data-sly-use.mycomp="${ 'com.demo.MyComponent'
@ param1='value1', param2=currentPage}">
${mycomp.calculatedValue}
</div>


In this example you have the following:
the class ‘com.demo.MyComponent’ is instantiated
the name ‘mycomp’ is used
two parameters are passed to the class
the method getCalculatedValue() is called

Now let’s look at the implementation of this; you have 5(!) options to implement this:
Class that implements the Use-interface
Class that extends WCMUse-class
Class that is adaptable from Resource (resource.adaptTo(YourClass))
Class that is adaptable from SlingHttpServletRequest (request.adaptTo(YourClass))
Sling models


Below I will do an example of each option, so you can see what is needed for each.
With all 5 scenarios you can switch the implementation without changing anything in your component.


Scenario-1: Class implementing Use-interface

In this case you need to implement init(), and do the all the logic in there. Via the bindings-object you can access all the objects also available on the component.
import io.sightly.java.api.Use;


public class MyComponent implements Use {
private String value;
@Override
public void init(Bindings bindings) {
// all standard objects/binding are available
Resource resource = (Resource) bindings.get("resource");
// parameters are passed as bindings
String param1 = (String) bindings.get("param1");
Page param2 = (Page) bindings.get("param2");
value = param1 + resource.getPath() + param2.getTitle();
}


public String getCalculatedValue() {
return value;
}
}


Scenario-2: Class extending WCMUse
This option is similar like the Use-interface, but has some more helper functionality that you can use. Methods like getResource(), getCurrentPage() etc are already there for you to use.
import com.adobe.cq.sightly.WCMUse;


public class MyComponent extends WCMUse {
private String value;


@Override
public void activate() {
// helper method to get the default bindings
Resource resource = getResource();
// access to the parameters via get()
String param1 = get("param1", String.class);
Page param2 = get("param2", Page.class);
value = param1 + resource.getPath() + param2.getTitle();
}


public String getCalculatedValue() {
return value;
}
}

Scenario-3: Class adaptable from Resource
Code example given here is how to adapt your class from a Resource. Based on that Resource-object you need to pass in the right info to your POJO. In this case you can have a plain POJO without any dependency to AEM or Sightly.
NOTE: In this option you can’t access the parameters
@Component(metatype = true, immediate = true)
@Service
public class MyComponentAdapter implements AdapterFactory {


@Property(name = "adapters")
protected static final String[] ADAPTER_CLASSES = { MyComponent.class.getName() };


@Property(name = "adaptables")
protected static final String[] ADAPTABLE_CLASSES = { Resource.class.getName() };


@Override
public <AdapterType> AdapterType getAdapter(Object adaptable, Class<AdapterType> type) {
if (adaptable instanceof Resource) {
MyComponent comp = new MyComponent();
return (AdapterType) comp;
}
return null;
}
}

Scenario-4: Class adaptable from Request
Like option 3, but now based on the request. Also it is possible here to access the parameters; they are passed in as attributes.
@Component(metatype = true, immediate = true)
@Service
public class MyComponentAdapter implements AdapterFactory {


@Property(name = "adapters")
protected static final String[] ADAPTER_CLASSES = { MyComponent.class.getName() };


@Property(name = "adaptables")
protected static final String[] ADAPTABLE_CLASSES = { SlingHttpServletRequest.class.getName() };


@Override
public <AdapterType> AdapterType getAdapter(Object adaptable, Class<AdapterType> type) {
if (adaptable instanceof SlingHttpServletRequest) {
SlingHttpServletRequest request = (SlingHttpServletRequest) adaptable;
String param1 = (String) request.getAttribute("param1");
Page param2 = (Page) request.getAttribute("param2");
return (AdapterType) new MyComponent();
}
return null;
}
}

Scenario-5: Sling Models
You can technically implement Options 3 and 4 with Apache Sling Models; this saves you from creating your ownadapters. Here’s an example of what that would look like:
@Model(adaptables=Resource.class)
public class MyComponent {


@Inject
private String firstname;
private String value;


@PostConstruct
public void activate() {
value = "calculate " + firstname;
}


public String getCalculatedValue() {
return value;
}
}
Use these test case scenarios and explore slightly !!!




Cheers!!!

Achyuth

Sightly in AEM

Sightly can referred as an HTML templating language, introduced with the version AEM 6.0.

It takes the place of JSP (Java Server Pages) and ESP (ECMAScript Server Pages) as the preferred templating system for HTML. The name “Sightly” (meaning “pleasing to the eye”) highlights its focus on keeping your markup beautiful, and thus maintainable, once made dynamic.
As in all HTML server-side templating systems, a Sightly file defines the output sent to the browser by specifying the HTML itself, some basic presentation logic and variables to be evaluated at runtime.

Why we use Sightly?

. Security by Default

· Separation of Concerns
· Sightly is HTML5

How to use Sightly ?

Every Sightly file is an HTML5 document or fragment, augmented with a specific syntax that adds the dynamic functionality.

 Here's a first example:
           <h1 data-sly-test="${properties.jcr:title}">
           ${properties.jcr:title}
           </h1>


Two different kind of syntaxes have to be distinguished:

Sightly Block Statements
To define structural block elements within Sightly file, Sightly employs HTML5 data attributes. This allows to attach behavior to existing HTML elements. All Sightly-specific attributes are prefixed with data-sly.

Sightly Expressions
Sightly expressions are delimited by characters ${ and }. At runtime, these expressions are evaluated and their value is injected into the outgoing HTML stream. They can occur within the HTML text or within HTML attribute values.


<p data-sly-use.logic="logic.js">
<a href="${logic.link}">
${logic.text}
</a>
</p>


<h1 data-sly-test="${currentPage.title}">
<a href="${currentPage.path}.html">
${currentPage.title}
</a>
</h1>


Explanation for better understanding:
Line 1: The data-sly-test statement checks if the page title exists and is not empty. If so, the<h1> element and its content is displayed, otherwise it is removed altogether.
Line 2: This expression renders the page path into the href attribute. Since Sightly knows the HTML syntax, href and src attributes are automatically protected against cross-site scripting (XSS) injections accordingly. For instance if the variable contained a javascript: URL, it would have been removed.
Line 3: This expression displays the page title as text. Many special characters are escaped to make it impossible to inject cross-site scripts.

Goals:

The main goals /objectives of sightly are :
– giving back the markup, and not mixing it with code
– everything is secure, by default
– smoothen the workflow between the designer and the developer


Scenario-1:
<div>currentPageTitle : ${currentPage.title}</div>


Well that looks like a JSP, but not quite. Two main differences:
Extension of the file is changed to .html
We have only markup in the file, no inclusion of a global.jsp, just markup. So in case a designer wants to look at the file he can just open it in his tools


Scenario-2:
<div data-sly-test="${wcmmode.edit}">Showing this only in edit mode to the author</div>
When the expression inside data-sly-test evaluates to false the whole tag while be hidden in the markup.


Scenario-3:
<div data-sly-test.author="${wcmmode.edit || wcmmode.design}">
Show this to the author
</div>
<div data-sly-test="${!author}">
Not in author mode anymore.
</div>
data-sly-test also supports the naming and reuse of tests, we have an expression ‘author’ that we want to reuse in other data-sly-test attributes.
These are very common use-cases and can now be done without writing any code are extension.


Scenario4: 

<div data-sly-text="${currentPage.title}">My page title</div>

data-sly-text will replace the value of the HTML-element with the expression of the data-sly-text.
In the example above the page-title will be printed. But the mock value can still be in there to make it easier to view the file in HTML-editors.


Scenario-5:
<ul data-sly-list.child="${currentPage.listChildren}"> <li>${child.title}</li>
</ul>

Here you see an example of a loop, the list object is passed to the data-sly-list attribute. Based on the name (‘child’) you can reference each item in the loop.The output is here that see you a list of the subpages with all the page-titles.


Scenario-6:
<ul data-sly-list.child="${currentPage.listChildren}">
<li class="${ childList.odd ? 'odd' : 'even'}">${child.title}</li>
</ul>


Observations are:
inside a data-sly-list you have access to a list-variable that contain things like : index, count, odd, even, first, last, middle
in the expression you see the use of the ternary operator


Scenario-7:

<div data-sly-resource="${ @path='par', resourceType='foundation/components/parsys'}"></div>

With data-sly-resource you can include components and resources. In the above sample you include of standard cq parsys in your template.


Scenario-8: 

 <footer data-sly-resource="${ @ path='footer', resourceType='myproject/footer', wcmmode='disabled'}"></footer>

So you are in need to disable the wcmmode for a specific component? That can now be done via the wcmmode-option when including a component.


Scenario-9: 

${pageProperties.jcr:title || properties.title || "No title"}

Within an expression you can use the ‘or’ operator to define fallbacks in case properties are empty. You read the expression from left to right, in the example here “No title” is shown when jcr:title and properties.title are both empty.


Scenario-10:

<div data-sly-include="/libs/wcm/core/components/init/init.jsp"></div>

<div data-sly-include="mytestfile.html"></div>




Via data-sly-include you can include other files like the cq:include tag. From sightly you can still use and re-use JSP files if you want. Like shown here for the author-environment.


We will discuss more in detail in our next posts.


Cheers!!!
Achyuth