XmlHTTPRequest 在 POST 后未从服务器返回错误状态

Question

我一直在小型微型计算机上编写嵌入式网络服务器。我有很多东西在工作，可以提供网页等。一个页面允许用户上传新的固件文件。 我有这个工作，只是我无法弄清楚如果他们犯了错误（比如尝试上传文件扩展名错误的文件）如何向他们返回有用的错误信息。 网页正确地告诉他们上传失败（“错误”的事件侦听器），但我无法弄清楚如何捕获服务器返回的状态 - 失败时始终为 0（成功时正确为 200），responseText 是空白。

在这种情况下，我发送“HTTP/1.1 400 错误请求：参数无效（文件扩展名无效）”。从服务器。 在 onreadystatechange 中，readyState 确实达到了 4，但 status 始终为 0。

请不要“射击”我，因为我对 Javascript 还很陌生......下面是我的固件上传网页中的代码。 选择要上传的文件后按下按钮时，将调用“uploadFile”函数。

迈克。

<script>
      var downloadTimer;
      var ajax;
      
      function _(el) {
        return document.getElementById(el);
      }
      
      function uploadFile() {
        var file = _("file1").files[0];
        var formdata = new FormData();
        formdata.append("file1", file);
        ajax = new XMLHttpRequest();
        ajax.upload.addEventListener("progress", progressHandler, false);
        ajax.addEventListener("load", completeHandler, false);
        ajax.addEventListener("error", errorHandler, false);
        ajax.addEventListener("abort", abortHandler, false);
    _("progressBar").style.visibility = 'visible';
 
        ajax.onreadystatechange = function() {
          if ((this.readyState === 4) && (this.status > 0)){
            console.log(this.responseText);
          }
        }
        
        ajax.open("POST", "/upload.cgi");
    var timeleft = 90;
    uploadTimer = setInterval(function(){
      if (timeleft <= 0){
        clearInterval(downloadTimer);
        _("progressBar").style.visibility = 'hidden';
        _("loaded_n_total").innerHTML = "";
        _("status").innerHTML = "Firmware Update Complete";
        clearInterval(downloadTimer);
      } else {
        var percent = Math.round((90 - timeleft) * 1.111);
        _("progressBar").value = percent;
            _("status").innerHTML = Math.round(percent) + "% uploaded... please wait";
        timeleft -= 1;
      }
    }, 1000);
        ajax.send(formdata);
      }
      
      function progressHandler(event) {
        _("loaded_n_total").innerHTML = "Uploaded " + event.loaded + " bytes of " + event.total;
      }
      
      function completeHandler(event) {
    _("loaded_n_total").innerHTML = "Applying new Firmware...please wait";
        
      }
      
      function errorHandler(event) {
    clearInterval(uploadTimer);
    _("progressBar").style.visibility = 'hidden';
    _("loaded_n_total").innerHTML = "";
        _("status").innerHTML = "Upload Failed";
      }
      
      function abortHandler(event) {
    clearInterval(uploadTimer);
    _("progressBar").style.visibility = 'hidden';
    _("loaded_n_total").innerHTML = "";
        _("status").innerHTML = "Upload Aborted";
      } 
    
</script>

Answer 1

如果您的网页与微控制器的来源不同，则浏览器可能会由于 CORS 策略而阻止响应。确保您的服务器配置为发送适当的 CORS 标头，例如： ********** 访问控制允许来源： **************