Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

321
Vistas
Enviar archivo de imagen a través del método Fetch

Así que estoy tratando de usar la API MathPix para obtener látex puro de la imagen procesada en mi proyecto Django.

Uso pocos campos <input type="file"> y detectores de eventos en cada uno. Después del evento de change , el archivo se valida (si es un .jpg, .png, etc.). A continuación, uso la función URL.createObjectURL() para crear una URL para el archivo cargado sin guardarlo antes en la base de datos.

 function checkExtension(event) { var input = event.srcElement; var fileName = input.files[0].name; var extension = fileName.substr(fileName.lastIndexOf(".")); var allowedExtensionsRegx = /(\.jpg|\.jpeg|\.png|\.gif)$/i; var file = document.getElementById(event.target.name) if (allowedExtensionsRegx.test(extension) == true) { file.setAttribute("class", "btn-success p-2 rounded") const image = input.files[0]; const image_url = URL.createObjectURL(image) snip_request(image_url) } else { file.setAttribute("class", "btn-danger p-2 rounded") } } function snip_request(image_url){ if(image_url) { const appId = "XXXXXXXXXXXXXXXXX"; const appKey = "YYYYYYYYYYYYYYYY"; var url = "https://api.mathpix.com/v3/latex"; var _data = { "src": image_url, "formats": "text", "data_options": { "include_asciimath": true, "include_latex": true } } var _header = { "content-type": "application/json", "app_id": appId, "app_key": appKey } const response = fetch(url, { method: "POST", body: JSON.stringify(_data), headers: _header }) .then(response => response.json()) .then(json => console.log(json));; } }

Desafortunadamente, al final del día recibo un mensaje de error:

 { "error": "blob:http://localhost:8000/4c523864-93ec-452a-ace1-0156b63e9837: TypeError: Only HTTP(S) protocols are supported", "error_info": { "id": "image_download_error", "message": "TypeError: Only HTTP(S) protocols are supported", "url": "blob:http://localhost:8000/4c523864-93ec-452a-ace1-0156b63e9837" } }

No tengo ni idea de por qué esto no funciona? ¿Es el problema con la "URL temporal" o la forma en que el servidor descarga el archivo? Soy bastante nuevo en Java Script, por lo que agradeceré cualquier consejo.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Su problema no está directamente relacionado con el código javascript. Es que la API de Mathpix no permite cargar imágenes directamente, no quieren que les envíes un enlace a la imagen. blob: las URL son solo URL virtuales en el navegador y, por lo tanto, solo se puede acceder a ellas desde el navegador, no desde los servidores de Mathpix. Por lo tanto, debe cargar su imagen en cualquier lugar (en su servidor, en un depósito de almacenamiento, etc.) y enviar la URL http:// a ese archivo de imagen a la API de Mathpix.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda