3

hola estoy tratando de subir un video a giphy mediante la api pero siempre obtengo estos errores, alguien sabe que significan:

mis_guifos.html:1 Access to fetch at 'http://upload.giphy.com/v1/gifs/?&api_key=x58Cq33OnTiwdQ7gRoG1bsCNVFJdEX1d' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.

mis_guifos.js:245 POST http://upload.giphy.com/v1/gifs/?&api_key=x58Cq33OnTiwdQ7gRoG1bsCNVFJdEX1d net::ERR_FAILED

mis_guifos.js:248 Uncaught (in promise) TypeError: Failed to fetch

Éste es mi código (no sé si la cabecera está bien escrita):

form = new FormData();

form.append('file', recorder.getBlob(), 'myGif.gif');
file = form.get('file');

btn_upload_gif.addEventListener("click", function() {
  var new_header = new Headers();
  var options = {
    method: "POST",
    mode: "cors",
    headers: new_header,
    cache: "default",
    body: file,
    headers: {
      "content-type": "video/ogg"
    }
  }

  async function uploading_gif(url) {
    let gif_file = await fetch(url, options);
    let gif_file_json = await gif_file.json();
    console.log(gif_file_json);
  }

  uploading_gif(`http://upload.giphy.com/v1/gifs/?&api_key=x58Cq33OnTiwdQ7gRoG1bsCNVFJdEX1d`);
});

6
  • 1
    ¿Responde esto a tu pregunta? Falta la cabecera CORS 'Access-Control-Allow-Origin' Commented el 6 may. 2020 a las 18:23
  • No puedes subir algo mediante fetch, fetch es solo para obtener informacion y en algunos casos puede usarse para subir información plana es decir cualquier cosa que no tenga que ver con archivos.
    – Layer
    Commented el 6 may. 2020 a las 18:23
  • Hola si no se usa fetch que se usaría entonces ? Commented el 6 may. 2020 a las 18:26
  • Los metodos normales (un formulario con input tipo file) sin usar ajax, o la otra opcion que es tener el mismo formulario pero usar ajax, ademas tener en cuenta que los archivos solo pueden ser compartidos por medio de POST y no de GET.
    – Layer
    Commented el 6 may. 2020 a las 18:27
  • 1
    @Riven, discrepo con respecto a tu afirmación: No puedes subir algo mediante fetch, fetch es solo para obtener informacion. Eso no es correcto, si que puedes usar la API fetch para hacer todos los tipos de solicitudes HTTP que existen. Yo revisaría el comentario. Saludos. Commented el 7 may. 2020 a las 13:25

1 respuesta 1

0

Trata de cambiar el mode: "cors" por mode: 'no-cors'.

Quedaría como

btn_upload_gif.addEventListener("click", function() {
  var new_header = new Headers();
  var options = {
    method: "POST",
    mode: "no-cors",
    headers: new_header,
    cache: "default",
    body: file,
    headers: {
      "content-type": "video/ogg"
    }
  }

  async function uploading_gif(url) {
    let gif_file = await fetch(url, options);
    let gif_file_json = await gif_file.json();
    console.log(gif_file_json);
  }

  uploading_gif(`http://upload.giphy.com/v1/gifs/?&api_key=x58Cq33OnTiwdQ7gRoG1bsCNVFJdEX1d`);
});

Aunque esto es poco recomendable, y es solo como última opción.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.