java - 为什么 spring boot angularjs gateway 应用程序不能从 ui 应用程序读取?

标签 java angularjs spring spring-mvc spring-boot

我正在使用以下链接中的教程了解 Spring 的可扩展性功能。具体来说,part 6 of the tutorial使用网关应用程序来管理对其他服务器上运行的应用程序的访问。

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

当我在 Firefox 中打开请求的开发人员工具时,我看到对 css 和 js 资源的 GET 请求出现 404 错误,指向像 http://localhost:8080/js/hello.js 这样的 url 而不是 指向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 > 文件 > 导入 > 现有 Maven 项目 > 导航到 ui 文件夹 > 完成

创建 index.htmlsrc/main/resources/static并添加以下内容:
<!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 下载和集成 angular 和 bootstrap 等:
<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 (将从less编译css并缩小javascript):
preProcessors=lessCssImport
postProcessors=less4j,jsMin

将以下内容添加到 src/main/wro/wro.xml (声明一个引用 css、js 和 main.less 的单组 angular-bootstrap):
<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 > Import > Existing Maven Project(导航到刚刚创建的资源文件夹)

//将以下内容添加到 pom.xmlresource应用程序:
    <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

创建网关应用

将终端导航到工作空间的根目录,然后
# 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 > File > Import > Existing Maven Project >(导航到网关目录)

//改变 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 仅显示单词“Greeting”。 ,并且没有 id 也没有内容。此外,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 .

请注意,要测试对上述内容的任何更改,您只需在相应的控制台中键入 control C,然后键入 kill $(lsof -t -i:8080)或 8081 或 9000,然后是 mvn spring-boot:run
那么我对上面的代码进行了哪些更改以获取通过网关加载的 id 和问候语?

最佳答案

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

关于java - 为什么 spring boot angularjs gateway 应用程序不能从 ui 应用程序读取?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34235409/

相关文章:

java - MockBean 未注入(inject) MVC Controller 测试中

angularjs - ngRepeat 中的 $first

java - 解析 LDAP 日期和时间戳时设置的时区与 GMT 不一致

java - "A derived-class constructor cannot catch exceptions thrown by its base-class constructor."但能够捕获它

java - db2 的 ExceptionInInitializerError

angularjs - Q : AngularJS, 如何将图像放入背景 div 中?

php - CodeIgniter 没有收到 POST 数据

java - 针对 HSQLDB 测试 DAO 的 Spring/Hibernate/Junit 示例

ajax - spring 400 错误请求。我该如何修复它,或者至少看看是什么原因造成的?

java - 从抽象类继承注释?