programing

대응 + 스프링 부트 배포

linuxpc 2023. 8. 29. 20:11
반응형

대응 + 스프링 부트 배포

스프링 부트로 react nodejs 애플리케이션을 배포하는 데 문제가 있습니다.스프링 애플리케이션은 기본 HTML/JS와 잘 작동하고 개발 모드에서 리액트 앱을 정상적으로 실행하고 있지만, 리액트와 스프링을 제대로 번들링하는 것에 있어서는 누락된 것 같습니다.

현재 간단한 HTML 및 Javascript Ajax 호출(반응 없음)로 스프링 부트 애플리케이션을 실행/배포할 수 있습니다.이것은 내 AWS ec2에서 문제없이 실행됩니다.

또한 노드 JS "npm start"를 통해 개발 모드에서 반응 응용 프로그램을 실행하고 로컬 스프링 부트 응용 프로그램을 가리킬 수 있습니다.(추가했습니다."proxy": "http://localhost:8080"로.manifest.json저는 제 반응 애플리케이션을 전쟁에 끼워넣고 나머지 스프링 애플리케이션을 작동시키는 다음 단계에서 어려움을 겪고 있습니다.저는 응답 hello-world 페이지를 불러오지도 못합니다. 휴식을 취할 수도 없습니다.

나는 달리기를 해봤어요.npm run build그런 다음 생성된 모든 파일을 복사합니다./build내 봄 프로젝트의 디렉토리./src/main/resources구체적으로 복사했습니다.

react-app/build/static/* -> spring-app/src/main/resources/static/.

react-app/build/* -> spring-app/src/main/resources/.

전쟁을 건설한 후에 (mvn install) 그리고 전쟁을 로컬로 실행하면 페이지를 지정하지 않고 서버를 로드하려고 하면 404개의 오류가 발생합니다.index.html을 지정하면 정적 디렉터리에 JS 및 CSS 파일을 로드하지 못한다는 오류가 발생합니다.전쟁을 ec2에 배포하고 페이지를 로드하려고 할 때도 같은 문제가 발생합니다.

누락된 구성 단계가 더 있습니까?개발 모드 밖에서 나머지 API를 사용하려면 기본 URL 구성이 필요하다는 것을 알고 있지만, 휴식 호출 없이 페이지를 로드할 수도 없습니다.저는 index.html을 다음과 같은 다양한 위치로 이동하려고 했습니다./resources/static그리고./resources/public어떤 도움이라도 주시면 감사하겠습니다.

Spring의 이 튜토리얼을 살펴보십시오. 매우 유용한 "프론트 엔드 메이븐 플러그인"이 있습니다.나는 전쟁을 버리고 단지 당신의 봄 부트 앱을 병으로 만든 다음, 당신의 js 파일을 src/main/js에, 당신의 index.html을 /src/main/resources/static에 배치할 것입니다.

이 튜토리얼은 다음 사이트에서 사용할 수 있습니다.

https://spring.io/guides/tutorials/react-and-spring-data-rest/

코드는 다음과 같습니다.

https://github.com/spring-guides/tut-react-and-spring-data-rest/tree/master/basic

튜토리얼에 사용된 것과 유사한 webpack.config.js 구성을 사용하면 메이븐 프런트 엔드 플러그인을 사용하여 빌드하면 "그냥 작동"됩니다.

다른 사람들이 제안한 것처럼 프런트엔드와 백엔드 코드를 분리하는 것이 좋습니다(다른 저장소에 보관).

프런트 엔드 메이븐-플러그인과 메이븐-앤트런-플러그인을 사용하여 운영 목적으로 동일한 접근 방식을 사용했습니다.

프론트엔드 메이븐 플러그인을 사용하여 React 번들을 생성했습니다(npm install그리고 보다npm run build) 및 maven-antrun-run-filen을 클릭하여 아티팩트를 스프링 부트의 공용 폴더에 복사합니다.

훌륭한 샘플 프로젝트 및 튜토리얼은 여기에서 찾을 수 있습니다.

프로젝트의 src 폴더에 webapp/resources 폴더를 만들고 npm 설치 및 실행 빌드에서 생성된 빌드 폴더 내용을 복사하는 것과 같은 문제도 있었습니다.이것으로 문제가 해결되었습니다.

내 프로젝트에서 나는 src/main/app 폴더에 UI 파일을 가지고 있었고, 그 위에 빌드 명령을 설치하고 실행했습니다.그런 다음 빌드 폴더 내용을 src/main/webapp/webapp/webswebs https://github.com/Aditya260194/spring-boot-react-app 로 복사했습니다.

아래는 빌드와 전쟁을 위한 저의 폼 파트입니다.

        <plugin>
                <groupId>org.codehaus.mojo</groupId>
                <artifactId>exec-maven-plugin</artifactId>
                <executions>
                    <execution>
                        <id>npm install</id>
                        <phase>generate-sources</phase>
                        <goals>
                            <goal>exec</goal>
                        </goals>
                        <configuration>
                            <workingDirectory>${uiResourcesDir}</workingDirectory>
                            <executable>npm.cmd</executable>
                            <arguments>
                                <argument>install</argument>
                            </arguments>
                        </configuration>
                    </execution>
                    <execution>
                        <id>npm run build</id>
                        <phase>generate-sources</phase>
                        <goals>
                            <goal>exec</goal>
                        </goals>
                        <configuration>
                            <workingDirectory>${uiResourcesDir}</workingDirectory>
                            <executable>npm.cmd</executable>
                            <arguments>
                                <argument>run</argument>
                                <argument>build</argument>
                            </arguments>
                        </configuration>
                    </execution>
                </executions>
            </plugin>

언급URL : https://stackoverflow.com/questions/49817462/react-spring-boot-deployment

반응형