๐Ÿ” Embed Another Oracle APEX Application Page Using URL Region (Seamless UX)

๐Ÿ” Embed Another Oracle APEX Application Page Using URL Region (Seamless UX)

1. Introduction

In Oracle APEX applications, delivering a seamless and consistent user experience across multiple applications is often a key requirementโ€”especially when those applications live within the same workspace.

In this blog post, Iโ€™ll share a practical approach to embedding a page from one Oracle APEX application into another, without users even realizing theyโ€™re switching applications. The navigation menu remains the same, thereโ€™s no second login prompt, and the experience feels completely unified.

After some research, I decided to use the URL Region available in Oracle APEX. Surprisingly, even after more than 10 years of working with APEX, this was my first real use case for it! While this approach may not be perfect for every scenario, it worked flawlessly for my clientโ€™s requirements.

If you know alternative or better approaches, Iโ€™d love to hear your thoughts in the comments ๐Ÿ˜‰


2. Tools and Technologies

The following tools and features are used to implement this solution:

  • Oracle APEX
  • URL Region (iFrame)
  • Session Sharing
  • JavaScript
  • CSS

3. Business Requirement

In enterprise environments, applications are often split into multiple APEX apps for modularity, security, or team ownership.

The Challenge:

  • Display a page from Application 2 inside Application 1
  • Keep the navigation menu of Application 1
  • Avoid multiple login prompts
  • Ensure full width & height display
  • Remove duplicate headers and navigation bars

The Solution:

  • Use URL Region to embed the page
  • Enable Session Sharing between applications
  • Adjust iFrame dimensions with CSS
  • Hide extra headers using JavaScript

โœ” Seamless user experience

โœ” No re-authentication

โœ” Consistent navigation

โœ” Clean UI


4. Implementation Steps


1๏ธโƒฃ Prerequisites

Make sure you have:

  • Access to an Oracle APEX Instance โœ…
  • Application 1 (Main Application) โœ…
  • Application 2 (Application containing the page to embed) โœ…

2๏ธโƒฃ Create a URL Region in Application 1

  1. Log in to your APEX Workspace
  2. Navigate to Application 1
  3. Create a new blank page
  4. Add a URL Region to the Full Width Content slot
  5. In the Attributes section, enter the URL of Application B:
f?p=123341:home:&SESSION.


๐Ÿ“Œ Replace the application alias and page number as required.

3๏ธโƒฃ First Run โ€“ What Goes Wrong?

After running the page, youโ€™ll notice three problems:

โŒ A new login screen appears

โŒ The URL region does not occupy full width and height

โŒ oracleapex.com refused to connect.

Letโ€™s fix them one by one.


4๏ธโƒฃ First Problem: Authentication (Session Sharing)

To avoid the second login prompt, Oracle APEX provides Session Sharing.

Steps:

  1. Go to Application 2
  2. Navigate to Shared Components
  3. Open Authentication Schemes
  4. Edit the active Authentication Scheme
  5. Scroll to Session Sharing
  6. Set:
    • Type: Custom
    • Cookie Name: SESSION

Now refresh Application 1. If you get the error in Iframe repeat the same step 4 for Application 1.

โœ… Login issue resolved!


5๏ธโƒฃ Second Problem: iFrame Width & Height

To make the URL region fill the entire space, update the iFrame Attributes in the URL Region:

id="iframe" height="100%" width="100%" frameborder="0"


After refreshing, the width looks fineโ€”but the height still doesnโ€™t fill the page ๐Ÿค”

6๏ธโƒฃ Fixing Full Height Using CSS

The issue occurs because parent containers donโ€™t have full height.

Add the following CSS using Inline CSS Code Editor:

.i-h640>.t-Region-bodyWrap>.t-Region-body {
    block-size: 1000px !important;
}

Refresh the page again.

โœ… iFrame now fills both width and height perfectly!


7๏ธโƒฃ Third Problem: oracleapex.com refused to connect.

To fix this, follow bellow step.

Open Application 2 (the one you are trying to display inside the frame).

Go to Shared Components.

Under the “Security” section, click Security Attributes.

Scroll down to the Browser Security section.

Find the setting Embed in Frames.

Change it to Allow from same origin.

  • Note: If “Allow from same origin” still fails, try setting it to Allow to test, but be aware this reduces security.

Click Apply Changes.


8๏ธโƒฃ Assign an ID to the iFrame

In the URL Regionโ€™s iFrame Attributes, add:

id="iframe"

9๏ธโƒฃ Hide Header Using JavaScript

If you want to hide header for Iframe Application then Add the following code to Execute when Page Loads:

const iframe = document.getElementById("iframe");

iframe.addEventListener("load", () => {
    const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
    const style = iframeDoc.createElement("style");
    style.textContent = ".t-Header { display: none !important; }";
    iframeDoc.head.appendChild(style);
});

This script waits for the iframe to load and then hides the APEX header only inside the embedded page.


๐Ÿ”Ÿ Save and Run the Page

๐ŸŽ‰ And there you go!

  • Single navigation menu
  • No additional login
  • Full width & height embedded page
  • Clean, seamless experience

5. Final Output

โœ” Embedded page from another APEX application

โœ” Unified navigation experience

โœ” No re-authentication

โœ” Full-screen responsive layout

โœ” Clean UI without duplicate headers


๐Ÿ Conclusion

Embedding a page from another Oracle APEX application using the URL Region is a simple yet effective way to create a seamless multi-application experience within the same workspace.

By combining:

  • Session Sharing
  • iFrame configuration
  • CSS adjustments
  • JavaScript enhancements

โ€ฆyou can deliver a smooth and professional UI without complex integrations. While this solution may not fit every use case, it works exceptionally well when plug-ins or deep refactoring arenโ€™t an option.


๐Ÿ”— Final Thoughts

If you found this blog useful:

๐Ÿ‘ Like

๐Ÿ”„ Share with your APEX friends

๐Ÿ’ฌ Comment your ideas or improvements

๐Ÿ“Œ Bookmark for future reference

Happy APEXing! ๐Ÿš€

Love coding? Me too! Letโ€™s keep in touch โ€“ subscribe to my website for regular chats on Oracle APEX, PL/SQL,SQL JavaScript, and CSS.

Comments

No comments yet. Why don’t you start the discussion?

    Leave a Reply

    Your email address will not be published. Required fields are marked *