PHP - Tratando de solucionar el problema del Callback en la carga de Google Maps API

 
Vista:
sin imagen de perfil

Tratando de solucionar el problema del Callback en la carga de Google Maps API

Publicado por Juan Manuel (4 intervenciones) el 24/09/2023 00:02:33
Buenas noches.

Tengo una web en Joomla! con una extensión para la carga de la API de Google Maps.

Aunque es preceptivo incluir un callback en la llamada a la API, funcionaba hasta ahora sin el, pero desde hace unas semanas se ha hecho exigencia obligatoria y se ha concretado la imposibilidad de cargar la API con funciones sin callback.

No soy programador más que a nivel de javascript, y no muy avanzado, y he buscado diversas soluciones, llegado a elaboraciones como la que podéis ver en esta página:

https://stackoverflow.com/questions/75179573/how-to-fix-loading-the-google-maps-javascript-api-without-a-callback-is-not-supp

Lo cierto es que en el caso de mi web, la API se llama desde un php, con dos líneas problemáticas:

1
2
3
4
$url = 'https://maps.googleapis.com/maps/api/geocode/json?address=' . $address . '&key=' . $this->getServerApiKey();
 
 
JHtml::script('https://maps.googleapis.com/maps/api/js?key=' . $this->getJsApiKey());


Podéis ver el código que tengo como adjunto a este post, que contiene esas dos líneas en dos instancias sucesivas.


Después de varios días intentando solucionar el problema, no llegue a ninguna solución. En ocasiones, la inserción que hago no funciona y en otras arroja un error que anula toda la página.

Agradecería alguna sugerencia sobre si es posible solucionar este problema editando el código adjunto o debo prescindir de la API.

Gracias por cualquier respuesta.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Ivan

Tratando de solucionar el problema del Callback en la carga de Google Maps API

Publicado por Ivan (118 intervenciones) el 26/09/2023 11:46:09
Hola,

por lo que veo no estás incluyendo la función de callback en tus llamadas a la API, tal y como explican en stackoverflow el méotodo general sería así:

1
https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=Function.prototype

de modo que en tus funciones añadiendo esto:

1
2
$url = 'https://maps.googleapis.com/maps/api/geocode/json?address=' . $address . '&key=' . $this->getServerApiKey() . '&callback=Function.prototype';
 JHtml::script('https://maps.googleapis.com/maps/api/js?key=' . $this->getJsApiKey() . '&callback=Function.prototype');

Creo que debería funcionar.

Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Tratando de solucionar el problema del Callback en la carga de Google Maps API

Publicado por Juan Manuel (4 intervenciones) el 30/09/2023 13:08:58
Hola Iván.

Gracias por responder.

Me sale este error en la consola de Javascript:

1
2
3
4
5
6
7
Google Maps JavaScript API warning: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys
 
Uncaught (in promise) TypeError: k is undefined
 
pda https://maps.googleapis.com/maps/api/js?key=AQUÍ-MI-API-ACTUAL:207
 
promise callback*pda/< https://maps.googleapis.com/maps/api/js?key=AQUÍ-MI-API-ACTUAL:207


Creo que se trata de que la API está obsoleta. Supongo.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Tratando de solucionar el problema del Callback en la carga de Google Maps API

Publicado por Juan Manuel (4 intervenciones) el 30/09/2023 22:40:31
Añadiendo más información, adjunto el código como lo he editado.

Indica el mismo error: "Google Maps JavaScript API has been loaded directly without a callback", es decir, que el callback no existe.

Además, un pantallazo de los errores de la página.

En otro foro me indican esto:


1
2
3
4
5
6
7
8
9
10
11
12
La llamada a la api la estás haciendo con PHP y no con javascript, por lo que Function.prototype no existe.
 
Si en defecto estás usando javascript y solo armando la URL con PHP podrías declarar un callback vos mismo en el script
 
<script>
 
// ... tu codigo de google
 
function fakeCallback() {}
</script>
 
y en la URL: $url = 'https://maps.googleapis.com/maps/api/geocode/json?address=' . $address . '&key=' . $this->getServerApiKey() . '&callback=fakeCallback';

Pero lo cierto es que no he podido implementarlo de ninguna forma.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Ivan

Tratando de solucionar el problema del Callback en la carga de Google Maps API

Publicado por Ivan (118 intervenciones) el 01/10/2023 21:16:18
Hola,

puede ser difícil entender exactamente qué es lo que se hace mal y dónde está el problema a través de mensajes en un foro.
Así que parto de la base que antes el código funcionaba y de repente la API te pide un callback para seguir funcionando.

A partir de aquí doy por supuesto:
- Que tu código es correcto
- Tu API key es correcta

Los mensajes de otro foro tienen sentido desde el punto de vista que PHP se ejecuta en el servidor y JavaScript en el cliente cuando la página ya está cargada, pero si antes el código funcionaba, vuelvo a repetir, parto de la base que es correcto y que "construyes" el html en el servidor (incluido javascript) para que se ejecute en el cliente.

Entonces veo en los mensajes de error y en la documentación de Google un detalle que a mí también me daba problemas:
- Añadir async al script.

Yo tengo una aplicación también en PHP que hace:

1
$this->js  = '<script async src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDpJ7_ETC...&callback=initialize"></script>' . "\n";

y esto lo añade al <head>de la página html que se enviará al cliente. Funciona correctamente.

Sí que es cierto que si cambio mi función por Function.prototype Google detecta que no es una función pero me sigue funcionando, pero también puedes hacer:

1
$this->js  = '<script>function fake() {}</script><script async src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDpJ7_ETC...&callback=fake"></script>' . "\n";

y Google lo da por bueno.

En cualquier caso si el detalle de añadir async no funciona sólo se me ocurre el hecho de estar cargando varias veces la API tal y como se ve en los errores, pero no saltaría lo del callback y si antes funcionaba y ahora no... no se me ocurre mucho más.

Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Tratando de solucionar el problema del Callback en la carga de Google Maps API

Publicado por Juan Manuel (4 intervenciones) el 08/10/2023 10:10:15
Esta aplicación que comentas:

1
$this->js  = '<script>function fake() {}</script><script async src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDpJ7_ETC...&callback=fake"></script>' . "\n";

Puede que te funcione en tu aplicación pero no puedo incluirla de ninguna forma en el archivo adjunto. Da un error en la página.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Ivan

Tratando de solucionar el problema del Callback en la carga de Google Maps API

Publicado por Ivan (118 intervenciones) el 09/10/2023 16:25:37
Hola,

el ejemplo lo he puesto para recalcar que las soluciones propuestas son correctas, es decir, el problema no es de la API, ni de la key ni del callback.

Debes ser tu, que conoces tu código, el encargado de depurarlo y ver dónde o qué es lo que falla. Hay muchos detalles que pueden causar problemas, algunas ideas són:

- Revisa las variables PHP y comprobar los valores que contienen y/o devuelven.
- Comprbar que no se llame a la función antes de que ésta esté disponible (si usas la carga con async)
- Basado en lo anterior, cambiar el lugar donde se inserta el script (head, inicio del body, final del body, etc)
- Comprobar el código fuente de la página HTML a ver qué si hay algún pequeño error de sintaxis, comillas mal cerradas, etc.
- Verificar todo error que te mande PHP o la consola de programador F12

En fin, un listado de comprobaciones que todo programador ha realizado alguna vez.

A ver que tal ...

Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar