Angular-File-Upload не работает с Internet Explorer

Я использую библиотеку загрузки файлов Angular.

https://github.com/nervgh/angular-file-upload

и мне удалось реализовать, работает во всех браузерах, кроме Internet Explorer. Я использую Internet Explorer 11 и внедрил исправление, предложенное на сайте nervgh/afu, которое включает в себя файл shim and sham для старых браузеров. IE 11 не старше, но решил попробовать.

Код стандартный для библиотеки, поэтому показывать особо нечего. У меня сейчас есть эта ошибка, но я не знаю, что она мне говорит?

HTML1300: Navigation occurred.
File: precisionfarming
onAfterAddingAll [object Object]
"onAfterAddingAll"
[
  0: { },
  length: 1
]

onBeforeUploadItem [object Object]
"onBeforeUploadItem"
{
  [functions]: ,
  $$hashKey: "object:105",
  __proto__: { },
  _file: { },
  _input: null,
  alias: "file",
  disableMultipart: false,
  file: { },
  formData: [ ],
  headers: { },
  index: 1,
  isCancel: false,
  isError: false,
  isReady: true,
  isSuccess: false,
  isUploaded: false,
  isUploading: false,
  method: "POST",
  progress: 0,
  removeAfterUpload: false,
  uploader: { },
  url: "undefinedapi/UploadFiles",
  withCredentials: false
}

onProgressItem [object Object] 1
"onProgressItem"
{
  [functions]: ,
  $$hashKey: "object:105",
  __proto__: { },
  _file: { },
  _input: null,
  _xhr: { },
  alias: "file",
  disableMultipart: false,
  file: { },
  formData: [ ],
  headers: { },
  index: 1,
  isCancel: false,
  isError: false,
  isReady: true,
  isSuccess: false,
  isUploaded: false,
  isUploading: true,
  method: "POST",
  progress: 1,
  removeAfterUpload: false,
  uploader: { },
  url: "undefinedapi/UploadFiles",
  withCredentials: false
}
1

onProgressAll 1
onProgressItem [object Object] 100
"onProgressItem"
{
  [functions]: ,
  $$hashKey: "object:105",
  __proto__: { },
  _file: { },
  _input: null,
  _xhr: { },
  alias: "file",
  disableMultipart: false,
  file: { },
  formData: [ ],
  headers: { },
  index: 1,
  isCancel: false,
  isError: false,
  isReady: true,
  isSuccess: false,
  isUploaded: false,
  isUploading: true,
  method: "POST",
  progress: 100,
  removeAfterUpload: false,
  uploader: { },
  url: "undefinedapi/UploadFiles",
  withCredentials: false
}
100

onProgressAll 100
onCompleteItem [object Object] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 
Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>IIS 8.5 Detailed Error - 404.0 - Not Found</title> 
<style type="text/css"> 
<!-- 
body{margin:0;font-size:.7em;font-family:Verdana,Arial,Helvetica,sans-
serif;} 
code{margin:0;color:#006600;font-size:1.1em;font-weight:bold;} 
.config_source code{font-size:.8em;color:#000000;} 
pre{margin:0;font-size:1.4em;word-wrap:break-word;} 
ul,ol{margin:10px 0 10px 5px;} 
ul.first,ol.first{margin-top:5px;} 
fieldset{padding:0 15px 10px 15px;word-break:break-all;} 
.summary-container fieldset{padding-bottom:5px;margin-top:4px;} 
legend.no-expand-all{padding:2px 15px 4px 10px;margin:0 0 0 -12px;} 
legend{color:#333333;;margin:4px 0 8px -12px;_margin-top:0px; 
font-weight:bold;font-size:1em;} 
a:link,a:visited{color:#007EFF;font-weight:bold;} 
a:hover{text-decoration:none;} 
h1{font-size:2.4em;margin:0;color:#FFF;} 
h2{font-s
"onCompleteItem"
{
  [functions]: ,
  $$hashKey: "object:105",
  __proto__: { },
  _file: { },
  _input: null,
  _xhr: { },
  alias: "file",
  disableMultipart: false,
  file: { },
  formData: [ ],
  headers: { },
  index: null,
  isCancel: false,
  isError: true,
  isReady: false,
  isSuccess: false,
  isUploaded: true,
  isUploading: false,
  method: "POST",
  progress: 0,
  removeAfterUpload: false,
  uploader: { },
  url: "undefinedapi/UploadFiles",
  withCredentials: false
}
"<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>IIS 8.5 Detailed Error - 404.0 - Not Found</title> 
<style type="text/css"> 
<!-- 
body{margin:0;font-size:.7em;font-family:Verdana,Arial,Helvetica,sans-
serif;} 
code{margin:0;color:#006600;font-size:1.1em;font-weight:bold;} 
.config_source code{font-size:.8em;color:#000000;} 
pre{margin:0;font-size:1.4em;word-wrap:break-word;} 
ul,ol{margin:10px 0 10px 5px;} 
ul.first,ol.first{margin-top:5px;} 
fieldset{padding:0 15px 10px 15px;word-break:break-all;} 
.summary-container fieldset{padding-bottom:5px;margin-top:4px;} 
legend.no-expand-all{padding:2px 15px 4px 10px;margin:0 0 0 -12px;} 
legend{color:#333333;;margin:4px 0 8px -12px;_margin-top:0px; 
font-weight:bold;font-size:1em;} 
a:link,a:visited{color:#007EFF;font-weight:bold;} 
a:hover{text-decoration:none;} 
h1{font-size:2.4em;margin:0;color:#FFF;} 
h2{font-size:1.7em;margin:0;color:#CC000"
404
{
  [functions]: ,
  __proto__: { },
  cache-control: "private",
  content-length: "4935",
  content-type: "text/html; charset=utf-8",
  date: "Mon, 11 Dec 2017 18:34:14 GMT",
  persistent-auth: "true",
  server: "Microsoft-IIS/8.5",
  x-powered-by: "ASP.NET"
}

onCompleteAll

Я действительно ищу кого-то, кто добился успеха с этой библиотекой в ​​IE. Я также разместил вопрос на сайте GIT и буду рад обновить этот вопрос, если кто-то там может помочь мне решить проблему.


person Funn_Bobby    schedule 11.12.2017    source источник
comment
Покажи свой код пожалуйста   -  person Selaka Nanayakkara    schedule 11.12.2017


Ответы (1)


Хорошо, оказывается, что проблема не имеет ничего общего с библиотекой Angular-File-Upload, на самом деле это то, как разные браузеры получают URL-адрес хоста, который я использую для вызова контроллера.

Код JavaScript Angular-File-Upload, определяющий загрузчик файлов, выглядит так...

var singleUploader = this.singleUploader = new FileUploader({
        url: baseURI + "api/UploadFiles",
        service: this.service,
        formValues: this.FormValues,            
    });

как видите, вы можете передать несколько свойств из вашего контроллера в объект FileUploader, который будет использоваться. Свойство, которое сбивало меня с толку, было «url».

у меня хром и фаерфокс

document.baseURI;

вернет "http://hostname:port/nameofsite/", однако в IE это не работает, поэтому я проходил в «неопределенном», что, очевидно, не сработает.

Я изменил свой код следующим образом...

var baseURI = document.baseURI;
    if (baseURI == undefined) {
        baseURI = window.location.protocol + "//" + window.location.hostname 
+ (window.location.port ? ':' + window.location.port : '') + "/MySiteName/";

    };

    var singleUploader = this.singleUploader = new FileUploader({
        url: baseURI + "api/UploadFiles",
        service: this.service,
        formValues: this.FormValues,

    });

Теперь все устраивает и работает!!

person Funn_Bobby    schedule 11.12.2017