How to call REST API using current instance of internet explorer extension

[Girish Dubey]

How to call REST API using current instance of internet explorer. I am working on extension for fill the form dynamicly and data comes from REST API. but for authontation we have to login on that application e.g.

 

REST API URL: http://dataservice.com/getusers.json

Login page: http://dataservice.com/login.aspx

 

and i wanted to fill data on another application

 

Form page url: http://localservice.com/users.aspx

 

and i have already logged in on http://dataservice.com domain and wanted to get data using internet explorer extension and fill form on second application which is available on different domain. 

so can you suggest me how it can be possible through Internet Explorer extension.

[Ysawina]

To call a REST API using an Internet Explorer extension, you can utilize JavaScript and the XMLHttpRequest object. Here's an example of how you can achieve this:

First, make sure you have the necessary permissions in your extension manifest to access external domains. Add the following line to your manifest.json file:
"permissions": [
  "http://dataservice.com/*",
  "http://localservice.com/*"
]

In your Internet Explorer extension code, you'll need to create a function to handle the API request. Here's a sample function that performs a GET request to the REST API and logs the response:
function callAPI() {
  var xhr = new XMLHttpRequest();
  xhr.open("GET", "http://dataservice.com/getusers.json", true);

  // Set any necessary headers, e.g., for authentication
  // xhr.setRequestHeader("Authorization", "Bearer YOUR_ACCESS_TOKEN");

  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
      if (xhr.status === 200) {
        var response = JSON.parse(xhr.responseText);
        console.log(response);
        
        // Once you have the response, you can process it and fill the form on the second application.
        // You may need to manipulate the DOM of the second application to fill the form dynamically.
        // You can use JavaScript methods like document.getElementById() or jQuery to interact with the form elements.
      } else {
        console.log("Request failed. Status: " + xhr.status);
      }
    }
  };

  xhr.send();
}

Now, you need to call the callAPI() function at an appropriate time in your extension. It can be triggered by a button click, a specific event, or when the extension is loaded. For example, you can add an event listener to a button element like this:
document.getElementById("your-button-id").addEventListener("click", callAPI);

Finally, you will need to inject your JavaScript code into the page where the form is located. This can be done using the execScript method in Internet Explorer extensions. For example:
window.onload = function() {
  window.external.AutoCompleteSaveForm(document);
  window.external.AddSearchProvider("http://example.com/searchprovider.xml");
  
  // Inject your JavaScript code here
  window.execScript("callAPI();");
};

Make sure to replace "your-button-id" with the actual ID of the button you want to trigger the API call.

Remember that Internet Explorer is an outdated browser, and Microsoft has ended support for it. It's recommended to consider using modern browsers and techniques for building extensions and working with REST APIs.