8

I have a situation with an application that I deploy a Google Map that can be displayed in three different locations:

  • In Application Webview
  • Preview in browser
  • Published to a server

So I need the user to have added some referrers to there api key to cover them for the time they publish to their own server.

They can add a referrer just fine for both the published map on their own server, and the preview in browser locally aspects.

But I can't figure out what you add as a referrer for the situation when the map is previewed in the applications web view, and the url for the page at that point is a file:/// referenced url?

If we leave all referrers blank for a complete wildcard api key it works in the webview in app.

I have tried about as many configurations as I can think of for a referrer for file:/// url but no luck:

I tried:

file

file*

file/*

file:///*

Gary Simpson
  • 2,677
  • 2
  • 17
  • 18
  • You can't .. google maps work only if the internet connect is enable and the maps library are obtainable by internet .. – ScaisEdge Jun 25 '16 at 15:48
  • 1
    Sorry I should note that within the app it has access to the internet. If I use a complete wildcard api key by not adding any referrers at all it works in app with the file:/// url. – Gary Simpson Jun 25 '16 at 16:08
  • If internet is available by you application then shoudl work but what do you mean with "If I use a complete wildcard api key by not adding any referrers at all it works" – ScaisEdge Jun 25 '16 at 16:13
  • Yes updated question to make more sense I hope, but yes if I add no referrers it works in the apps web view where the window location is a file:/// url, but those file referrers I have tried stop it working in app, while continue to work in the published page and local host because of the referrers added to cater for these situations. – Gary Simpson Jun 25 '16 at 16:19
  • if i undrestand right . the file work correct then you use localhost .. and don't work when you use it in filesystem .. .. right? – ScaisEdge Jun 25 '16 at 16:22
  • Thats right I can set for example 2 referrers "localhost" and "file", when previewing locally in the browser the window location is localhost so the localhost referrer kicks in and all is well, but in application web view where the window location is file:/// then the "file" referrer has no effect so we see the google "ooops" error instead of the map. – Gary Simpson Jun 25 '16 at 16:24
  • But the reference to google maps api must be the same always ... the link to google is for obtain the library .and you just expose to google your apikey for google right's check – ScaisEdge Jun 25 '16 at 16:27
  • If I added no referrers at all to the api key at Google console, then yes, Google does not care about the url that the map is currently being served on. But the moment you add one referrer, you must add a referrer for every possible location that map could be display. I have to add one for the published page url (my domain name for example "*.mydomain.com", and so I have to then add one for the local host possibility "localhost", now a need to also add one for the time that map – Gary Simpson Jun 25 '16 at 16:32
  • is being served in app in the web view and the url is completely different but begins file:/// always, and this is the one I can not find a way to add. – Gary Simpson Jun 25 '16 at 16:33
  • You must think that the google maps work only if obtain google.maps.js library from google .. and this library is not available for local storage . – ScaisEdge Jun 25 '16 at 16:35
  • No, this is not the case, as said, if I use a complete wildcard, by virtue of the fact that I add no referrers to the key, then it works without fail in the app web view where the page is in the local filesystem referenced by file:/// – Gary Simpson Jun 25 '16 at 16:38
  • I'm having this same issue, any luck? A bit more clarification: we are loading the google maps library from the web, in my case `https://maps.google.com/maps/api/js?language=en&key=` and the page that is loading it on device is `file:///android_asset/www/index.html` and browser preview is `http://localhost:3000/` – Malik Drako Jun 28 '16 at 00:04
  • Any luck with this? I'm finding dead end threads on this issue all over the place. – jlogan Dec 13 '16 at 19:58

1 Answers1

7

It seems that you won't be able to resolve this problem using file:/// as URL origin. You'll always get the RefererNotAllowedMapError error. Using file:/// as URL origin tells me you're trying to run this on a local environment. I suggest you use a local server using either Python Simple HTTP server or NodeJS local server.

I've enumerated the steps on how to setup a local Python server in this SO thread. You'll be able to run your Google Map sample using that.

UPDATE

Good news, Google has added support for file:/ referrers. You can see the following text in the documentation

file:// referers need a special representation to be added to the Key restriction. The "file:/" part should be replaced with "__file_url__" before being added to the Key restriction. For example, "file://path/to/" should be formatted as "__file_url__/path/to/*". After enabling file:// referers, it is recommended you regularly check your usage, to make sure it matches your expectations

https://developers.google.com/maps/documentation/javascript/get-api-key#key-restrictions

Community
  • 1
  • 1
ReyAnthonyRenacia
  • 17,219
  • 5
  • 37
  • 56
  • Accepted as no referrer for a url origin of file:/// exists. I am a third party plugin to the application though, so changing that url to localhost is not an option for me. – Gary Simpson Jun 28 '16 at 10:19
  • Is there anything we can do if we cant change how we load the origin? (in my case a PhoneGap app), or are we stuck not using a key or using a wildcard key? – Malik Drako Jun 28 '16 at 20:24