7

私の最終的な目標は、ボタンがクリックされたときに任意のJSONをnode.jsに送信することです。私は現在、フォームから入力を送信する方法しか知りません。フォーム情報を送信するためにまとめたコードは次のとおりです。

function postForm() {
  $('form').submit(function(e) {
    e.preventDefault(); // no page reload
    $.post(
      $(this).attr('action'),
      $(this).serialize(),
      function(data) { console.log('Code for handling response here.') },
     'json'
    );
  });
}

HTMLは次のようになります。

<form action='/send' method='post'>
  <input name= "foo" type="radio" value=1>
  <input type="submit" value="Submit">
</form>

そして、関連するexpress/node.jsコードは次のようになります。

app.post('/send', function(request, response) {
  fs.appendFile('test.txt', JSON.stringify(request.body) + '\n', function(e) {
    if(e) throw e;
    console.log(request.body);
  });
});

ただし、フォーム入力以外のデータを使用するようにこの例を適応させる方法がわかりません。コンテキストを提供するために、私はWebベースのユーザー調査を作成しており、ユーザーに関して収集されたさまざまな情報をnode.jsに送信したいと思います。フォーム送信で機能していたもののバリエーションを試しましたが、どれも成功しませんでした。私の印象では$(this).serialize()、クライアントがアクセスできる他のデータにスワップアウトすることはできましたが、この考え方を機能させることはできませんでした。また、多くの.ajax()例のいくつかを変更しようとしましたが、ページが更新されるとユーザーの状態情報が失われるため、これらの例では常にページがリダイレクトされます。これは望ましくありません。

私はかなりの量のクライアント側とサーバー側のプログラミングを行いましたが、ajaxがどのように機能するかについてはほとんど知識がなく、これを解決するにはかなり問題があります。また、多くの場合、それが2つを接着するものであるため、かなりばかげています:)

4

1 に答える 1

6

jQuery を使用しているため、データの送信は簡単です。$.post(url, data)ボタンのclickハンドラーから呼び出します。

$('#somebutton').click(function() {
    var data = { key: 'value', ... };
    $.post('/send', data, function(res) {
        // success callback
    });
});

ブラウザは、データ引数のURLエンコードされたシリアル化を使用しPOSTてURL を送信します。

POST /send HTTP/1.1
Content-Type: application/x-www-form-urlencoded
...

key=value&...

どちらのエクスプレスbodyParserで問題ありませんか。または、jQuery にデータの JSON シリアル化を送信するように指示することもできます。

$.post('/send', data, function(res) {}, 'json');

bodyParserあなたの場合、両方の形式が自動的に逆シリアル化されるため、jQuery がデータ (エンコードされた URL または JSON) を送信する方法は実際には問題ではありません。

于 2012-12-04T20:39:26.940 に答える