ExpressJS XMLHttpRequest路由錯誤

我遇到了一個問題，我試圖將查詢參數表單中的文件信息傳遞給我設置爲上傳我的AWS文件並返回url的路由。我遇到的問題是，窗體位於使用/create/comment路線訪問的視圖文件中，並且所有路線的前綴爲/app。在我的XMLHttpRequest中，我請求了/app/sign和文件查詢參數，但由於某種原因，它一直在/app/create或/app/create/app/sign之前，這就是我有404錯誤的原因。有沒有一種方法來防止/app/create的預先計劃？ExpressJS XMLHttpRequest路由錯誤

在xhr.send();

function sign_request(file, done) { 
     var xhr = new XMLHttpRequest(); 
     console.log(xhr); 
     console.log(file); 
     xhr.open("GET", "app/sign?file_name=" + file.name + "&file_type=" + file.type); 
     xhr.onreadystatechange = function() { 
      if(xhr.readyState === 4 && xhr.status === 200) { 
       var response = JSON.parse(xhr.responseText); 
       console.log(response); 
       done(response); 
      } 
     }; 
     xhr.send(); 
    };

錯誤消息錯誤功能：

comment:139 GET http://localhost:3000/app/create/app/sign?file_name=File-name.png&file_type=image/png 404 (Not Found)

這裏是我的路線設置：

var express = require('express'); 
    var router = express.Router(); 
    router.use('/app'); 
var config = require(path.resolve(__dirname, '..', '..','./config/config.js')); 
var models = require('../models/db-index'); 
var fs = require('fs'); 
var aws = require('aws-sdk'); 

    /*==== /SIGN ====*/ 

    router.get('/sign', function(req, res){ 
     aws.config.update({accessKeyId: config.awsAccessKeyId, secretAccessKey: config.awsSecretAccessKey}); 

     var s3 = new aws.S3() 
     var options = { 
      Bucket: config.awsBucket, 
      Region: 'us-east-1', 
      Key: req.query.file_name, 
      Expires: 60, 
      ContentType: req.query.file_type, 
      ACL: 'public-read' 
     } 

     s3.getSignedUrl('putObject', options, function(err, data){ 
      if(err) return res.send('Error with S3') 

      res.json({ 
      signed_request: data, 
      url: 'https://s3.amazonaws.com/' + S3_BUCKET + '/' + req.query.file_name 
      }); 
     }); 
    }); 

    router.get('/create/comment',function(req, res){ 
      models.DiscoverySource.findAll({ 
       where: { 
        organizationId: req.user.organizationId 
       }, attributes: ['discoverySourceName'] 
      }).then(function(discoverySource){ 
       res.render('pages/app/comment-create.hbs',{ 
        discoverySource: discoverySource 
       }); 
      }); 

     });

表格（在/應用程序/創建/評論接入）：

<!DOCTYPE html> 
<head> 
    {{> app/app-head}} 
</head> 
<body> 
    {{> app/app-navigation}} 
    <div class="container"> 
     <div class="col-md-12"> 
      <div class="row-form-container"> 
       <label for="report-link">File Attachment:</label> 
        <input type="file" name="fileAttachment" id="image"> 
        <img id="preview"> 
      </div> 
    </div> 
    <script type="text/javascript"> 


     function upload(file, signed_request, url, done) { 
      var xhr = new XMLHttpRequest(); 
      xhr.open("PUT", signed_request); 
      xhr.setRequestHeader('x-amz-acl', 'public-read'); 
      xhr.onload = function() { 
      if (xhr.status === 200) { 
       done(); 
      }; 
     }; 
     xhr.send(file); 
     } 

    function sign_request(file, done) { 
     console.log('work please'); 
     var xhr = new XMLHttpRequest(); 
     console.log(xhr); 
     console.log(file); 
     xhr.open("GET", "app/sign?file_name=" + file.name + "&file_type=" + file.type); 
     xhr.onreadystatechange = function() { 
      if(xhr.readyState === 4 && xhr.status === 200) { 
       var response = JSON.parse(xhr.responseText); 
       console.log(response); 
       done(response); 
      } 
     }; 
     xhr.send(); 
    }; 

    document.getElementById("image").onchange = function() { 
     var file = document.getElementById("image").files[0] 
     if (!file) return 
      sign_request(file, function(response) { 
       upload(file, response.signed_request, response.url, function() { 
        document.getElementById("preview").src = response.url 
       }); 
      }); 
    }; 
    </script> 
</body>

來源

2016-06-14 cphill

添加/以前app/sign當你發送一個請求將阻止當前子路徑的預謀。 Try：

xhr.open("GET", "/app/sign?file_name=" + file.name + "&file_type=" + file.type);

來源

2016-06-14 12:41:56 Zen

ExpressJS XMLHttpRequest路由錯誤

回答

相關問題