Entonces, estoy haciendo una solicitud de recuperación de reaccionar a express y la URL de API requiere parámetros, pero quiero que la última parte de la URL sea dinámica. ¿Cómo enviaría un parámetro desde reaccionar a la url api en express? Aquí está el código
reaccionar
const [dynamic, setDynamic] = useState("somevalue") useEffect(() => { async function fetchData() { const response = await fetch("/web") const data = await response.json() console.log(data) } fetchData() }, [dynamic])expreso.js
app.get("/web", async (req, res) => { const response = await fetch("https://alexa.com/api?Action=urlInfo&Url=") const data = await response.json() res.json(data) })Básicamente, me gustaría que el valor del estado dinámico se inyecte al final de la URL en express.
Algo como
reaccionar
const [dynamic, setDynamic] = useState("somevalue") async function fetchData() { const response = await fetch("/web" + dynamic) const data = await response.json() console.log(data) }Luego, en Express , cuando se llama a la API, la URL cambia a
const response = await fetch("https://alexa.com/api?Action=urlInfo&Url=somevalue")¿Cómo puedo hacer para lograr esto?
Usted define el parámetro en el lado del controlador de ruta, configurando una ruta que coincida con el patrón deseado. Por ejemplo:
app.get("/foo/bar/:myparam", async (req, res) => { //... here's your handler code }) Coincidirá con /foo/bar/baz y req.params.myparam === "baz" dentro del controlador.
http://expressjs.com/en/guide/routing.html#parámetros-de-ruta
El uso de parámetros de consulta es similar, pero desea verificar los valores del objeto req.query en su lugar , como:
// client side (React code) await fetch("/foo/bar?myparam=baz") ... // In your express handler: req.query.myparam === "baz"Use el valor dinámico en los parámetros de la llamada API.
El código de reacción se vería así:
const [dynamic, setDynamic] = useState("somevalue") useEffect(() => { async function fetchData() { const response = await fetch(`/web/${dynamic}`) const data = await response.json() console.log(data) } fetchData() }, [dynamic])En el código Express.Js, defina el parámetro en el lado del controlador de ruta y utilícelo en la llamada de búsqueda de API
app.get("/web/:value", async (req, res) => { const {value} = req.params; const response = await fetch(`https://alexa.com/api?Action=urlInfo&Url=${value}`) const data = response.json() res.json(data) })