somanchiu / keyless-google-maps-api Goto Github PK

Use the Google Maps JavaScript API without API KEY in any domain

JavaScript 81.55% HTML 18.45%

keyless-google-maps-api's Introduction

Usage

<script src="https://cdn.jsdelivr.net/gh/somanchiu/[email protected]/mapsJavaScriptAPI.js"></script>

Example

Demo page: https://somanchiu.github.io/Keyless-Google-Maps-API/demo

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
    </script>
    <script src="https://cdn.jsdelivr.net/gh/somanchiu/[email protected]/mapsJavaScriptAPI.js"
    async defer></script>
  </body>
</html>

Supporting this project

keyless-google-maps-api's People

Contributors

Stargazers

Watchers

Forkers

flatroy desagarut cherki-hamza ojasgujju officialrakeshr abapcoder lutfiihsan codejq alcu1n edenderrick47 grexaai boy0704 xuelian-yang

keyless-google-maps-api's Issues

Api key Permission

is it okey if i use your api key directly ?

running multiple instances doesn't work

I've a web app with multiple tabs,
the first tab shows the map correctly,
the 2nd tab display this error message in console:
This IP, site or mobile application is not authorized to use this API key.

and shows this map:

The same app used to work with previous version.

Input my Google place within this code

Hi there,
Where do i place my Google place business name in this code?
Thanks in advance.

Your demo is working, but not my code that used to work

Hello,
I've a code that used to work correctly with the last version of the project.
But some times ago, map stopped loading and I've the floowing console errors:

I wonder if the error is related to the google maps Fr being loaded!

has been blocked by CORS policy: No 'Access-Control-Allow-Origin'

There was error in console

Does not work any more

Blocked by CORS

Hi,

The API gives this error, it was running smooth just couple hours ago.

Access to XMLHttpRequest at 'https://api.allorigins.win/raw?url=https%3A%2F%2Fmaps.googleapis.com%2Fmaps%2Fapi%2Fjs%3Fkey%3D%3A)%26callback%3DinitMap' from origin 'https://somanchiu.github.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

License info

Hi somanchiu, congratulations to this nice useful project!

Would you mind adding some license information to it such as a LICENSE or LICENSE.md file so that we know how we are permitted to use it? See https://opensource.stackexchange.com/questions/1720/what-can-i-assume-if-a-publicly-published-project-has-no-license

Key issue

Can we use this without any key many no times

Replace to cors.sh proxy cors

I have tried using cors.sh, but the URL form is slightly different from whateverorigin:
'https://proxy.cors.sh/https://example.com'

Based on documentation, I added header "x-cors-api-key":
xhttp.setRequestHeader("x-cors-api-key", "live_xxxxx");

And remove encodeURIComponent from xhttp.open:
xhttp.open("GET", CROSproxyURL + url, true);

And it's not necessary to JSON parse for callback:
callback(this.response);

common.js and map.js can be loaded and attached to head section, but there error in console:
Uncaught SyntaxError: Unexpected token 'true' (in common.js)
and
Uncaught SyntaxError: Unexpected token 'return' (in map.js)