I need to know how can I call and a Response of rest end point after clicking on web item ?

Akshay Mane
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
February 24, 2025

I have implemented a custom "Translate" button in Confluence using UI Fragments (Web Items). When clicked, the button triggers a REST endpoint, which:

  1. Fetches the page content
  2. Sends it to an external translation API
  3. Receives the translated content in JSON format
  4. Displays the translated content

Currently, clicking the button opens a new tab that returns a JSON response. Instead, I want the translation to:

  • Replace the existing text dynamically on the same page
  • Format the translated content in HTML rather than returning raw JSON

Implementation Approach

I plan to use AJAX to call the REST API asynchronously and update the page’s DOM without requiring a page reload. My questions are:

  1. Where should I place the AJAX request?
    • Should it be inside the Web Item's JavaScript or somewhere else? Because i couldnt find any place to write javascript here.
  2. How do I modify the page content dynamically?
    • Should I replace the entire body using innerHTML, or is there a better way to handle translations efficiently?
  3. How can I ensure that the Confluence editor retains the original content (i.e., does not permanently override it)?

Current Setup

  • Web Item (UI Fragment) → Calls REST API
  • REST API fetches page content and sends it to a translation service
  • Response is currently displayed as JSON in a new tab

I want the button to consume the REST endpoint dynamically and apply the translation directly to the page’s body/content instead of redirecting to a new tab. 
Or do I have to instead go with macros?

Would appreciate any insights or best practices on handling this in Confluence! 🚀

0 answers

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events