0
246
Views¿Por qué usar la ruta API Next.js con una API externa?
Soy nuevo en Next.js. Quiero saber cuál es el uso del export default function handler porque podemos llamar directamente a la API usando fetch .
En mi código HTML puse debajo del código. Cuando hago clic en el botón Enviar, se llamará a la función submit sendformData() .
<input type="button" value="Submit" onClick={() => this.sendformData()} ></input> sendformData = async () => { const res = await fetch("/api/comments/getTwitFrmUrl?twitUrl=" + this.state.twitUrl, { headers: { "Content-Type": "application/json", }, method: "GET", }); const result = await res.json(); this.setState({ data: result.data }); }; Cuando se llama a la función sendformData , llama a /api/comments/ file y llama a la función.
Aquí está el código del archivo /api/comments/[id].js .
export default async function handler(req, res) { if (req.query.id == 'getTwitFrmUrl') { const resData = await fetch( "https://dev.. .com/api/getTwitFrmUrl?twitId=" + req.query.twitUrl ).then((response) => response.text()).then(result => JSON.parse(result).data); res.status(200).json({ data: resData }); } else if (req.query.id == 'getformdata') { console.log('getformdata api'); res.status(200).json({ user: 'getuserData' }); } } Cuando coloque el siguiente código en sendformData , se recuperará la misma respuesta. Entonces, ¿por qué necesitamos llamar a export default function handler ?
sendformData = async () => { const res = await fetch( "https://dev.. .com/api/getTwitFrmUrl?twitId=" + req.query.twitUrl ).then((response) => response.text()).then(result => JSON.parse(result).data); const result = await res.json(); this.setState({ data: result.data }); };1 answers
Answer question0
Si ya tiene una API existente, no es necesario enviar solicitudes de proxy a esa API a través de una ruta de API. Está completamente bien hacer una llamada directa a la API.
Sin embargo, hay algunos casos de uso para querer hacerlo. De la documentación de rutas API :
- Enmascarar la URL de un servicio externo (por ejemplo
/api/secreten lugar dehttps://company.com/secret-url)- Uso de variables de entorno en el servidor para acceder de forma segura a servicios externos.
Esencialmente, por razones de seguridad, si desea ocultar la URL de la API externa o si desea evitar exponer las variables de entorno necesarias para una solicitud al navegador.
También puede querer solicitudes de proxy a través de rutas API para eludir las restricciones de CORS. Al realizar las solicitudes a la API externa desde el servidor, no se aplicará CORS.