0
156
ViewsObtener una respuesta de solicitud incorrecta de una llamada api que se supone que debe devolver un enlace para usar para iframe src
Estoy tratando de hacer un método GET para poder recuperar el enlace que se usará en el atributo src del iframe. Entonces lo que hice fue lo siguiente:
import axios from 'axios'; import { BASE_API_ROOT } from '../../apiConfig'; async function getJobView() { const options = { method: 'GET', headers: { 'content-type': 'application/json' }, url: `${BASE_API_ROOT}/level2` }; return axios(options); } export { getJobView };Así que traté de incrustar el iframe en un modal emergente. Entonces, lo que hice fue importar esa función api y usarla en mi componente como se muestra a continuación:
modalContent = () => { const { classes, history } = this.props; const srcUrl = getJobView().then(res => console.log(res)).catch(err => console.log(err.message)); console.log(srcUrl); const renderGetJobView = () => { return <iframe src={srcUrl} style={{ width: '800px', height: '800px' }}></iframe> } return ( <Paper className={classes.modalPaper}> {renderGetJobView()} </Paper> ); }; En la consola veo esto: 
¿Alguna idea sobre esto?
2 answers
Answer question0
No se encontró el recurso solicitado.
El código de estado 404 significa resource not found . Verifique en el lado del server que está llamando a la URL correcta de la API.
Aquí puede verificar el código de estado de los api_response_codes de la API
0
Preferiría formatear su código de una manera más legible e intentar averiguar dónde se rompe.
axios.js
import axios from 'axios'; import { BASE_API_ROOT } from '../../apiConfig'; const axiosInstance = axios.create({ baseURL: BASE_API_ROOT, headers: { 'content-type': 'application/json' }, }) export const getJobView = async () => { return axiosInstance.get("/level2") }componente.js
const modalContent = () => { const { classes, history } = this.props; const [srcUrl, setSrcUrl] = useState("") useEffect(() => { const getJobViewData = async () => { try { const getJobViewResponse = await getJobView() setSrcUrl(getJobViewResponse.data) } catch (error) { setSrcUrl("") } } getJobViewData() }, []) return ( <Paper className={classes.modalPaper}> {srcUrl !== "" ? <iframe src={srcUrl} style={{ width: '800px', height: '800px' }}></iframe> : null } </Paper> ); };Ahora, es fácil averiguar dónde se rompe el código, ya sea en el punto final de Api o en otro lugar.