java - 基于 React 的应用程序与 Spring Boot 捆绑在一起作为 WAR 部署在 websphere 中
问题描述
我正在尝试以 Spring Boot 作为后端开发基于反应的前端应用程序。我正在尝试创建一个前端和后端在 WAR 中耦合在一起的 WAR。然后我正在尝试将其部署到 websphere。创建 WAR 并将其部署到 websphere 服务器后,当我尝试访问该页面时,它无法访问 css 页面并给出 404 not found 错误。react 项目只是一个使用“create-react-app”命令创建的骨架项目。它还没有任何有意义的代码。我正在提供 pom 文件供您参考。请帮助我,如果需要,我将提供任何其他代码。
<properties>
<java.version>1.8</java.version>
<frontend-maven-plugin.version>1.6</frontend-maven-plugin.version>
<node.version>v12.13.0</node.version>
<npm.version>6.12.0</npm.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
<exclusions>
<exclusion>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
</exclusion>
<exclusion>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-logging</artifactId>
</exclusion>
</exclusions>
</dependency>
<!-- <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId>
<scope>runtime</scope> <optional>true</optional> </dependency> <dependency>
<groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-tomcat</artifactId>
<scope>provided</scope> </dependency> -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<scope>provided</scope>
</dependency>
</dependencies>
<!-- <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build> -->
<build>
<plugins>
<plugin>
<artifactId>maven-resources-plugin</artifactId>
<executions>
<execution>
<id>copy-resources</id>
<phase>process-classes</phase>
<goals>
<goal>copy-resources</goal>
</goals>
<configuration>
<outputDirectory>${basedir}/target/classes/resources</outputDirectory>
<resources>
<resource>
<directory>${basedir}/src/main/webapp/XXX/build</directory>
</resource>
</resources>
</configuration>
</execution>
</executions>
</plugin>
<plugin>
<groupId>com.github.eirslett</groupId>
<artifactId>frontend-maven-plugin</artifactId>
<version>${frontend-maven-plugin.version}</version>
<configuration>
<workingDirectory>src/main/webapp/XXX</workingDirectory>
</configuration>
<executions>
<execution>
<id>Install node and npm locally to the project</id>
<goals>
<goal>install-node-and-npm</goal>
</goals>
<!-- optional: default phase is "generate-resources" -->
<phase>generate-resources</phase>
<configuration>
<nodeVersion>${node.version}</nodeVersion>
<npmVersion>${npm.version}</npmVersion>
</configuration>
</execution>
<execution>
<id>npm install</id>
<goals>
<goal>npm</goal>
</goals>
<phase>generate-resources</phase>
</execution>
<execution>
<id>Build frontend</id>
<goals>
<goal>npm</goal>
</goals>
<configuration>
<arguments>run build</arguments>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
</build>
React package.json:
{
"name": "next-gen-ui",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.11.0",
"react-dom": "^16.11.0",
"react-scripts": "1.1.5"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
我收到以下错误:
加载资源失败:服务器响应状态为 404 (Not Found) main.c17080f1.css:1
解决方案
如果您的 WAR 的上下文根不是 /,您将需要配置您的 React 应用程序构建器以将该上下文根包含在它引用的所有资源的 url 中。本文将引导您设置 React 使用的基本 URL。
推荐阅读
- php - 在 PSR-7 响应中解析巨大的 XML
- python - 如何在计时器中获取返回值
- c++ - 跟踪向量中的智能指针
- node.js - Node.js v12 更改了控制台输出
- node.js - 如何从邮递员发送多部分/表单数据
- r - 如何过滤R中的列表
- git - 即使我使用新提交删除了这些文件,也无法使用列入黑名单的模式推送到分支
- web-scraping - Scrapy:满足条件时如何抓取start_urls中的下一个url
- css - 在 created: 中,我的方法不能完美运行
- python - How to convert POST request to GET request in flask?