文件輸入和飛鏢

我試着飛鏢，但我無法弄清楚，如何發送圖像從用戶到服務器。我有我的輸入標籤，我可以在DART代碼中找到它，但我似乎無法從中讀取它。我試着像：文件輸入和飛鏢

InputElement ie = document.query('#myinputelement'); 

ie.on.change.add((event){<br/> 
    InputElement iee = document.query('#myinputelement');<br/> 
    FileList mfl = iee.files;<br/> 
    File myFile = mlf.item(0);<br/> 

    FileReader fr = new FileReader(); 
    fr.readAsBinaryString(myFile); 

    String result = fr.result; //this is always empty 
});

與包含HTML：

<input type="file" id="myinputelement">

我真的希望你不能幫我而言，我有點卡住。我可能會錯過如何爲文件讀取器執行onload，或者我可能會完全錯誤。

來源

2012-02-09 user1199863

是否經由'文件裝載Chrome中的網頁：//'協議？如果是這樣，您可能需要啓用一些標誌http://stackoverflow.com/a/7691772/180740 - 或者上傳文件來通過HTTP訪問它們。 – 2012-02-09 16:25:11

FileReader API是異步的，因此您需要使用事件處理程序。

var input = window.document.querySelector('#upload'); 
Element log = query("#log"); 

input.addEventListener("change", (e) { 
    FileList files = input.files; 
    Expect.isTrue(files.length > 0); 
    File file = files.item(0); 

    FileReader reader = new FileReader(); 
    reader.onLoad = (fileEvent) { 
    print("file read"); 
    log.innerHTML = "file content is ${reader.result}"; 
    }; 
    reader.onerror = (evt) => print("error ${reader.error.code}"); 
    reader.readAsText(file); 
});

還需要通過與標誌啓動它--allow-文件訪問從檔案

來源

2012-02-09 16:50:33

我想只使用dart：html atm（你不能同時使用：/）。在使用dart：html時，你無法將處理程序添加到文件讀取器。希望你不能幫助：p – user1199863 2012-02-09 19:03:49

添加使用這兩個庫的例子 – 2012-02-09 19:46:49

哇，謝謝你這麼多人。真的很感激它！ – user1199863 2012-02-09 22:01:58

這不是允許從你的瀏覽器，它可以在Chrome中實現文件上傳必要（更多）使用dart：dom FileReader而不是dart：html中的一個。

FileReader fr = new FileReader(); 
fr.on.load.add((fe) => doSomethingToString(fe.target.result)); 
fr.readAsBinaryString(myFile);

來源

2012-05-21 14:17:15 Miel

這是如何讀取使用dart:html文件：如果添加一個事件監聽器文件讀取器，這樣

您的代碼應該工作。

document.querySelector('#myinputelement`).onChange.listen((changeEvent) { 
    List fileInput = document.querySelector('#myinputelement').files; 

    if (fileInput.length > 1) { 
     // More than one file got selected somehow, could be a browser bug. 
     // Unless the "multiple" attribute is set on the input element, of course 
    } 
    else if (fileInput.isEmpty) { 
     // This could happen if the browser allows emptying an upload field 
    } 

    FileReader reader = new FileReader(); 
    reader.onLoad.listen((fileEvent) { 
      String fileContent = reader.result; 
      // Code doing stuff with fileContent goes here! 
    }); 

    reader.onError.listen((itWentWrongEvent) { 
      // Handle the error 
    }); 

    reader.readAsText(fileInput[0]); 
});

來源

2016-09-14 22:19:57

我嘗試

void fileSelected(Event event) async { 
    final files = (event.target as FileUploadInputElement).files; 
    if (files.isNotEmpty) { 
     final reader = new FileReader(); 

     // ignore: unawaited_futures 
     reader.onError.first.then((evt) => print('error ${reader.error.code}')); 
     final resultReceived = reader.onLoad.first; 
     reader.readAsArrayBuffer(files.first); 

     await resultReceived; 
     imageReference.fileSelected(reader.result as List<int>); 
    } 
    }

來源

2018-03-01 19:36:39

文件輸入和飛鏢

回答

相關問題