大方向 rails 外部 API

Question

我正在开发一个使用 Edmunds 外部 API 的 rails 应用程序。 http://developer.edmunds.com/

在主页上，我试图创建一个动态 select 下拉框。这是事件的顺序。

1) 在首页加载时，select 下拉列表中会显示所有新车品牌（丰田、本田等）

2) 当用户选择特定的汽车品牌时，会出现第二个 select 下拉列表，其中包含特定品牌的所有汽车型号的列表。（凯美瑞、雅阁等）

3) 对于特定的 trim 和汽车样式，也会出现相同的顺序。最终结果是特定的汽车（Toyota Camry LE 2DR）。

4) 用户点击提交按钮，汽车的属性被保存到具有相同对应属性的Car模型中。

我正在寻找解决此问题的最佳方法的高级概述。

目前，我的动态 select 框行为正常工作。问题是它都是 Jquery，每次 selected 时都会调用 AJAX。

$.ajax({
  type: "GET",
  url: "http://api.edmunds.com/api/vehicle/v2/makes?fmt=json&state=new&api_key=" + edmunds_api_key,
  dataType: "jsonp",
  success: function(data) {
    var makeArray = data.makes;
    console.log(data.makes);
    $.each(makeArray, function(index, value) {
      $('#make_id').append('<option value="' + value.name + '">' + value.name + '</option>');
    });
  }
});

$(document).on('change', '#make_id', function() {
  retrieve_model(this.value);
});

function retrieve_model(make) {
  $.get('https://api.edmunds.com/api/vehicle/v2/' + make + '/models?  fmt=json&api_key=' + edmunds_api_key, function(data) {
    var modelArray = data.models;
    console.log(data.models);
    $('#model_id').empty();
    $.each(modelArray, function(index, value) {
      $('#model_id').append('<option>' + value.name + '</option>');
    });
  });
}

我知道有更好的方法可以做到这一点。我只是不确定如何去做或实施此类应用程序时的最佳做法是什么。

寻找有关如何按照所述进行项目的一般指导。

在主页加载时，我可以进行 1 次调用，然后在整个过程中使用该数据吗？而不是进行多次不必要的调用。

我确实找到了很多关于这个话题的帖子。比如..Using ActiveRecord interface for Models backed by external API in Ruby on Rails

大多数都超出了我的理解范围或旧版本的 Rails。有什么建议吗？

Answer 1

我会检查您的 API 许可证并计算预期数量 - 他们可能会限制您的连接数/second/hour。如果您能忍受这些限制，我看不出有任何理由不使用 API。您可以放置一些常识缓存以防止不必要的调用（未经测试）：

$(document).on('change', '#make_id', function() {
  writeModels(retrieve_model(this.value));
});

var modelCache = {};

function retrieve_model(make) {
  if (modelCache[make]) {
    return modelCache[make]; //return cached value
  }
  $.get('https://api.edmunds.com/api/vehicle/v2/' + make + '/models?  fmt=json&api_key=' + edmunds_api_key, { 
    context: this,  //needed to ensure "make" is correct in the complete callback
    complete: function(data) {
      var modelArray = data.models;
      console.log(data.models);
      modelCache[make] = data.models; //populate cache
    }
  });
}

function writeModels(modelArray) {
  $('#model_id').empty();
  $.each(modelArray, function(index, value) {
    $('#model_id').append('<option>' + value.name + '</option>');
  });
}

大方向 rails 外部 API

General direction rails external API

api

jquery

ruby-on-rails

ruby-on-rails-4