将javascript变量传递给rails控制器上的ruby以进一步发送api答案

【问题标题】：pass javascript variable to ruby on rails controller to send in api further将javascript变量传递给rails控制器上的ruby以进一步发送api
【发布时间】：2026-02-09 04:20:02
【问题描述】：

我有一个 google api 地图作为 index.html

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
  #map {
    height: 100%;
  }
</style>
</head>
<body>
<div id="map"></div>
<script>
  // Note: This example requires that you consent to location sharing when
  // prompted by your browser. If you see the error "The Geolocation service
  // failed.", it means you probably did not give permission for the browser to
  // locate you.

  function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: -34.397, lng: 150.644},
      zoom: 15
    });
    var infoWindow = new google.maps.InfoWindow({map: map});

    // Try HTML5 geolocation.
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        var pos = {
          lat: position.coords.latitude,
          lng: position.coords.longitude
        };

        infoWindow.setPosition(pos);
        infoWindow.setContent('Location found.');
        map.setCenter(pos);
      }, function() {
        handleLocationError(true, infoWindow, map.getCenter());
      });
    } else {
      // Browser doesn't support Geolocation
      handleLocationError(false, infoWindow, map.getCenter());
    }
  }

  function handleLocationError(browserHasGeolocation, infoWindow, pos) {
    infoWindow.setPosition(pos);
    infoWindow.setContent(browserHasGeolocation ?
                          'Error: The Geolocation service failed.' :
                          'Error: Your browser doesn\'t support geolocation.');
  }



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

我想在 ruby on rails 控制器即产品控制器中使用 var=pos

require 'rubygems'

    require 'httparty'

    class ProductsController < ApplicationController



def index

    @results = HTTParty.get("https://api.uber.com          /v1/products?server_token=xyz&latitude=37.7759792&longitude=-122.41823").parsed_response

   respond_to do |format|
   format.json { render :json => JSON.parse(@results) }
   format.html { render "index.html.erb" }
   end
   end
   end

然后在api url中传递单独的纬度和经度，以便它可以采用任何纬度和经度，而不是手动给它。我该怎么做？任何建议将不胜感激。

【问题讨论】：

您确实意识到控制器中的代码运行在服务器上，而 javascript 运行在客户端？ “将变量传递给控制器”的唯一方法是向服务器发出另一个请求。

标签： javascript ruby-on-rails api google-maps-api-3 uber-api

【解决方案1】：

正如@max 所说，您必须向控制器发出另一个请求。如果你使用 jQuery 并且想要发出 AJAX 请求，可以这样做：

$.ajax({
  method: "GET",
  url: "products/some_action",
  data: { lat: pos.lat, lng: pos.lng }
})
.done(function( msg ) {
  alert( "Done" );
});

见http://api.jquery.com/jquery.ajax/

并在您的ProductsController 中添加：

def some_action
  # do something with params[:lat] and params[:lng]
end

【讨论】：

感谢@pmicha 的建议，但它对我没有帮助，因为 ajax 请求不起作用。

【解决方案2】：

通过在 windows.open javascript 函数中传递参数并在产品控制器中获取该参数解决了上述问题

index.html:

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
  #map {
    height: 100%;
  }
</style>
</head>
<body>
<div id="map"></div>
<script>
  // Note: This example requires that you consent to location sharing when
  // prompted by your browser. If you see the error "The Geolocation service
  // failed.", it means you probably did not give permission for the browser to
  // locate you.

  function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: -34.397, lng: 150.644},
      zoom: 15
    });
    var infoWindow = new google.maps.InfoWindow({map: map});

    // Try HTML5 geolocation.
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        var pos = {
          lat: position.coords.latitude,
          lng: position.coords.longitude
        };

        infoWindow.setPosition(pos);
        infoWindow.setContent('Location found.');
        map.setCenter(pos);
          if(pos){
          window.open("/products?lat="+pos.lat+"&long="+pos.lng,"_blank")
        }
      }, function() {
        handleLocationError(true, infoWindow, map.getCenter());
      });
    } else {
      // Browser doesn't support Geolocation
      handleLocationError(false, infoWindow, map.getCenter());
    }
  }

  function handleLocationError(browserHasGeolocation, infoWindow, pos) {
    infoWindow.setPosition(pos);
    infoWindow.setContent(browserHasGeolocation ?
                          'Error: The Geolocation service failed.' :
                          'Error: Your browser doesn\'t support geolocation.');
  }



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

产品控制器：

require 'rubygems'

    require 'httparty'

    class ProductsController < ApplicationController



def index
    lat = params[:lat].to_s
    long = params[:long].to_s
    @results = HTTParty.get("https://api.uber.com/v1/products?server_token=your_server_token&latitude="+lat+"&longitude="+long).parsed_response


   respond_to do |format|
   format.json { render :json => JSON.parse(@results) }
   format.html { render "index.html.erb" }
   end
   end
   end

【讨论】：