Question

我现在正在使用针对Node的twitter API包装器，并且正在尝试弄清楚如何将查询参数从HTML表单传递到AJAX get请求，然后将该参数传递到我的Express路由中，而不是而不仅仅是让表格动作直接进入路线。

这是我的HTML代码

  <form id="searchTerm">
    Keyword:<input id="keyword" type="text" name="q" placeholder="Keyword">
    <input type="submit">
  </form>

我的客户端Javascript

$(document).ready(function() {
  $('#searchTerm').on('submit', function() {
    $.ajax({
      type: 'GET',
      data: q,
      url: '/search/tweets/term',
      success: function(data) {
        console.log(data);
      },
      error: function(error) {
        console.log(error);
      }
    });
  });
});

然后是我的Node.JS路线：

// Search by keywords or phrases
app.get('/search/tweets/term', function(req, res) {
  var q = req.query.q;

// Accesses the Twitter API and pulls back the respective tweets
  client.get('search/tweets', {q: q, count: 100, lang: 'en', exclude: 'retweets'}, function(error, tweets, response) {
    if(!error) {
      res.send(tweets);
    } else {
      console.log(error);
      res.status(500).send(error.stack);
    }
  });
});

但是，每当我在表单中输入值时，我的终端都会收到“Query Missing Parameters”错误消息。不知道我做错了什么。

更新

通过以下方式实现：

$(document).ready(function() {
  $('#searchTerm').on('submit', function(e) {
    e.preventDefault();
    var q = $('#keyword').val();

    $.ajax({
      type: 'GET',
      data: {q: q},
      url: '/search/tweets/term',
      success: function(data) {
        console.log(data);
      }
    })
  })
})

但是，由于我正在实现e.preventDefault（），我在URL中丢失了查询参数。由于我想让用户能够将URL与特定关键字共享，有没有办法在URL中保持这些参数不变，同时仍然获得JSON发送客户端？或者必须只是在服务器端操纵JSON并通过模板引擎呈现数据？

Answer 1

试试这个

$(document).ready(function() {
  $('#searchTerm').on('submit', function() {
    $.ajax({
      type: 'GET',
      data: q,
      url: '/search/tweets/term?q=',
      success: function(data) {
        console.log(data);
      },
      error: function(error) {
        console.log(error);
      }
    });
  });
});

将查询参数从AJAX get调用传递到快速路由

1 个答案: