为什么不能从UI应用程序读取angularjs网关应用程序？

我正在使用以下链接中的教程学习Spring的可伸缩性功能。具体而言，part 6 of the tutorial使用网关应用来管理对其他服务器上运行的应用的访问。为什么不能从UI应用程序读取angularjs网关应用程序？

我完全按照下面的步骤，但是当我启动所有三个应用程序，然后在我的网络浏览器中输入localhost:8080/ui时，我所得到的就是“问候”一词，没有id或hello world，也没有css。

当我打开开发者工具在Firefox的要求，我看到了CSS和JS资源的GET请求越来越404错误指向的URL像http://localhost:8080/js/hello.js，而不是指向http://localhost:8080/ui/js/hello.js，为the test section of the tutorial建议。 如何更改此选项，以便在浏览器中显示问候语？

这里是我的第一个三部分重建从部分之一ui起点和resource起点，一步一步，跟随教程的步骤六：

创建UI样品起动应用

# mkdir ui 
# chmod -R 777 ui 
# cd ui 
# curl https://start.spring.io/starter.tgz -d style=web -d style=security -d name=ui | tar -xzvf -

的Eclipse>费尔E>导入>现有Maven项目>导航到UI文件夹>完成

在src/main/resources/static创建index.html并添加以下内容：

<!doctype html> 
<html> 
<head> 
<title>Hello AngularJS</title> 
<link href="css/angular-bootstrap.css" rel="stylesheet"> 
<style type="text/css"> 
[ng\:cloak], [ng-cloak], .ng-cloak { 
    display: none !important; 
} 
</style> 
</head> 

<body ng-app="hello"> 
    <div class="container"> 
    <h1>Greeting</h1> 
    <div ng-controller="home" ng-cloak class="ng-cloak"> 
     <p>The ID is {{greeting.id}}</p> 
     <p>The content is {{greeting.content}}</p> 
    </div> 
    </div> 
    <script src="js/angular-bootstrap.js" type="text/javascript"></script> 
    <script src="js/hello.js"></script> 
</body> 
</html>

以下行添加到src/main/resources/application.properties：

security.user.password=some.password 
server.port: 8081 
security.sessions: NEVER // The "security.sessions" setting means that Spring Security will accept cookies as authentication tokens but won’t create them unless they already exist.

添加以下为pom.xml以便使用wro4j下载和集成角度和自举等：

<build> 
    <resources> 
    <resource> 
     <directory>${project.basedir}/src/main/resources</directory> 
    </resource> 
    <resource> 
     <directory>${project.build.directory}/generated-resources</directory> 
    </resource> 
    </resources> 
    <plugins> 
    <plugin> 
     <groupId>org.springframework.boot</groupId> 
     <artifactId>spring-boot-maven-plugin</artifactId> 
    </plugin> 
    <plugin> 
     <artifactId>maven-resources-plugin</artifactId> 
     <executions> 
     <execution> 
      <!-- Serves *only* to filter the wro.xml so it can get an absolute 
      path for the project --> 
      <id>copy-resources</id> 
      <phase>validate</phase> 
      <goals> 
      <goal>copy-resources</goal> 
      </goals> 
      <configuration> 
      <outputDirectory>${basedir}/target/wro</outputDirectory> 
      <resources> 
       <resource> 
       <directory>src/main/wro</directory> 
       <filtering>true</filtering> 
       </resource> 
      </resources> 
      </configuration> 
     </execution> 
     </executions> 
    </plugin> 
    <plugin> 
     <groupId>ro.isdc.wro4j</groupId> 
     <artifactId>wro4j-maven-plugin</artifactId> 
     <version>1.7.6</version> 
     <executions> 
     <execution> 
      <phase>generate-resources</phase> 
      <goals> 
      <goal>run</goal> 
      </goals> 
     </execution> 
     </executions> 
     <configuration> 
     <wroManagerFactory>ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory</wroManagerFactory> 
     <cssDestinationFolder>${project.build.directory}/generated-resources/static/css</cssDestinationFolder> 
     <jsDestinationFolder>${project.build.directory}/generated-resources/static/js</jsDestinationFolder> 
     <wroFile>${project.build.directory}/wro/wro.xml</wroFile> 
     <extraConfigFile>${basedir}/src/main/wro/wro.properties</extraConfigFile> 
     <contextFolder>${basedir}/src/main/wro</contextFolder> 
     </configuration> 
     <dependencies> 
     <dependency> 
      <groupId>org.webjars</groupId> 
      <artifactId>jquery</artifactId> 
      <version>2.1.1</version> 
     </dependency> 
     <dependency> 
      <groupId>org.webjars</groupId> 
      <artifactId>angularjs</artifactId> 
      <version>1.3.8</version> 
     </dependency> 
     <dependency> 
      <groupId>org.webjars</groupId> 
      <artifactId>bootstrap</artifactId> 
      <version>3.2.0</version> 
     </dependency> 
     </dependencies> 
    </plugin> 
    </plugins> 
</build>

的Eclipse>文件>新建>源文件夹>（创建的src/main/WRO）

添加以下src/main/wro/wro.properties（从少编译CSS和缩小JavaScript）：

preProcessors=lessCssImport 
postProcessors=less4j,jsMin

添加以下以src/main/wro/wro.xml（声明了一个单一组角引导与以引用的CSS，JS，和main.less）：

<groups xmlns="http://www.isdc.ro/wro"> 
    <group name="angular-bootstrap"> 
    <css>webjar:bootstrap/3.2.0/less/bootstrap.less</css> 
    <css>file:${project.basedir}/src/main/wro/main.less</css> 
    <js>webjar:jquery/2.1.1/jquery.min.js</js> 
    <js>webjar:angularjs/1.3.8/angular.min.js</js> 
    </group> 
</groups>

创建src/main/wro/main.less和现在就把它留空。 main.less可用于自定义引导程序的默认值。

创建src/main/resources/static/js/hello.js并添加以下内容：

angular.module('hello', []) 
    .controller('home', function($scope, $http) { 
    $http.get('/resource/').success(function(data) { 
    $scope.greeting = data; 
    }) 
});

更改com.example.UiApplication.java到：

import org.springframework.boot.SpringApplication; 
import org.springframework.boot.autoconfigure.SpringBootApplication; 
import org.springframework.session.data.redis.config.annotation.web.http.EnableRedisHttpSession; 

@SpringBootApplication 
@EnableRedisHttpSession 
public class UiApplication { 

    public static void main(String[] args) { 
     SpringApplication.run(UiApplication.class, args); 
    } 

}

//现在添加以下到UI应用程序的pom.xml：

<dependency> 
    <groupId>org.springframework.session</groupId> 
    <artifactId>spring-session</artifactId> 
</dependency> 
<dependency> 
    <groupId>org.springframework.boot</groupId> 
    <artifactId>spring-boot-starter-redis</artifactId> 
</dependency>

创建单独的资源服务器

//导航到工作空间的根

# cd /home/username/someworkspace 
# mkdir resource 
# chmod -R 777 resource 
# cd resource 
# curl https://start.spring.io/starter.tgz -d style=web -d name=resource -d language=java | tar -xzvf -

的Eclipse>导入>现有Maven项目（导航至资源刚刚创建的文件夹）

//添加以下为pom.xml中的resource应用程序：

<dependency> 
     <groupId>org.springframework.session</groupId> 
     <artifactId>spring-session</artifactId> 
    </dependency> 
    <dependency> 
     <groupId>org.springframework.boot</groupId> 
     <artifactId>spring-boot-starter-redis</artifactId> 
    </dependency>

//改变com.example.ResourceApplication.java以下几点：

import java.util.HashMap; 
import java.util.Map; 
import java.util.UUID; 

import org.springframework.boot.SpringApplication; 
import org.springframework.boot.autoconfigure.SpringBootApplication; 
import org.springframework.session.data.redis.config.annotation.web.http.EnableRedisHttpSession; 
import org.springframework.web.bind.annotation.RequestMapping; 
import org.springframework.web.bind.annotation.RestController; 

@SpringBootApplication 
@RestController 
@EnableRedisHttpSession 
public class ResourceApplication { 

    @RequestMapping("/resource") 
    public Map<String,Object> home() { 
    Map<String,Object> model = new HashMap<String,Object>(); 
    model.put("id", UUID.randomUUID().toString()); 
    model.put("content", "Hello World"); 
    return model; 
    } 

    public static void main(String[] args) { 
    SpringApplication.run(ResourceApplication.class, args); 
    } 

}

//添加以下src/main/resources/application.properties：

server.port: 9000 
security.sessions: NEVER

创建网关应用

ñ avigate终端到工作空间的根，则

# cd /home/username/someworkspace 
# mkdir gateway 
# chmod -R 777 gateway 
# cd gateway 
# curl https://cloud-start.spring.io/starter.tgz -d style=web -d style=security -d style=cloud-zuul -d name=gateway -d style=redis | tar -xzvf -

的Eclipse>文件>导入>现有Maven项目>（导航到网关目录）

//更改GatewayApplication.java到：

import org.springframework.boot.SpringApplication; 
import org.springframework.boot.autoconfigure.SpringBootApplication; 
import org.springframework.cloud.netflix.zuul.EnableZuulProxy; 
import org.springframework.session.data.redis.config.annotation.web.http.EnableRedisHttpSession; 

@SpringBootApplication 
@EnableRedisHttpSession 
@EnableZuulProxy 
public class GatewayApplication { 

    public static void main(String[] args) { 
     SpringApplication.run(GatewayApplication.class, args); 
    } 
}

//将src/main/resources/application.properties设置为：

zuul.routes.ui.url: http://localhost:8081 
zuul.routes.resource.url: http://localhost:9000 
security.user.password: password 
security.sessions: ALWAYS

。
启动和测试应用程式：

# cd /home/username/someworkspace/ui 
# mvn spring-boot:run

然后打开第二终端输入

# cd /home/username/someworkspace/resource 
# mvn spring-boot:run

然后打开一个第三端子和类型：

# cd /home/username/someworkspace/gateway 
# mvn spring-boot: run

//测试通过在浏览器中放置localhost：8080/ui来应用

请注意，只有单词“问候”出现在浏览器localhost:8080/ui处，并且没有标识并且没有内容。此外，Firefox的开发人员工具显示像http://localhost:8080/js/hello.js资源404错误，这些错误应改为http://localhost:8080/ui/js/hello.js

然而，当我在浏览器中键入localhost:8081，我得到的CSS风格的“问候语”，其次是“ID为”和“内容是”，但没有来自资源服务器的动态内容。 localhost:8081请求的Firefox开发人员工具为http://localhost:8081/resource/提供了404。

需要注意的是，测试的任何改变上述情况，您只需在相应的控制台输入控制C，然后键入kill $(lsof -t -i:8080)或8081或9000，然后mvn spring-boot:run

那么什么样的变化，以我对代码上面得到的id和问候通过网关加载？

来源

2015-12-12 CodeMed

在您的html页面看起来像一个问题。你应该确保链接是正确的。 Zuul的本质是将网址映射到后端。要使您的示例工作，您必须将角度应用程序中的url更改为/resource/resource或将资源应用程序中的控制器更改为/。还要确保所有应用程序都具有spring-boot-starter-security作为依赖项，以允许共享sec上下文。或者完全禁用安全性来首先调试您的问题。

来源

2015-12-12 06:40:33

上面的代码明确指出了'src = js/...'而不是'src =/js/...'。我是否正确地理解你？ – CodeMed

嗯，是的，但你的文章也像你抄录howto一样。只是想确定。因为当你的html加载正确打开/ ui /并试图加载/ js /它看起来像绝对链接。 –

当我走时，我仔细记录了每一步，然后我在OP中发布了我的实际步骤，以便任何人都可以重现我采取的步骤。根据我在OP中记录的实际步骤，您有具体的建议吗？ – CodeMed

为什么不能从UI应用程序读取angularjs网关应用程序？

回答

相关问题