Axios no funciona con Safari (macOS) ni con todos los navegadores de iOS y Mozilla. Funciona en Brave y Chrome.
Pantalla de la consola de errores
Vi este error en la consola de Safari; en Chrome no hay este error
mi método
async postRequest() {
try {
const res = await axios.post(baseURL, {
name: this.formdata.name,
vd:this.formdata.vd,
tp:this.formdata.tp,
email:this.formdata.email,
tel:this.formdata.tel,
});
this.formdata = [...this.formdata, res.data];
} catch (e) {
console.error(e);
}
},
ese código tampoco funciona en iOS y Safari
postRequest() {
axios({
method: 'post',
url: 'https://domain.ru:3000/',
data: {
name: this.formdata.name,
vd:this.formdata.vd,
tp:this.formdata.tp,
email:this.formdata.email,
tel:this.formdata.tel,
},
headers: {
"Content-type": "application/json; charset=UTF-8"
}
})
.then(function(response) {
console.log('¡Funcionó en Safari y Chrome!');
console.log(response.data);
})
.catch(function(error) {
console.log(error);
});
},
No funciona en Safari y iOS, pero funciona en Brave y Chrome
davy.ai
Pantalla de la Consola de Errores
Antecedentes
El usuario es un experto en TI especializado en iOS, vue.js, post, axios y Safari. Intentaba enviar una solicitud POST utilizando axios, pero encontró errores en Safari. El mismo código se ejecutó sin errores en Brave y Chrome.
El Problema
El código del usuario fue diseñado para enviar una solicitud POST utilizando axios, pero no funcionaba en Safari ni en iOS. Intentaron dos implementaciones diferentes de la misma funcionalidad, pero ambas fallaron.
El Código
La primera implementación utilizó una sintaxis async/await con un bloque try/catch. Capturó la respuesta de una solicitud POST de axios y actualizó la variable
this.formdata.La segunda implementación utilizó una sintaxis tradicional basada en Promesas con un bloque
.theny.catch. Hizo lo mismo que la primera implementación.La Solución
Dado que el problema solo ocurrió en Safari y iOS, es posible que esté relacionado con CORS (Compartir Recursos de Orígenes Cruzados). El usuario debe investigar si la API a la que intenta enviar la solicitud tiene CORS habilitado.
Además, también pueden intentar establecer la bandera
withCredentialsentrueal realizar la solicitud. Esto permitirá enviar las cookies con la solicitud.Otra solución sería utilizar una biblioteca de polyfill como Axios Adapter o Safari Fetch Polyfill para garantizar la compatibilidad con Safari y iOS.
Por último, el usuario también podría intentar usar la API nativa
fetchen lugar de axios para ver si eso resuelve el problema.