Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

351
Visualizações
No se puede ejecutar window.URL.createObjectURL(blob) para mostrar un archivo .png

Estoy usando una API para recuperar un archivo .png. Cuando trato de crear una URL para poder mostrarla en mi HTML, la llamada falla con el siguiente error:

userCodeAppPanel: 94 TypeError no detectado: no se pudo ejecutar 'createObjectURL' en 'URL': la resolución de sobrecarga falló.

Estoy llamando a mi api con este código (usando Google Apps Script):

 function retrieveAdmiraltyTideGraph(tideStationName, dateFrom, numDays){ //get tide station code from tide station name passed from user input let tideStationCode = getTideStationCode(tideStationName) var url = _admiraltyURL + "Stations/" + tideStationCode + "/TidalHeightGraph?dateTime=" + dateFrom + "&duration=" + numDays; url = url + "&width=500&height=200" var response = UrlFetchApp.fetch(url, _admiraltyRequestHeader); var responseCode = response.getResponseCode() var blob = response.getBlob() Logger.log("graph response" + responseCode) Logger.log(blob.getContentType()) return blob }

La llamada a la API es exitosa ya que el registrador muestra un código de retorno correcto, la verificación del tipo de contenido del blob muestra que es "imagen/png" como se esperaba.

Llamo a la función api desde Java Script usando:

 google.script.run.withSuccessHandler(showGraph).withFailureHandler(onFailure).retrieveAdmiraltyTideGraph(selectedStation, dateFrom, numDays);

y la llamada de función para mostrar la imagen recuperada es:

 function showGraph(blob){ var url = window.URL.createObjectURL(blob); document.getElementById("graph").src = url }

Esto está fallando cuando intento obtener la URL.

Soy bastante nuevo en JS y Google Apps Script, por lo que es posible que me esté equivocando en algo, pero tengo funciones muy similares que pasan y procesan matrices entre un controlador de API, el código del servidor y el código del cliente.

¿Alguna sugerencia?

Gracias

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Puntos de modificación:

  • En su lado de Google Apps Script, el blob se devuelve al lado de Javascript. Desafortunadamente, en la etapa actual, el blob de Google Apps Script no se puede usar directamente en el lado de Javascript. Pensé que esta podría ser la razón de su problema.

En su situación, ¿qué tal la siguiente modificación?

Guión modificado:

Lado de Google Apps Script:

De:

 return blob

A:

 return `data:${blob.getContentType()};base64,${Utilities.base64Encode(blob.getBytes())}`;

Lado HTML y Javascript:

De:

 function showGraph(blob){ var url = window.URL.createObjectURL(blob); document.getElementById("graph").src = url }

A:

 function showGraph(url){ document.getElementById("graph").src = url }
  • En esta modificación, se supone que la etiqueta como <img id="graph"> existe en su HTML. Por favor tenga cuidado con esto.

Referencia:

  • codificar base64 (datos)

Adicional:

Del graph de document.getElementById("graph") , pensé que tal vez quisiera mostrar la imagen. Pero, si desea que el usuario descargue el archivo de Google Apps Script, ¿qué tal la siguiente modificación?

Guión modificado:

Lado de Google Apps Script:

De:

 return blob

A:

 return [`data:${blob.getContentType()};base64,${Utilities.base64Encode(blob.getBytes())}`, blob.getName()];

Lado HTML y Javascript:

 <input type="button" value="download" onclick="sample()"> <script> function sample() { google.script.run.withSuccessHandler(showGraph).withFailureHandler(onFailure).retrieveAdmiraltyTideGraph(selectedStation, dateFrom, numDays); } function showGraph([url, filename]){ fetch(url) .then(res => res.blob()) .then(blob => { var a = document.createElement("a"); var url = window.URL.createObjectURL(blob); a.href = url; a.download = filename; a.click(); }); } function onFailure(e) { console.log(e) }
  • En esta modificación, cuando se hace clic en el botón, el archivo se descarga recuperando los datos de Google Apps Script.
  • En este caso, configure las variables de selectedStation, dateFrom, numDays en el lado de Javascript.
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda