將HTML5地理位置傳遞給控制器​​

Question

我想要使用HTML5地理位置獲取用戶的座標並將它們發送給幫助程序方法。 Geocoder gem不是一個選項，因爲IP地理位置對於我的應用程序來說不夠準確。

這可能嗎？ 我使用CoffeeScript的纖薄琅

我的助手方法，位於application_helper.rb：

def get_station(location) 
    type = not relevant 
    key = not relevant 
    radius = 5000 
    url = "https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=#{location}&radius=#{radius}&type=#{type}&key=#{key}" 
    data = JSON.load(open(url))["results"][0]["name"] 
    end 

在我看來，CoffeeScript的部分（.slim模板）：

set_location = -> 
    if (navigator.geolocation) 
     navigator.geolocation.getCurrentPosition(setLocation); 

    setLocation = (position) -> 
    coords = position.coords.latitude + ", " + position.coords.longitude; 

我在發帖之前回顧的主題：

• Get rails view helper methods inside coffeescript
• HTML5 Geolocation In Rails
• A rails app which gets users location using HTML5 geolocation and saves to data base
• Storing HTML5 geolocation data
• https://github.com/joofsh/geofsh

Answer 1

你不能在這裏使用Rails的helper方法。

服務器端渲染在腳本發送給用戶之前完成。所以即使你使用插值<%= get_station(location) %>也會返回錯誤的結果。

navigator.geolocation.getCurrentPosition是異步的 - 在用戶允許地理定位之前，實際上不會調用回調。 而是讓客戶端發送Ajax請求到谷歌地圖API：

setLocation = (position) -> 
    uri = 'https://maps.googleapis.com/maps/api/place/nearbysearch/json' 
    promise = $.ajax(uri, 
    dataType: 'json' 
    data: 
     location: position.coords.latitude + ', ' + position.coords.longitude 
     type: 'hindu_temple' 
     radius: 5000 
     key: 'Your google maps key' 
    promise.done (data)-> 
    console.log(data) 

Answer 2

這不完全回答這個問題本身，但它確實是我需要使用AJAX和控制方法，而不是第一個地方做。 它成功地將LAT，LNG params從HTML5地理位置傳遞給控制器​​方法。

控制器：

def location 
    respond_to do |format| 
     format.json { 
     lat = params["lat"] 
     lng = params["lng"] 
     radius = 5000 
     type = "restraunt" 
     key = "-" 
     url = "https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=#{lat},#{lng}&radius=#{radius}&types=#{type}&key=#{key}" 
     data = JSON.load(open(url)) 
     results = [] 
     data["results"].each do |result| 
      results.push({ "name":result["name"], "vicinity":result["vicinity"], "lat":result["geometry"]["location"]["lat"], "lng":result["geometry"]["location"]["lng"] }) 
     end 
     render json: { :data => results, :lat => lat, :lng => lng } 
     } 
    end 
    end 

的routes.rb：

get "/location" => "application#location" 

觀點：

function getLocation(){ 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(function (position){ 
      $.ajax({ 
      type: 'GET', 
      url: '/location', 
      data: { lat: position.coords.latitude, lng: position.coords.longitude }, 
      contentType: 'application/json', 
      dataType: 'json' 
      }).done(function(data){ 
       console.log(data) 
      }); 
     }); 
    } 
    }