3.7: Cross-Origin Delete File Support for IE9 and IE8

Previously, support for the delete file feature for cross-origin environments excluded IE9 and older as these browsers
do not support cross-origin requests via XMLHttpRequest, among other restrictions. IE9 and IE8 are now supported as of 3.7, however IE7 is not due to the lack of any XMLHttpRequest-like CORS support in this version of Internet Explorer. Theoretically, this could be accomplished by making use of a hidden iframe, as is currently done to support file upload request in IE9 and older, but this would add yet another layer of complexity to the code for the delete file feature and it is not clear that the low IE7 market share merits this additional complexity.

If you do not want to enable cross-origin delete file requests in IE9 and IE8, simply ensure the allowXdr property of the cors option is set to false. This is the default value of this property.

Enabling

As of Fine Uploader 3.7, you may optionally enable support for the delete file feature in IE9 and IE8 for cross-origin environments, provided you:

var uploader = new qq.FineUploader({
  element: document.getElementById("myFineUploader"),
  request: {
    endpoint: 'my/endpoint'
  },
  cors: {
    expected: true,
    allowXdr: true
  }
  deleteFile: {
    enabled: true,
    method: 'POST'
  }
});

Support for the delete file feature in cross-origin environment in IE9 and IE8 is disabled, by default, due to the limitations that come along with use of IE’s XDomainRequest If you elect to enable this type of support, you will need to adjust your server code appropriately and be aware of the limitations associated with XDomainRequest.

Limitations of delete file requests in IE9 and IE8 (XDomainRequest)

While 3.7 now provides support for the delete file feature in IE9 and IE8, this enhancement is not without its own limitations, thanks to Internet Explorer’s XDomainRequest. XDomainRequest is one of many examples of Microsoft creating proprietary short-sighted standards in IE. We are forced to use XDomainRequest in IE9 and IE8 if we want to send cross-origin ajax requests. Keep in mind that XDomainRequest comes with the following limitations in the context of the delete file feature:

  • You may not send any custom headers. This means that the customHeaders property of the deleteFile option will be ignored in cross-origin environments when the user agent is IE9 or IE8.
  • Only POST requests may be sent. Technically, XDomainRequest allows you to use GET as well, but that isn’t an appropriate method for deleting a file, so Fine Uploader won’t allow this. So, you must set the method property of the deleteFile option to “POST”. See the Fine Uploader blog post on using the POST method to send delete file requests for more details.
  • The Content-Type of the request cannot be defined. XDomainRequest does not permit you to set any custom headers, and, as a result, you will find that the Content-Type header is absent from the request when you attempt to parse it server-side. This will likely require additional server-side code to parse POST requests with a missing Content-Type header.
  • Credentials (cookies) will not be sent with the request. This means that the sendCredentials property of the cors option will be ignored in IE9 and IE8 for all cross-origin delete file requests.

Handling delete file requests in IE9 and IE8 server-side

The java example has already been modified to handle delete file cross-origin requests sent by XDomainRequest. Have a look at the RequestParser class for implementation details. Other server-side examples will be modified in the near future to handle these requests. In the meantime, please read on if you would like to modify your own server-side code.

Since IE will not send a Content-Type header with any XDomainRequests (as noted above), many server-side libraries/frameworks will not parse the contents of a POST request sent via XDomainRequest. This means that you will need to do one of two things:

  • “Trick” whatever library or framework you are using into thinking that the request has a Content-Type header of “application/x-www-form-urlencoded”. This may be easy or quite difficult, depending on the framework/library. If it is possible though, this may be enough to handle XDR POST requests.
  • Failing faking out whatever library you are using to parse requests, you will need to write your own code to parse URL encoded POST request payloads. More specifically, you will need to include some logic in your server-side code that equates realizes POST requests from Fine Uploader without Content-Type headers actually contain URL encoded payloads. This code will need to parse the payload into parameters. This really shouldn’t be very difficult, but it is a bit of an annoyance.

Preflighting can now be avoided

One additional benefit provided here is the ability to ensure cross-origin delete file requests are not preflighted. Remember that preflighting was discussed in the initial CORS support blog post, and, before this enhancement, all delete file requests sent by Fine Uploader were preflighted. Now, you can avoid preflighting entirely for delete file requests simply by setting the method property of the deleteFile option to “POST”. While this change is required for IE9 and IE8 support of the delete file feature for cross-origin environments, you do not need to allow XDR requests (enable support in IE9/IE8) to prevent preflighting in other browsers.

Happy Uploading!

– Ray Nicholus and the rest of Widen