Google Maps JavaScript API RefererNotAllowedMapError

우리는 고객 중 한 명을위한 지오 플레이스먼트 앱을 개발하려고 노력하고 있으며 먼저 자체 도메인에서 테스트하고 싶습니다.

Google Maps JavaScript API에 서명했으며 유효한 브라우저 키가 있으며 도메인 www.grupocamaleon.com이 해당 키를 사용할 권한이 있습니다.

그러나 우리는 오류없이 실행하는 가장 쉬운 예조차 만들 수 없습니다.

도메인과 키에 다음 데모가 있습니다.

(1) http://www.grupocamaleon.com/boceto/aerial-simple.html

그러나 작동하지 않으며 Firebug 콘솔은 다음과 같이 말합니다.

"Google Maps API 오류 : Google Maps API 오류 : RefererNotAllowedMapError (RefererNotAllowedMapError에 대한 Google 문서 링크) 승인 할 사이트 URL : (1)"

내 자격증 명 페이지에 리퍼러를 추가하여 수락 할 가능성이 없기 때문에 리퍼러를 추가하는 것과 관련된 솔루션은 현재 불가능합니다.

내 자격증 명 페이지 :

왜 그 오류가 발생합니까? 어떻게 고칠 수 있습니까?

이미 여러 답변이있는 오래된 질문이라는 것을 알고 있지만 동일한 문제가 있었고 console.developers.google.com에 제공된 예제를 따르고 내 도메인을 형식으로 입력 한 것이 문제였습니다 *.domain.tld/*. 이것은 전혀 작동하지 않았다, 나는처럼이에 변화의 모든 종류를 추가하는 시도 domain.tld, domain.tld/*, *.domain.tld등

나를 위해 해결 한 것은 실제 프로토콜 도 추가하는 것이 었 습니다. http://domain.tld/*내 사이트에서 작동하는 데 필요한 유일한 것입니다. https://domain.tld/*HTTPS로 전환하려면 추가해야 할 것 같습니다 .

업데이트 : Google은 http이제 다음 을 포함하도록 자리 표시자를 마침내 업데이트했습니다 .

Google에 오세요, 여러분은 API Credential 페이지에서 제공하는 것보다 더 똑똑합니다. (저는 거기에서 일하는 두 아들이 있기 때문에 압니다.)

"참조 자"목록은 허용하는 것보다 훨씬 까다 롭습니다. (물론 더 관대 해야 합니다.) 다음은 몇 시간 이 걸리는 몇 가지 규칙입니다 .

• 목록의 순서가 중요합니다. 목록에서 URL을 위로 이동하면 제대로 작동 할 수 있습니다.
• "http : //"접두사가 필요합니다.
• "localhost"도 필요합니다 : " http : //localhost/foo/bar.html "
• 후행 * 는 비교 문자열 인 것처럼 와일드 카드로는 작동하는 것 같다.
• " http : //localhost/foo/bar.html "을 사용해도 " http : //localhost/foo/bar.html ? arg = 1 "은 작동하지 않습니다. (와일드 카드가 도움이 될까요?)
• 두 prod dev 모두에 대해 " http : //localhost/foo/bar.html "및 " http://my.site.com/foo/bar.html "의 두 행이 있어야합니다.
• 포트 번호 (8085? 4000?)가 필요하지 않은 것 같습니다.

다른 규칙이있을 수 있지만 이것은 지루한 추측 게임입니다.

문서에 따르면 'RefererNotAllowedMapError'는

Google Maps JavaScript API를로드하는 현재 URL이 허용 된 리퍼러 목록에 추가되지 않았습니다. Google Developers Console에서 API 키의 리퍼러 설정을 확인하세요.

개인 / 업무용으로 Google Maps Embed API를 설정했으며 지금까지 HTTP 리퍼러를 지정하지 않았습니다. 나는 오류를 등록하지 않습니다. 설정에 따라 Google에서 방문하는 URL이 등록 또는 허용되지 않은 것으로 인식되어야합니다.

변경 만하면 설정이 적용되는 데 최대 5 분이 소요될 수 있습니다.

많은 리퍼러 변형을 시도하고 Google이 양식 필드에 입력하는 예제에 결함이 있음을 알 때까지 5 분을 기다렸습니다. 그들은 보여줍니다 :

*.example.com/*

그러나 도메인 이름 이 subdomain.있거나 www.앞에 있는 경우에만 작동합니다 . 다음은 즉시 저에게 효과적이었습니다 (Google의 예에서 선행 마침표 생략).

*example.com/*

Google 문서 에 따르면 이것은 urlGoogle Maps API를 사용하고 있기 때문에 발생 했습니다 not registered.list of allowed referrers

편집하다 :

에서 Google 문서 도구

지정된 도메인의 모든 하위 도메인도 승인됩니다.

http://example.com 이 승인 된 경우 http://www.example.com 도 승인됩니다. 그 반대는 사실이 아닙니다. http://www.example.com 이 승인 된 경우 http://example.com 이 반드시 승인 된 것은 아닙니다.

따라서 http://testdomain.com도메인을 구성 http://www.testdomain.com하면 작업이 시작됩니다.

올바른 APIS도 활성화되어 있는지 확인하십시오.

위의 모든, 별표, 도메인 tlds, 슬래시, 백 슬래시 및 모든 것을 시도했으며 결국 마지막 희망으로 하나의 URL 만 입력했습니다.

이 모든 것이 작동하지 않았고 마침내 Google에서 사용할 API를 지정하도록 요구한다는 것을 깨달았습니다 (스크린 샷 참조).

활성화해야하는 기능이 없습니다 (내게는 Maps JavaScript API).

활성화하면 다음을 사용하여 모두 잘 작동했습니다.

http://www.example.com/ *

누군가에게 도움이 되었기를 바랍니다! :)

하위 도메인 부분에서는 와일드 카드 (별표)를 사용할 수 없습니다 .

• 잘못됨 : * .example.com / *
• 오른쪽 : example.com/*

자리 표시 자에 대해 Google이 말하는 것을 잊어 버리십시오. 허용되지 않습니다.

나는 당신조차도 HTTP Referreres충분히 유효하고 잘못된 API Restrictions원인 이라는 것을 발견했습니다 Google Maps JavaScript API error: RefererNotAllowedMapError.

예를 들면 :

• 키에 Javascript API를 사용하고 있습니다.
• 추가 http://localhost/*로Application Restrictions / HTTP Referrences
• Maps Embed API대신 선택Maps Javascript API
• 이것은 RefererNotAllowedMapError

수년에 걸쳐 많은 예상 솔루션이 있으며 일부는 더 이상 작동하지 않고 일부는 작동하지 않았으므로 2018 년 7 월 말에 저의 최신 솔루션이 작동합니다.

설정:

Google Maps JavaScript API가 제대로 작동해야합니다…

• API를 호출하는 여러 도메인 : example.com및example.net
• 임의의 하위 도메인 : user22656.example.com, 등
• 보안 및 표준 HTTP 프로토콜 : http://www.example.com/및https://example.net/
• 무기한 경로 구조 (즉, 많은 수의 다른 URL 경로)

해결책:

• 실제로 자리 표시 자의 패턴 사용 : <https (or) http>://*.example.com/*.
• 프로토콜을 생략하지 않고 도메인 당 두 개의 항목을 추가합니다 (프로토콜 당 하나씩).
• 하위 도메인에 대한 추가 항목 ( *.호스트 이름 앞에 붙음).
• RefererNotAllowedMapError적절한 구성을 사용하고 충분한 시간을 기다린 후에도 오류가 여전히 나타난다 는 느낌이 들었 습니다. 자격 증명 키를 삭제하고 요청을 반복했습니다 (이제InvalidKeyMapError ) 새 자격 증명을 만들었으며 (정확히 동일한 설정 사용) 그 이후로 작동했습니다.
• 단순한 프로토콜과 도메인을 추가하면 하위 도메인이 포함되지 않은 것 같습니다.
• 도메인 중 하나의 작업 구성은 다음과 같습니다.

(텍스트로 :)

Accept requests from these HTTP referrers (web sites)
    https://*.example.com/*
    https://example.com/*
    http://*.example.com/*
    http://example.com/*

이러한 HTTP 리퍼러 (웹 사이트)의 요청 수락

localhost 디렉토리 경로 작성

동일한 오류가 발생했습니다.

이 링크는 API 키 제한을 설정하는 방법에 대해 설명합니다. https://cloud.google.com/docs/authentication/api-keys#adding_http_restrictions

제 경우 문제는이 제한을 사용하고 있다는 것입니다.

HTTP 리퍼러 (웹 사이트) 이러한 HTTP 리퍼러 (웹 사이트)의 요청을 수락합니다 (선택 사항) 와일드 카드에 *를 사용합니다. 이 입력란을 비워두면 모든 추천인의 요청이 수락됩니다. 프로덕션에서이 키를 사용하기 전에 참조자를 추가해야합니다. https://*.example.net/*

이는 https://www.example.net 또는 https://m.example.net 또는 https://www.example.net/San-salvador/ 와 같은 URL이 작동 함을 의미합니다 . 그러나 https://example.net 또는 https://example.net 또는 https://example.net/San-salvador/ 와 같은 URL 은 작동하지 않습니다. 두 번째 참조자를 추가하기 만하면됩니다.

https://example.net/*

그것은 나를 위해 문제를 해결했습니다.

2 개의 웹 사이트 도메인을 추가하고 하위 도메인에 "*"를 설정하면 작동하지 않지만 특정 하위 도메인 "WWW"와 비 하위 도메인이 동일한 Google Map API 키를 사용하여 내 웹 사이트에서 작동했습니다.

하위 도메인에 "*"를 사용하지 마십시오.

도움이 되었기를 바랍니다.

API 자격 증명 페이지의 스크린 샷을 보여 주지만 "브라우저 키 1"을 클릭하고 거기에서 리퍼러를 추가해야합니다.

더 깊은 중첩 페이지 용

예를 들어 폴더에 프로젝트가 있거나 중첩 된 페이지가있는 경우

http://yourdomain.com/your-folder/your-page 당신은 이것을 입력 할 수 있습니다

http://yourdomain.com/*/*

/*/*/*얼마나 멀리 가야하는지 에 따라 중요한 부분은

*일치하지 /않거나 더 깊은 길로 들어갈 것 같습니다 ..

이보다 더 깊은 중첩이 있지 않는 한 전체 도메인 액세스 권한을 제공합니다.

이러한 수정 사항 중 어느 것도 RefererNotAllowedMapError프로젝트에 연결된 결제 계정이 없기 때문에 발생할 수 있음을 알기 전까지 는 효과가 없었습니다. 따라서 무료 평가판 등을 활성화하십시오.

1. 결제가 활성화되어 있는지

2. 귀하의 웹 사이트가 Google 콘솔 에 추가되었음을

3. 웹 사이트가 앱의 리퍼러에 추가됩니다.

4. (www와 www 모두에 대해 와일드 카드를 사용하십시오.)

http://www.example.com/ * 및 http://example.com/ *

5. 해당 자바 스크립트 맵이 활성화되어 있고 올바른 자격 증명을 사용하고 있습니다.

6. 위의 Google 콘솔을 활성화하기 위해 웹 사이트가 DNS에 추가되었습니다.

7. 작동 후 미소 지으십시오!

이것은 끔찍한 구현을 가진 또 다른 sh1tty Google 제품입니다.

내가 발견 한 문제는 IP 주소로 API 키를 제한하면 작동하지 않는다는 것입니다. 그러나이 점을 명확히하는 것은 Google과는 거리가 멀습니다. 문제 해결 및 조사를 거쳐야 발견했습니다.

IP 주소 제한이있는 API 키는 서버 측에서 사용하도록 의도 된 웹 서비스 (예 : Geocoding API 및 기타 웹 서비스 API)에서만 사용할 수 있습니다. 이러한 웹 서비스의 대부분은 Maps JavaScript API 내에서 동등한 서비스를 제공합니다 (예 : Geocoding Service 참조). Maps JavaScript API 클라이언트 측 서비스를 사용하려면 HTTP 리퍼러 제한으로 보호 할 수있는 별도의 API 키를 만들어야합니다 (API 키 제한 참조).

https://developers.google.com/maps/documentation/javascript/error-messages

FFS Google ... 설정시 명확하게 설명 할 수있는 매우 중요한 정보 ...

http://www.example.com/ *은 며칠 동안 노력한 끝에 저에게 효과적이었습니다.

Google의이 팁을 사용하여 마침내 제 작업을했습니다. ( https://support.google.com/webmasters/answer/35179 )

다음은 도메인 및 사이트에 대한 정의입니다. 다음 정의는 Search Console 확인에만 해당됩니다.

http://example.com/ - A site (because it includes the http:// prefix)
example.com/ - A domain (because it doesn't include a protocol prefix)
puppies.example.com/ - A subdomain of example.com
http://example.com/petstore/ - A subdirectory of http://example.com site

이 작업을 수행하는 데 어려움을 겪었지만 다음은 몇 가지 지침입니다.

• 리퍼러로 설정된 URL에는 다음이 포함됩니다 http.http://example.com/*
• Google Maps JavaScript API가 활성화되었습니다.
• 이 계정에 결제가 설정되었습니다.

위의 모든 문제가 해결되면지도가 예상대로 표시됩니다.

Places API (Autocomplete) 를 사용하려고 했고 Places API가 작동하기 전에 Google Cloud Console 내에서 Maps Javascript API 를 활성화해야 했습니다.

현장에서 데크 라 레이션을 확인하십시오. Google Maps JavaScript API를로드하려면 다음과 같은 스크립트 태그를 사용하십시오.

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
async defer></script>

내 Wordpress 사이트의 function.php 파일에서이 선언을 사용합니다.

wp_enqueue_script("google-maps-v3", "//maps.google.com/maps/api/js?key=YOUR_API_KEY", false, array(), false, true);

이 형식에 API 키를 설정했으며 제대로 작동합니다.

http://my-domain-name(without www).com/*

이 선언이 작동하지 않습니다

*.my-domain-name.com/*

제한을 제거하면 (없음으로) 저에게 효과적이었습니다.

내 경험상

http://www.example.com

잘 작동하지만 https는 끝에 / *가 필요합니다.

크롬의 자바 스크립트 콘솔은 HTTP 리퍼러 목록에 전체 페이지 주소를 선언 할 것을 제안했습니다.이 경우 http://mywebsite.com/map.htm 정확한 주소는 http://www.mywebsite.com/map.htm 이지만 - 다른 사람들이 제안한대로 이미 와일드 카드 스타일이 나열되었지만 이것이 저에게 적합한 유일한 방법이었습니다.

이것은 나를 위해 일했습니다. API 키 설정에는 두 가지 주요 제한 범주가 있습니다.

• Application restrictions
• API restrictions

응용 프로그램 제한 :

Referrer 섹션의 하단에 웹 사이트 URL " http://www.grupocamaleon.com/boceto/aerial-simple.html "을 추가하십시오. 섹션 의 오른쪽에는 다양한 요구 사항에 따라 예제 규칙이 있습니다.

API 제한 :

API 제한에 따라 드롭 다운 목록에서 'Maps Javascript API' 를 명시 적으로 선택해야합니다. 고유 키는 Google지도 API (아마도)를 호출하는 데만 사용되며 아래 스냅에서 볼 수 있듯이 저장합니다. 나는 이것이 당신을 위해 일하기를 바랍니다 .....

스크립트 확인 :

또한 스크립트 태그 내부의 부적절한 키 입력으로 인해 문제가 발생할 수 있습니다. 다음과 같아야합니다.

  <script async defer src="https://maps.googleapis.com/maps/api/jskey=YOUR_API_KEY&callback=initMap"
  type="text/javascript"></script>