9

このスクリプトを使用して、Rails3.2.8アプリケーションでHTML5FormDataを使用してファイルを(1つずつ)アップロードします。

http://jsfiddle.net/RamPr/

$('.uploader input:file').on('change', function() {
  $this = $(this);

  $('.alert').remove();

  $.each($this[0].files, function(key, file) {
    $('.files').append('<li>' + file.name + '</li>');

    data = new FormData();
    data.append(file.name, file);

    $.ajax({
      url: $('.uploader').attr('action'),
      contentType: 'multipart/form-data',
      type: 'POST',
      dataType: 'json',
      data: data,
      processData: false
    });
  });
});

しかし、ファイルをアップロードすると、コンソールで次のエラーが発生します。

webrick/server.rb:191:in `block in start_thread' ERROR ArgumentError: invalid %-encoding ("filename.jpeg" Content-Type: image/jpeg

このエラーを解決するにはどうすればよいですか?

4

1 に答える 1

19

この問題を見たことがありますか?jQuery.ajaxを使用してmultipart/formdataを送信する

コンテンツタイプのヘッダーを追加するjQueryに遭遇している可能性があります。これにより、境界文字列が失われます。上記のリンクされた問題から:

contentTypeオプションをに設定してfalse、jQueryにContent-Typeヘッダーを追加しないように強制する必要があります。そうしないと、境界文字列が追加されなくなります。processDataまた、フラグをに設定したままにする必要がありますfalse。そうしないと、jQueryがFormDataを文字列に変換しようとして失敗します。

これに基づいて、これを試してみてください。

$.ajax({
  url: $('.uploader').attr('action'),
  contentType: false,
  cache: false,
  processData: false,
  type: 'POST',
  dataType: 'json',
  data: data
});

私はこれを自分で試したことはありませんが、これはあなたが探しているドロイドかもしれないと思います:)

于 2012-09-19T22:00:08.350 に答える