如何使用Vert.x 2.x啓用CORS

Question

我正在嘗試使用Angularjs 1.4.5進行跨域請求。 但無法取得成功。我已配置$ httpprovider

.config(['$httpProvider', function($httpProvider) { 
     $httpProvider.defaults.useXDomain = true; 
     delete $httpProvider.defaults.headers.common['X-Requested-With']; 
     $httpProvider.defaults.headers.common['Accept']= "application/json, text/plain, */*"; 
     $httpProvider.defaults.headers.put["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8"; 
     $httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8"; 
     $httpProvider.interceptors.push('authenticationFailedInterceptor'); 
    }]) 

但仍然不會成功。如何使用Vert.x 2.x http服務器啓用CORS支持。

Vert.x 3.x支持CORS，但現在我無法升級Vert.x.

Answer 1

完整的示例，使CORS：

我們需要創建兩個途徑匹配。

有助於啓用cors和其他處理請求。

以下是啓用cors。它接受所有請求並添加所有需要的頭部以啓用Cors。之後，我們需要將請求交給實際的路由匹配器來處理請求。我們通過secureRoutes這個名字。

RouteMatcher routeMatcher = new RouteMatcher(); 
     routeMatcher.options(".*",new Handler<HttpServerRequest>() { 
      @Override 
      public void handle(final HttpServerRequest request) { 
       request.response().putHeader("Access-Control-Allow-Origin", "*"); 
       request.response().putHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE"); 
       request.response().putHeader("Access-Control-Allow-Headers", "accept, authorization, content-type, email"); 
       request.response().end(); 
      } 
     }) 
     .all(".*",new Handler<HttpServerRequest>() { 
      @Override 
      public void handle(final HttpServerRequest request) { 
       request.response().putHeader("Access-Control-Allow-Origin", "*"); 
       secureRoutes.getRouteMatcher().handle(request); 
      } 
     }); 

另一條路線匹配：

public class SecureRoutes { 
private static final RouteMatcher routeMatcher = new RouteMatcher(); 
@Inject 
protected Container container; 
@Inject 
private SigninController signinController; 
@Inject 
private SignupController signupController; 
@Inject 
private OauthController oauthController; 
@Inject 
ClientNetworkSignalController clientNetworkSignalController; 

public void initRoutes() { 
    // APP routes. they use User token for authentication 


    routeMatcher.get("/", new Handler<HttpServerRequest>() { 
     @Override 
     public void handle(final HttpServerRequest request) { 
      request.response().putHeader("Cache-Control", 
        "public, max-age=86400"); 
      request.response().sendFile("web/public/index.html"); 
     } 
    }); 


    routeMatcher.post("/signin", signinController.signin()); 
    routeMatcher.post("/signup", signupController.signup()); 
    routeMatcher.post("/oauth2/token", oauthController.token()); 
    routeMatcher.post("/oauth2/invalidate_token", oauthController.invalidateToken()); 

} 

public RouteMatcher getRouteMatcher() { 
    return routeMatcher; 
} 

}

現在終於添加requestHandler到服務器：

server.requestHandler(routeMatcher).listen(port, 
       host, new Handler<AsyncResult<HttpServer>>() { 
        public void handle(AsyncResult<HttpServer> asyncResult) { 
         if (asyncResult.succeeded()) { 
          logger.info(s + ": Started on " + host + ":" 
            + port); 
         } else { 
          logger.info(s + ": Unable to start server.\n " 
            + asyncResult.cause()); 
         } 
        } 
       }); 

你可能有一個問題，什麼是使用HTTP選項類型請求處理器。答案是非常有趣的。 Javascript是一種安全的語言，不允許跨源Http請求。所以，爲了允許交叉源請求javascript爲每個http請求請求發送一個選項類型請求並檢查天氣CORS是否被支持。在這樣的Javascript命中服務器兩次檢查cors是否支持和一個來捕捉數據。

Answer 2

你有沒有在你的回覆中嘗試過類似的東西？

vertx.createHttpServer() 
    .requestHandler(function (req) { 
    req.response() 
     .putHeader("content-type", "text/plain") 
     .putHeader("Access-Control-Allow-Origin", "*") 
     .putHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS"); 
     .putHeader("Access-Control-Allow-Headers", "Content-Type, Authorization"); 
     .end("Hello from Vert.x!"); 
}).listen(8080); 

當然，你必須修改它以滿足你的需求...但是變化必須在服務器中完成，至少需要這三個頭文件。