Я пишу программу, которая использует весеннюю загрузку (с maven) и базу данных PostgreSQL в бэкэнде, и реагирует js во внешнем интерфейсе.
Изначально у меня был тестовый файл. js, представляющий одну веб-страницу, которая создала запрос на выборку для связи с внутренним контроллером, который, в свою очередь, обновил базу данных. Это сработало, поэтому я хотел сделать еще один шаг, используя реактив-маршрутизатор, чтобы связать более одной страницы во внешнем интерфейсе. Однако, когда я попытался внедрить реактивный маршрутизатор, он вызвал мои первоначальные запросы на получение 404 (Не найдено).
Вот пример одного из запросов на выборку в моем новом тесте. js файл.
const line = {
name: this.state.name,
id: this.state.id
};
const fetchOptions = {
method: 'POST',
headers: {
'Accept' : 'application/json',
'Content-Type' : 'application/json',
'Access-Control-Allow-Origin' : '*'
},
body : JSON.stringify(line)
};
let url = "/create";
console.log("creating");
fetch(url, fetchOptions)
.then(response => response.json())
.then(message => {
this.setState({message: message.text})
})
.catch((error) => {
console.log("error: ", error.message);
})
Это мой основной код. js, который реализует реагирующий маршрутизатор:
import React, { Component } from "react";
import {
Route,
NavLink,
Switch,
HashRouter
} from "react-router-dom";
import Home from "./Home";
import Test from "./Test";
class Main extends Component {
render() {
return (
<HashRouter>
<div>
<h1>Simple SPA</h1>
<ul className="header">
<li><NavLink to="/">Home</NavLink></li>
<li><NavLink to="/Test">Test</NavLink></li>
</ul>
<Switch className="content">
<Route exact path="/" component={Home}/>
<Route path="/Test" component={Test}/>
</Switch>
</div>
</HashRouter>
);
}
}
export default Main;
В заключение рассмотрим, как контроллер получает запрос:
@PostMapping("/create")
@ResponseBody
public ResponseTransfer createTransfer(@RequestBody String student) {
// Code to update database
...
return new ResponseTransfer(student);
}
Повторюсь: основная идея c заключается в том, что есть Домашняя страница и Тестовая страница, связанные через реакции-маршрутизатор. Тестовая страница имеет текстовое поле и кнопку, которая позволяет пользователю «создать» запись в базе данных. Проблема заключается в том, что когда пользователь нажимает «создать», в файле «Test. js» делается запрос на выборку «/ create». Однако он не достигает @PostMapping ("/ create") в бэкэнд-контроллере, а просто получает 404 (не найдено). Любая помощь будет оценена. Спасибо!