Grunt問題與代理 - Gruntjs

Question

我一直在努力讓我的代理設置在我的Gruntfile中整天工作。這裏是我的Gruntfile：

var proxySnippet = require('grunt-connect-proxy/lib/utils').proxyRequest; 

module.exports = function(grunt) { 

    require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks); 

    grunt.initConfig({ 
    connect:{ 
     livereload: { 
     options: { 
      middleware: function (connect) { 
      return [proxySnippet]; 
      } 
     } 
     }, 
     options: { 
     port: 9000, 
     base: 'app', 
     keepalive: true, 
     livereload: true 
     }, 
     proxies: [ 
     { 
      context: '/public/api', 
      host: 'localhost', 
      port: 8182, 
      https: false, 
      rewrite: { 
      '^/public/api': '' 
      } 
     } 
     ] 
    } 
    }); 

    grunt.registerTask('server', ['less', 'configureProxies', 'connect', 'connect', 'watch', 'open:dev']); 
}; 

當我跑我的grunt server我只能打到我的代理。如果我嘗試打除代理以外的任何東西，我會得到一個404。什麼給我這個問題？

Answer 1

我使用grunt-connect-proxy設置代理時也遇到了很多麻煩。

在源代碼grunt-contrib-connect的挖掘中，我意識到它使用框架背後的nodeJsConnect。

內部的middleware選項默認爲這樣的功能：

function (connect, options) { 
    var middlewares = []; 
    if (!Array.isArray(options.base)) { 
     options.base = [options.base]; 
    } 
    var directory = options.directory || options.base[options.base.length - 1]; 
    options.base.forEach(function (base) { 
     // Serve static files. 
     middlewares.push(connect.static(base)); 
    }); 
    // Make directory browse-able. 
    middlewares.push(connect.directory(directory)); 
    return middlewares; 
} 

這基本上增加了connect.static和connect.directory中間件傳遞給connect(middlewares)構造一個數組。

知道這一點，我們可以利用proxy-middlewarenodeJs包的這樣的：

connect: { 
    server: { 
     options: { 
      port: 9002, 
      keepalive: true, 
      middleware: function (connect, options) { 
       // Proxy all requests to target the local application. 
       var proxyOptions = require('url').parse('http://localhost:8080/'); 
       proxyOptions.route = '/api'; 
       return [ 
        require('proxy-middleware')(proxyOptions), // Include the proxy first. 
        connect.static(options.base), // Serve static files. 
        connect.directory(options.base) // Make empty directories browse-able. 
       ]; 
      } 
     } 
    } 
} 

基本上我們添加中間件到中間件陣列。 這個新的代理中間件會將任何傳入的請求轉換爲http://localhost:9002/api/到​​