Angular 5在IE9上不起作用

Question

enter image description here I have Angular Apps that works fine on IE11, But when I run it on IE9 I got the following error

observable error: Error: Access is denied.

SCRIPT438: Object doesn't support property or method 'apply' localhost:4200, line 1 character 1

It fails in the following

const headers = new Headers({ 'Content-Type': 'text/xml',
    'cache-control': 'no-cache',
    'Access-Control-Allow-Methods':'POST, GET, OPTIONS',
    'Access-Control-Allow-Origin':'*'});
    let RetCaseNumner=''
    const options = new RequestOptions({ headers: headers });

    return this.http.post(this.url, this.jsonBody, options)
            .map((res: Response) => {           
            let ret =JSON.parse(res.text())
            let ResponseBody =   ret.EventMessageResponse.Response.ResponseBody
            xml2js.parseString(ResponseBody,function(err, result){
                RetCaseNumner =result.Result.CaseNumber[0]
                return RetCaseNumner;
            });
            return RetCaseNumner
        })
    .do(data => console.log('Inside do Case Number: ' + (data)))
    .catch(this.handleError);

Here is my pollyfills.ts

// This file includes polyfills needed by Angular and is loaded before the app.
// You can add your own extra polyfills to this file.
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
//This get rid of SCRIPT438: Object doesn't support property or method 'apply'
import 'core-js/es7/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/weak-set';
import 'core-js/es6/typed';
import 'core-js/es6/set';

import 'core-js/es6/reflect';

import 'core-js/es7/reflect';
(window as any).__Zone_enable_cross_context_check = true;

import 'zone.js/dist/zone';
import 'zone.js/dist/long-stack-trace-zone';
// If you need to support the browsers/features below, uncomment the import
// and run `npm install import-name-here';
// Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html

// Needed for: IE9
// import 'classlist.js';

// Animations
// Needed for: All but Chrome and Firefox, Not supported in IE9
// import 'web-animations-js';

// Date, currency, decimal and percent pipes
// Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
// import 'intl';
// import 'intl/locale-data/jsonp/en';

// NgClass on SVG elements
// Needed for: IE10, IE11
 import 'classlist.js';



/**
 * rxjs
 */
import 'rxjs/bundles/Rx';
import 'rxjs/add/observable/interval';
import 'rxjs/add/observable/merge';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/takeUntil';
import 'rxjs/add/operator/throttleTime';
import 'rxjs/add/operator/timeInterval';
import 'rxjs/add/operator/toPromise';

//This get rid of SCRIPT438: Object doesn't support property or method 'apply'
// import '@angular/core/bundles/core.umd';
import '@angular/common/bundles/common.umd';
import '@angular/compiler/bundles/compiler.umd';
import '@angular/platform-browser/bundles/platform-browser.umd';
import '@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd'
import 'ie9-oninput-polyfill';
import 'angular-polyfills/dist/blob';
import 'angular-polyfills/dist/classlist';
import 'angular-polyfills/dist/formdata';
import 'angular-polyfills/dist/intl';
import 'angular-polyfills/dist/shim';
import 'angular-polyfills/dist/typedarray';
import 'console-polyfill';

What Did I do wrong ? Did I miss something ?

Answer 1

IE < 10 does not have CORS (Cross Origin Resource Sharing) support. If you have code that is sending an AJAX call using CORS, you will not be able to support IE < 11.

Supposedly IE 10 has support for CORS, but it was still throwing errors in my case. I tried to implement some xdomain solutions but I couldn't get that to work either. IE was just too buggy.

I would recommend not supporting IE since MS has seemed to abandon it anyway. Since I haven't seen any elegant ways of doing that posted anywhere, I'll go ahead and put my workaround here:

You can detect Internet Explorer < 10 using apache, so I created a special landing page that I redirect all IE < 10 traffic to.

<IfModule mod_rewrite.c>
    RewriteEngine on

    RewriteCond %{HTTP_USER_AGENT} .*MSIE.*
    RewriteCond %{REQUEST_URI} !\.(css)$
    RewriteRule ^(.*) ie.html

</IfModule>

In order to make sure that file is included in the build, make sure to add it to your assets block in .angular-cli.json:

... 
"apps": [
{
  ...
  "assets": [
    ...
    "ie.html"
  ],