Comparing XDomainRequest and XMLHttpRequest for IE8 and IE9: A detailed analysis

I am feeling pretty lost when it comes to understanding the XMLHttpRequest and XDomainRequest renaissance, and I could really use some guidance. Here are my thoughts so far:

  1. It seems like the XDomainRequest in IE8 and IE9 is some sort of subclass of XMLHttpRequest.
  2. One major missing feature of XDomainRequest is the "withCredentials" property.
  3. XDomainRequest also lacks the "onLoad" event, requiring the use of state and status checks instead. However, onLoad is available if you instantiate XDomainRequest in IE8 and IE9, but not with an XMLHttpRequest in those browsers
  4. Data submitted by XDomainRequest is sent as plain text rather than as a form, meaning you have to parse the input stream on the backend.
  5. Even if the CORS server allows for reading the Set-Cookie header for client-side access, XDomainRequest does not expose this information, making it impossible to use session IDs stored in cookies for authentication.
  6. Lastly, XDomainRequest only supports POST and GET HTTP methods, limiting its usability for RESTful web services.

This list is not exhaustive and is based on my own observations. The situation becomes confusing for me because I have a specific application requirement where I need to:

  • Retrieve an encryption key and associated session ID (cross-domain) via GET request.
  • Encrypt a user's password using this key.
  • Log in to the cross-domain service using a POST request with x-www-form-urlencoded username and encrypted password.

Due to the limitations mentioned above, I cannot achieve this using XDomainRequest:

  • The restriction of sending plain text data with XDomainRequest.open() poses an issue since the third-party application expects form data format.
  • The session ID received along with the encryption key through Set-Cookie header is not included in the login request headers since XDomainRequest does not expose headers.

Interestingly, disregarding these limitations and using XMLHttpRequest in IE8 and IE9 works just fine! While the onload event might be missing and the "withcredentials" functionality unclear, IE8 and IE9 seem to handle cross-domain requests without issue. This paradoxes prompt me to seek clarification: why do these contradictory behaviors exist? Is there a scenario where one can use XMLHttpRequest and not XDomainRequest? Has there been any updates addressing these issues in IE8 and IE9?

Your insights would be invaluable. Thank you, Yiannis

Answer №1

First and foremost, it's important to acknowledge the following:

One key point to note is that in IE11, the XDomainRequest object has been deprecated and is no longer available in IE11 Edge mode.

1) What exactly is the XDomainRequest and why did Internet Explorer have this object? Back when the W3C was developing the XMLHTTPRequest 2 spec, all browsers were building on top of the level 1 XMLHTTPRequest. However, Microsoft decided to create the XDomainRequest, which is not a subclass but rather a non-standard feature exclusive to IE.

2) Yes, it is true that XDomainRequest does not support "withCredentials". This limitation exists because:

Due to concerns about the abuse of user credentials (such as cookies, HTTP credentials, client certificates, etc.), XDomainRequest strips away cookies and credentials, disregards any authentication challenges, and ignores Set-Cookie directives in the HTTP response. Additionally, previously-authenticated connections are not reused for XDomainRequests, specifically due to the per-connection based nature of certain Windows authentication protocols like NTLM/Kerberos.

4)

It should be noted that as of 2014, XDomainRequest does not include a Content-Type header at all. The timeline for this change remains unclear.

And so forth. This answer serves as a historical reference.

Avoid using XDomainRequest. It represents an outdated and problematic non-standard feature.

For further information, refer to these resources:

  1. http://www.html5rocks.com/en/tutorials/cors/
  2. http://msdn.microsoft.com/en-us/library/ie/cc288060%28v=vs.85%29.aspx
  3. https://developer.mozilla.org/en-US/docs/Web/API/XDomainRequest

Answer №2

Even though Internet Explorer 8 and 9 have no issue with using XMLHttpRequest for cross domain requests.

This statement is incorrect. The proper method to send CORS in IE8/9 is by utilizing the non-standard XDomainRequest.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Shopify module is throwing an error stating that React is not defined

I wanted to create my first Shopify module, but I encountered an error in my application page on the shop while using React. Here is my index.js code: import {Page} from "@shopify/polaris"; import {ResourcePicker} from "@shopify/app-bridge- ...

Convert JavaScript back into an HTML attribute

Is there a way to include a JavaScript code in an HTML attribute like shown below? <div class="xx" animation="yy" animate-duration="<script>Code goes here<script>" ...> </div> I'm struggling to figure it out, is there a solut ...

Ways to insert HTML text into an external webpage's div element without using an iframe

Is it possible to generate HTML and SVG code based on the position of a Subscriber on a web page or within a specific div? I would like to provide some JavaScript code that can be inserted inside a particular div on the page. Using an iframe is not ideal ...

Is utilizing getStaticProps the best approach for handling offline data in Next.js?

My current project in Next.js involves offline static data for the webpage content. I am using an array to store the data for later mapping. Do you recommend using getStaticProps in this scenario? For example, here is a snippet of my code: import { data } ...

Create a custom Angular directive that allows you to replace tags while inserting the template

I have created a custom directive that can take templates based on the attribute provided. Check out the Plnkr example JS var app = angular.module('app', []); app.directive('sample', function($compile){ var template1 = '<d ...

Dealing with numerous Ajax calls within a single Ajax request

I am utilizing the $http method in angularjs to retrieve multiple "parent" elements. Within the success method of these Ajax calls, I need to loop through the parent elements and make another Ajax call for each parent element to fetch its corresponding chi ...

The Quivering Quandaries of Implementing Jquery Accordions

For a demonstration of the issue, please visit http://jsbin.com/omuqo. Upon opening a panel by clicking on the handle, there is a slight jitter in the panels below during the animation. In the provided demo, all panels should remain completely still as t ...

Basic application - angular has not been declared

I'm currently diving into the realm of javascript and angularjs, following along with the tutorials on . After setting up a basic IntelliJ javascript project, I created two essential files: index.html <!DOCTYPE html> <html lang="en"> ...

AngularJS - activating $watch/$observe event handlers

I am looking for a way to trigger all $watch/$observe listeners, even if the watched/observed value has not changed. This would allow me to implement a "testing only" feature that refreshes the current page/view without requiring user interaction. I have a ...

Revive the JavaScript library for handling mouse wheel events

Utilizing the wheel-indicator JavaScript library, I am looking to revert the mouse wheel event back to its original state after it was initially set to preventDefault(). Despite attempting to use indicator.setOptions({preventMouse:"false"}) as suggested b ...

Encountered a connection error in the Spring Boot application: net::ERR_CONNECTION_REF

Currently working on a school project developing a Spring Boot application using Restful. The application runs smoothly locally, but when deployed to AWS, I am encountering an "net::ERR_CONNECTION_REFUSED" error for all my GET and POST requests sent to the ...

Unable to switch checkbox state is not working in Material UI React

I am experiencing an issue with the Material UI checkbox component. Although I am able to toggle the state onCheck in the console, the check mark does not actually toggle in the UI. What could be causing this discrepancy? class CheckboxInteractivity exten ...

Ways to access the props value within the lifecycle hooks of Vue JS

Is there a way to retrieve the value of props using lifecycle hooks such as mounted or updated, and then store that value in my v-model with additional text? I've been struggling to achieve this. I attempted using :value on the input element with bot ...

Creating a clickable map for a PNG image: Step-by-step tutorial

My goal is to create a interactive map similar to this one. Click here for the image ...

What is the best way to call an Angular component function from a global function, ensuring compatibility with IE11?

Currently, I am facing a challenge while integrating the Mastercard payment gateway api into an Angular-based application. The api requires a callback for success and error handling, which is passed through the data-error and data-success attributes of the ...

Enable or disable dropdown based on selected radio button status

I need the dropdown to be disabled unless the radio button labeled prov is selected. It should only be enabled when prov is chosen. I attempted to create a demo, but it's not functioning correctly and I can't figure out why. HTML: <td colsp ...

Utilizing Angular Components Across Various Layers: A Guide

Consider the following component structure: app1 -- app1.component.html -- app1.component.ts parent1 parent2 app2 -- app2.component.html -- app2.component.ts Is it possible to efficiently reuse the app2 component within the ap ...

The $http.get in AngularJS is causing a problem by returning undefined and $http() is not being recognized

I am currently working on an app that is designed to load and display data dynamically from a database using AngularJS. However, I have been encountering errors when trying to access my API using both $http() and $http.get(). The specific errors I am recei ...

JavaScript: Collection of Pictures

I've recently begun my journey into HTML and JavaScript by working on a basic website that showcases four images using a for loop. However, upon viewing the website in a browser, I noticed that only the names of the images are displayed, not the actua ...

What is the best way to define these variables at a global scope within my controller?

In my controller (NodeJS/Express), I have 10 routes that all use the same variables 'startDate' and 'endDate'. Is there a way to declare these globally so they don't need to be repeated in each route? Currently, my code checks if ...