source

스프링 부팅과 함께 React App을 사용할 때 React-Router 문제 발생

ittop 2023. 4. 2. 11:55
반응형

스프링 부팅과 함께 React App을 사용할 때 React-Router 문제 발생

현재 Spring Boot에서 React 앱을 서비스해야 합니다.루트 URL에 대해 동작하고 있습니다.localhost:8080/단, 스프링컨트롤러가 인식하는 서브루트는 없습니다.

리액트 라우팅과 스프링 요구 매핑을 매핑할 수 있는 모든 루트에서 하드 코딩 없이 정렬하는 방법을 알 수 없습니다.index.html- 그 후 일부 루트에 가변 서브패킷이 있습니다.


여기 제 것이 있습니다.HomeController에 도움이 되는index.html

@Controller
public class HomeController {

    @RequestMapping(value = "/")
    public String index() {
        return "index.html";
    }
}

리액트 앱의 라우팅 렌더입니다.

const Root = ({ store }) => (
  <Provider store={store}>
    <Router history={browserHistory}>
      <Route path="/" component={App}>
        <IndexRedirect to="users"/>
        <Route path="/org" component={OrgSearch}>
          {<Route path="/org/:orgId" component={Org}/>}
        </Route>
        <Route path="/users" component={UserSearch}>
          {<Route path="/users/:userId" component={User} />}
        </Route>
      </Route>
    </Router>
  </Provider>
)

아무쪼록 잘 부탁드립니다!


편집: 와일드카드 기능을 추가하려고 했는데 이상한 동작이 나타납니다.다음 코드가 갱신되었습니다.HomeController.

@Controller
public class HomeController {

    @RequestMapping(value = {"/", "/users/**", "/org/**"})
    public String index() {
        return "index.html";
    }
}

접속할 수 있다/그리고./users하지만 아니다/users/또는/users/2545.

후자에 접속하려고 하면 다음과 같은 오류가 발생합니다.

2017-04-14 09:21:59.896 ERROR 58840 --- [nio-8080-exec-3] o.a.c.c.C.[.[.[/].[dispatcherServlet]    : Servlet.service() for servlet [dispatcherServlet] in context with path [] threw exception [Circular view path [index.html]: would dispatch back to the current handler URL [/users/index.html] again. Check your ViewResolver setup! (Hint: This may be the result of an unspecified view, due to default view name generation.)] with root cause

javax.servlet.ServletException: Circular view path [index.html]: would dispatch back to the current handler URL [/users/index.html] again. Check your ViewResolver setup! (Hint: This may be the result of an unspecified view, due to default view name generation.)
    at org.springframework.web.servlet.view.InternalResourceView.prepareForRendering(InternalResourceView.java:205) ~[spring-webmvc-4.3.7.RELEASE.jar:4.3.7.RELEASE]
    at org.springframework.web.servlet.view.InternalResourceView.renderMergedOutputModel(InternalResourceView.java:145) ~[spring-webmvc-4.3.7.RELEASE.jar:4.3.7.RELEASE]
    at org.springframework.web.servlet.view.AbstractView.render(AbstractView.java:303) ~[spring-webmvc-4.3.7.RELEASE.jar:4.3.7.RELEASE]
    at org.springframework.web.servlet.DispatcherServlet.render(DispatcherServlet.java:1282) ~[spring-webmvc-4.3.7.RELEASE.jar:4.3.7.RELEASE]
    at org.springframework.web.servlet.DispatcherServlet.processDispatchResult(DispatcherServlet.java:1037) ~[spring-webmvc-4.3.7.RELEASE.jar:4.3.7.RELEASE]
    at org.springframework.web.servlet.DispatcherServlet.doDispatch(DispatcherServlet.java:980) ~[spring-webmvc-4.3.7.RELEASE.jar:4.3.7.RELEASE]

저는 이 링크에서 답을 시도해 봤어요.나는 컨트롤러가 없었다.

기본적으로는 addViewController를 정의하는 것입니다.

@Configuration
public class WebConfiguration implements WebMvcConfigurer {

  @Override
  public void addViewControllers(ViewControllerRegistry registry) {
      registry.addViewController("/{spring:\\w+}")
            .setViewName("forward:/");
      registry.addViewController("/**/{spring:\\w+}")
            .setViewName("forward:/");
      registry.addViewController("/{spring:\\w+}/**{spring:?!(\\.js|\\.css)$}")
            .setViewName("forward:/");
  }
}

저도 같은 문제가 있었습니다.이 맵핑은 저에게 효과가 있었습니다.

@RequestMapping(value = {"/","/users/{id}"})

저도 같은 문제가 있어서 '**'가 붙은 URL을 다음과 같은 주석이 달린 다른 방법으로 분리하여 해결했습니다.

@Controller
public class HomeController {

    @RequestMapping(value = {"/"})
    public String index() {
        return "index.html";
    }

    @RequestMapping(value = {"/users/{**}"})
    public String users() {
        return "/";
    }

    @RequestMapping(value = {"/org/{**}"})
    public String org() {
        return "/";
    }
}

언급URL : https://stackoverflow.com/questions/43413331/react-router-issues-when-serving-react-app-with-spring-boot

반응형