Mastering Consuming Liferay Headless APIs

Course Overview

Comparing Frontend API Approaches

Liferay offers multiple pathways for frontend API consumption, each with distinct characteristics. In this lesson, you'll explore their differences and similarities to ensure you're equipped to select the most suitable methods for your applications.

Comparing API Call Methods

As there are multiple ways to consume Liferay's APIs in a frontend context, it's essential to compare and contrast the differences between approaches in order to understand where each method is most effective.

Call Method Custom Fragments Frontend Custom Elements External Applications
Where it runs Inside Liferay Outside Liferay Outside Liferay
API Call Method fetch (client-side) or restClient (server-side) fetch (client-side) Only headless APIs
Authentication Automatic via session (JSESSIONID) Automatic via session (JSESSIONID) OAuth 2.0
Security Token Liferay.authToken (for CSRF protection) Liferay.authToken (for CSRF protection) OAuth 2.0
Data Processing Can offload processing to Liferay's server Must process data on the client side Must process data on the external application side
Scalability Server-side execution can handle more processing Load is distributed across client browsers Load is distributed across the external application
Use Case Injecting dynamic content into Liferay pages Fully decoupled micro frontends Displaying Liferay content in external applications

 

In particular, consider these primary differences when deciding which approach to use:

  • Authentication: Both fragments and frontend client extensions are rendered within the same page where a Liferay session is active, allowing them to use cookie-based authentication. External headless frontends run outside of Liferay, however, requiring OAuth 2.0.
  • Access to restClient: Unlike fragments, client extensions and external applications must make direct API calls, handling authentication and request headers themselves.
  • Security and API Access Control: Applications not bound to Liferay sessions (such as external applications) require carefully scoped API access with OAuth 2.0 to prevent over-permissioning, while fragments and some client extensions can leverage role information from user sessions.

Comparing Client-to-Server and Server-to-Server Calls

Where Liferay sessions are active, such as for API calls within fragments, both client-to-server and server-to-server calls can be considered. When deciding between types of calls, several key factors come into play as each approach has its strengths and limitations. 

  • Scalability: Client-to-server calls scale better by distributing workload across browsers, ideal for dynamic, user-intensive applications.
  • Security: Server-to-server calls offer better control over sensitive data as this processing happens entirely within Liferay.
  • Performance: Client-to-server calls are generally faster for dynamic interactions, while server-to-server calls can introduce additional latency.
  • Data Control: Server-to-server calls enable pre-processing and data filtering before it reaches the client, reducing exposure risks.

Deciding Between Call Types

Depending on the requirements of your calls and the broader application details, both client-to-server and server-to-server call types may be appropriate for different situations. Consider the following additional guidance when deciding between call types.

Scalability

Client-to-server calls scale effectively, as workload is distributed across clients. Each client interacts directly with the API, freeing the server to focus on responses without processing calls itself. This makes it an excellent choice in high-traffic applications with concurrent user queries.

Alternately, server-to-server calls via restClient centralize processing, offering control but creating a potential bottleneck. High traffic, like multiple users accessing object details in a restClient fragment, increases server resource usage while the server processes and responds to each API call.

Security

Client-to-server calls expose request and response data to the browser, requiring caution with sensitive information. While suitable for non-critical data like UI elements, it's less ideal for handling confidential content.

Conversely, security is enhanced with server-to-server calls due to internal data processing, which shields sensitive data from client or browser exposure. This is optimal for scenarios requiring strict data privacy, such as accessing confidential user information.

Performance

Client-to-server calls offer faster dynamic UI updates via direct browser-API communication, reducing data travel time. For example, direct client-side API filtering enhances user responsiveness by calling APIs directly from the client.

Server-to-server calls, however, add processing overhead within the Liferay server. This potentially slows response times, notably for fragments with frequent or complex API calls.

Data Control

Client-to-server calls send raw API responses directly, potentially exposing unnecessary fields or sensitive data. While API parameters can limit retrieval, the full API response remains accessible to the client.

Server-to-server calls instead offer data pre-processing and control via restClient for fragments, ensuring clients receive only necessary information by aggregating, filtering, or modifying response data on the server. This simplifies frontend development and enhances security by limiting data exposure.

Flexibility

Client-to-server calls offer greater flexibility for interactive, dynamic UIs. Browsers handling these requests enables easy integration with JavaScript frameworks for seamless user interactions. Server-to-server restClient supports only GET requests, making it suitable for read-only data but less versatile for advanced operations like POST or PUT.

Choosing client-to-server or server-to-server calls should align with your application's needs. Opt for client-to-server calls in fragments for scalability and speed, and server-to-server calls for secure and controlled data handling. For dynamic updates, such as displaying new tickets in real-time when a user applies filters or searches, client-to-server calls are ideal where possible. To display elements as part of a static dashboards, you can use restClient server-to-server calls. Balancing these factors ensures efficient and secure API consumption.

Conclusion

Comparing the differences between frontend API calls is essential in choosing appropriate approaches. Scalability, security, performance, data control, and flexibility needs should guide your choices depending on the requirements of your applications. Next, you'll learn about consuming Liferay APIs within backend processes.

  • Comparing API Call Methods

  • Comparing Client-to-Server and Server-to-Server Calls

  • Deciding Between Call Types

  • Conclusion

Loading Knowledge

Capabilities

Product

Education

Contact Us

Connect

Powered by Liferay
© 2024 Liferay Inc. All Rights Reserved • Privacy Policy