Mongoのデータベースに写真をアップロードし、モンゴデータベースのダウンロードの写真を前に、ディスプレイから

/ ** 
     *アップロードデータベースをモンゴに保存した画像ファイル、
     * @paramのDOC 
     * @paramの親ディレクトリのファイルは、
     * @paramのリクエスト
     * @return 
     * / 
    @PostMapping（ "/ uploaddoc" ）
     公衆にErrorMessageのuploaddoc（MultipartFile DOC、ストリング親@RequestParamは、HttpServletRequestのリクエスト）スローのIOException { 
        にErrorMessage結果 = 新しい新たにErrorMessage（）; 
        MongoDatabase DB = mongoTemplate.getDb（）; 
        GridFSBucketバケット = GridFSBuckets.create（DB、 "ドキュメント"）; //不在を作成、オブジェクトを開く 
        GridFSUploadStream uploadStream = bucket.openUploadStream（doc.getOriginalFilename（））; 
        uploadStream.write（doc.getBytes（））; 
        のSystem.out.println（uploadStream.getObjectId（））; 
        uploadStream.close（ ）; 
    　 戻り値の結果; 
    }   

/ ** 
     *画像ファイルは、フロントエンドの<img>でに表示されているダウンロード
     * / 
    （@GetMapping "/ DownloadImage / UUID {}" ）
     公共 無効 DownloadImage（UUID文字列@PathVariable、HttpServletResponseの応答）がスローにIOException {
 //         response.setContentTypeを（ "画像/ JPG"）; // 表示は、それを設定する必要はありません 
        MongoDatabase DB = mongoTemplate.getDb（）; 
        GridFSBucketバケット = GridFSBuckets.create（DB、 "ドキュメントを"）; //は、既存のオブジェクト開く
         // UUIDをMongoのデータベース内の画像ファイルとしてID 
        GridFSDownloadStream downloadStream = bucket.openDownloadStream（新しい新規のObjectId（UUID））。
        OutputStreamのOutputStream= response.getOutputStream（）。
        IOUtils.copy（downloadStream、のOutputStream）。
        downloadStream.close（）; 
        outputStream.close（）; 
    }

コードの先端部// 
//のhttp：// localhostを：/ 8080 downloadImage / 5dca4f1d911b52478896430eは、 バックエンドインターフェースアクセスする

// 5dca4f1d911b52478896430eオブジェクトであるのObjectId GridFs

<IMGのID = "IMG1" SRC = ""> 
<ボタンのonclick = "showImage（）">画像を取得</ button>の
<スクリプト> 関数showImage（）{ 
        のdocument.getElementById（ 'IMG1'）SRC = 'のhttp： // localhostを：8080 / downloadImage / 5dca4f1d911b52478896430e」; 
    } </ SCRIPT>