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.
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.