>

순수 자바 스크립트를 사용하여 Google지도 API에서 정보를 얻으려고합니다. 이를 위해 관련 정보를 검색하기 위해 주어진 주소를 쿼리합니다. 인터넷 검색을 통해 이 방법 을 찾았습니다. console.log로 설정 한 추적이 콘솔에 표시되지 않습니다.

내 코드는

function getZipcode(address){
            if(address){
                //Formatted address
                console.log("address  "+ address);
                var formattedAddr = address.split(' ').join('+');
                console.log("formattedAddr  "+ formattedAddr);
                //Send request and receive json data by address
                var url1 = 'http://maps.googleapis.com/maps/api/geocode/json?address=' + formattedAddr +'&sensor=true_or_false';
                console.log("url1  "+ url1);

                var geocodeFromAddr ;//= get_json(url1);
                // recuperar json
                console.log("pre geocodeFromAddr " );
                geocodeFromAddr = function(url1, trataJSON) {
                    console.log("geocodeFromAddr " );
                    var xhr = new XMLHttpRequest();
                    xhr.open('GET', url1, true);
                    xhr.responseType = 'json';
                    xhr.onload = function() {
                        console.log("geocodeFromAddr onload " );
                        var status = xhr.status;
                        console.log("geocodeFromAddr status " + status );                           
                        if (status === 200) {
                            trataJSON(null, xhr.response);
                        } else {
                            trataJSON(status, xhr.response);
                        }
                    };
                    xhr.send();
                    };
                    console.log("post geocodeFromAddr " );
            }
        }

여기서 내 콜백

function trataJSON(err, data){
            console.log("trataJSON " );
            if(err){
                console.log("trataJSON error " + err);
            }else{
                console.log("trataJSON ok " + data);
            }
        }

"calle pintor oliet 4 castellon"으로 테스트 중이며 콘솔의 로그는 다음과 같습니다.

와이즈 비즈

분명히 코드의 geocodeFromAddr 부분에 들어 가지 않는 것을 알 수 있습니다. 또한 Google API URL이 올바르게 작동하는지 확인할 수 있으며 오류가 전혀 반환되지 않습니다.

누군가가 실마리를 알려 주시겠습니까?

query = calle pintor oliet 4 castellon

address calle pintor oliet 4 castellon

formattedAddr calle+pintor+oliet+4+castellon

url1 http://maps.googleapis.com/maps/api/geocode/json?address=calle+pintor+oliet+4+castellon&sensor=true_or_false

pre geocodeFromAddr

post geocodeFromAddr


  • 답변 # 1

    다른 브라우저를 타겟팅하려는 경우 가져 오기 위해 Polyfill이 필요할 경우 Chrome에서이 코드를 사용해보십시오.

    fetch('https://maps.googleapis.com/maps/api/geocode/json?address=calle+pintor+oliet+4+castellon&sensor=true_or_false')
            .then(res => res.json())
            .then(d => {
                if (d.results && d.results.length) {
                    let address_components = d.results[0].address_components;
                    let postalCode = {};
                    address_components.forEach(addressComponent => {
                        if(addressComponent.types.includes("postal_code")){
                            postalCode = addressComponent;
                        }
                    })
                    console.log(postalCode);
                    console.log('Postal Code:->', postalCode.long_name);
                }
            })
    
    

관련 자료

  • 이전 android - EditText의 가치
  • 다음 python - GML 파일을 쓰는 중 NetworkX 키 오류