ホームページ ウェブフロントエンド jsチュートリアル FormDataとSpring MVCがAjaxファイルダウンロード機能を実装

FormDataとSpring MVCがAjaxファイルダウンロード機能を実装

Mar 31, 2018 am 10:39 AM
ajax formdata spring

今回は、Ajax の ファイル ダウンロード 機能を実装するための FormData と Spring MVC について説明します。FormData と Spring MVC が Ajax ファイルのダウンロード 機能を実装するための の注意点は何ですか。以下は実際的なケースです。 。

Ajaxファイルのダウンロード

FormDataオブジェクトとSpring MVCを使用してAjaxファイルアップロード機能を実装する:

手順

1. コンポーネントをインポートし、静的スクリプトを準備します

<dependency>
 <groupId>commons-fileupload</groupId>
 <artifactId>commons-fileupload</artifactId>
 <version>1.3.2</version>
</dependency>
  <h1>Ajax 文件上载</h1>
  <input type="file" id="file1"> <br>
  <input type="file" id="file2"> <br>
  <input type="button" id="upload" value="上载" >
  <p id="result"></p>
ログイン後にコピー

1.ボタンに

$("upload").click(ajaxUpload);
ログイン後にコピー

2. ファイルを取得

var file1 = $("#file1")[0].files[0];
var file2 = $("#file2")[0].files[0];
ログイン後にコピー

3. メモリ上にフォームオブジェクトを作成し、サーバーに送信するデータを追加

//创建内存中的表单对象
var form = new FormData();
//向其中添加要传输的数据
form.append("userfile1", file1);
form.append("userfile2", file2);
ログイン後にコピー

4. ajax() オブジェクトをアップロード

$.ajax({
  url:'user/upload.do',//请求地址
  data: form,   //请求参数
  type: 'POST',  //请求类型
  dataType: 'json',//服务器返回的数据类型
  contentType: false,//没有设置任何内容类型头信息
  processData: false, //见jQuery_api详解
  success: function(obj){ //成功时回调函数,obj表示服务器返回的数据
    if(obj.state==0){
      $('#result').html("成功!"); 
    }
  }
});
ログイン後にコピー

5. Spring-MVCプレゼンテーションレイヤー

@RequestMapping("/upload.do")
@ResponseBody
public JsonResult upload( 
    MultipartFile userfile1, 
    MultipartFile userfile2) throws Exception{
  //Spring MVC 中可以利用 MultipartFile 
  //接收 上载的文件! 文件中的一切数据
  //都可以从 MultipartFile 对象中找到
  //获取上再是原始文件名
  String file1 = 
    userfile1.getOriginalFilename();
  String file2 = 
    userfile2.getOriginalFilename();
  System.out.println(file1);
  System.out.println(file2);
  //保存文件的3种方法:
  //1. transferTo(目标文件)
  //  将文件直接保存到目标文件, 可以处理大文件
  //2. userfile1.getBytes() 获取文件的全部数据
  //  将文件全部读取到内存, 适合处理小文件!!
  //3. userfile1.getInputStream()
  //  获取上载文件的流, 适合处理大文件
  //保存的目标文件夹: /home/soft01/demo
  File dir = new File("D:/demo");
  dir.mkdir();
  File f1 = new File(dir, file1);
  File f2 = new File(dir, file2);
  //第一种保存文件
  //userfile1.transferTo(f1);
  //userfile2.transferTo(f2);
  //第三种 利用流复制数据
  InputStream in1 = userfile1.getInputStream();
  FileOutputStream out1 = 
    new FileOutputStream(f1);
  int b;
  while((b=in1.read())!=-1){
    out1.write(b);
  }
  in1.close();
  out1.close();
  InputStream in2 = userfile2.getInputStream();
  FileOutputStream out2=
      new FileOutputStream(f2);
  byte[] buf= new byte[8*1024];
  int n;
  while((n=in2.read(buf))!=-1){
    out2.write(buf, 0, n);
  }
  in2.close();
  out2.close();
  return new JsonResult(true);
  }
ログイン後にコピー

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨書籍:

CORS を使用して WebApi Ajax クロスドメイン リクエストを実装する方法

Ajax がコンボ ボックスの動的読み込みを実装する方法 (コード付き)

以上がFormDataとSpring MVCがAjaxファイルダウンロード機能を実装の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Spring Boot と OpenAI の出会いによる新しいプログラミング パラダイム Spring Boot と OpenAI の出会いによる新しいプログラミング パラダイム Feb 01, 2024 pm 09:18 PM

2023年、AI技術が注目を集め、プログラミング分野を中心にさまざまな業界に大きな影響を与えています。 AI テクノロジーの重要性に対する人々の認識はますます高まっており、Spring コミュニティも例外ではありません。 GenAI (汎用人工知能) テクノロジーの継続的な進歩に伴い、AI 機能を備えたアプリケーションの作成を簡素化することが重要かつ緊急になっています。このような背景から、AI 機能アプリケーションの開発プロセスを簡素化し、シンプルかつ直観的にし、不必要な複雑さを回避することを目的とした「SpringAI」が登場しました。 「SpringAI」により、開発者はAI機能を搭載したアプリケーションをより簡単に構築でき、使いやすく、操作しやすくなります。

Spring Boot と Spring AI を使用して生成人工知能アプリケーションを構築する Spring Boot と Spring AI を使用して生成人工知能アプリケーションを構築する Apr 28, 2024 am 11:46 AM

Spring+AI は業界リーダーとして、強力で柔軟な API と高度な機能を通じてさまざまな業界に最先端のソリューションを提供します。このトピックでは、さまざまな分野での Spring+AI の応用例を詳しく掘り下げ、Spring+AI がどのように特定のニーズを満たし、目標を達成し、これらの教訓をより広範囲のアプリケーションに拡張するかを示します。このトピックが Spring+AI の無限の可能性をより深く理解し、活用するきっかけになれば幸いです。 Spring フレームワークはソフトウェア開発の分野で 20 年以上の歴史があり、Spring Boot 1.0 バージョンがリリースされてから 10 年が経過しました。今、その春に異論を唱える人はいない

jQuery AJAX リクエストで発生した 403 エラーを解決する方法 jQuery AJAX リクエストで発生した 403 エラーを解決する方法 Feb 20, 2024 am 10:07 AM

タイトル: jQuery AJAX リクエストの 403 エラーを解決する方法とコード例。403 エラーは、サーバーがリソースへのアクセスを禁止するリクエストを指します。このエラーは通常、リクエストにアクセス許可がないか、サーバーによって拒否されたために発生します。 jQueryAJAX リクエストを行うときにこのような状況に遭遇することがありますが、この記事ではこの問題の解決方法とコード例を紹介します。解決策: 権限を確認します。まず、要求された URL アドレスが正しいことを確認し、リソースにアクセスするための十分な権限があることを確認します。

jQuery AJAXリクエスト403エラーを解決する方法 jQuery AJAXリクエスト403エラーを解決する方法 Feb 19, 2024 pm 05:55 PM

jQuery は、クライアント側の開発を簡素化するために使用される人気のある JavaScript ライブラリです。 AJAX は、Web ページ全体をリロードせずに、非同期リクエストを送信し、サーバーと対話するテクノロジーです。ただし、jQuery を使用して AJAX リクエストを行うと、403 エラーが発生することがあります。 403 エラーは通常、セキュリティ ポリシーまたは権限の問題が原因で、サーバーによってアクセスが拒否されたエラーです。この記事では、jQueryAJAX リクエストで 403 エラーが発生した場合の解決方法について説明します。

Ajaxを使用してPHPメソッドから変数を取得するにはどうすればよいですか? Ajaxを使用してPHPメソッドから変数を取得するにはどうすればよいですか? Mar 09, 2024 pm 05:36 PM

Ajax を使用して PHP メソッドから変数を取得することは、Web 開発では一般的なシナリオであり、Ajax を使用すると、データを更新せずにページを動的に取得できます。この記事では、Ajax を使用して PHP メソッドから変数を取得する方法と、具体的なコード例を紹介します。まず、Ajax リクエストを処理し、必要な変数を返すための PHP ファイルを作成する必要があります。以下は、単純な PHP ファイル getData.php のサンプル コードです。

Spring でトランザクション分離レベルを設定する方法 Spring でトランザクション分離レベルを設定する方法 Jan 26, 2024 pm 05:38 PM

Spring でトランザクション分離レベルを設定する方法: 1. @Transactional アノテーションを使用します; 2. Spring 構成ファイルに設定します; 3. PlatformTransactionManager を使用します; 4. Java 構成クラスに設定します。詳細な導入方法: 1. @Transactional アノテーションを使用し、トランザクション管理が必要なクラスまたはメソッドに @Transactional アノテーションを追加し、属性に分離レベルを設定します。 2. Spring の設定ファイルなどで

jQuery AJAX エラー 403 の問題を解決するにはどうすればよいですか? jQuery AJAX エラー 403 の問題を解決するにはどうすればよいですか? Feb 23, 2024 pm 04:27 PM

jQueryAJAX エラー 403 の問題を解決するにはどうすればよいですか? Web アプリケーションを開発する場合、非同期リクエストを送信するために jQuery がよく使用されます。ただし、jQueryAJAX の使用時に、サーバーによってアクセスが禁止されていることを示すエラー コード 403 が発生する場合があります。これは通常、サーバー側のセキュリティ設定が原因ですが、回避する方法があります。この記事では、jQueryAJAX エラー 403 の問題を解決する方法と具体的なコード例を紹介します。 1.作る

PHP と Ajax: オートコンプリート提案エンジンの構築 PHP と Ajax: オートコンプリート提案エンジンの構築 Jun 02, 2024 pm 08:39 PM

PHP と Ajax を使用してオートコンプリート候補エンジンを構築します。 サーバー側スクリプト: Ajax リクエストを処理し、候補を返します (autocomplete.php)。クライアント スクリプト: Ajax リクエストを送信し、提案を表示します (autocomplete.js)。実際のケース: HTML ページにスクリプトを組み込み、検索入力要素の識別子を指定します。

See all articles