Discussion :

[keokaz]

Bonjour,

j'ai une requête sous angular qui demande d'uploader un fichier, une fois télécharger je souhaite que spring boot retourn un résultat 200 en cas de success et le nom du fichier qui aura été hashé.

voici mon front end:

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
  onSubmit() {
      const formData = new FormData();
      formData.append('file', this.fileData);
      this.http.post("http://localhost:8181/upload", formData)
        .subscribe(res => {
 
        }) 
  }

voici spring boot

Code java :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
	@RequestMapping(value = "/upload", method = RequestMethod.POST)
 
	public int FileUpload(@RequestParam("fichier") MultipartFile file) {
		try {
 
			// Get the file and save it somewhere
			byte[] bytes = file.getBytes();
			Path path = Paths.get(UPLOADED_FOLDER + file.getOriginalFilename());
			Files.write(path, bytes);
			System.out.println(this.getMd5(this.UPLOADED_FOLDER+file.getOriginalFilename())+"*****");
			this.getHashFile();
 
		} catch (IOException e) {
			e.printStackTrace();
		}
			return 200;
 
	}

Pour le moment la réponse de ma requête est bien 200, mais comment je dois correctement envoyé la réponse http et le nom de mon fichier hashé?

merci de vos réponse

[andry.aime]

Bonjour,

Utilise ResponseEntity, genre:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
public ResponseEntity<String> FileUpload(@RequestParam("fichier") MultipartFile file){
ResponseEntity<String> responseEntity = null;
try {
 
			// Get the file and save it somewhere
			byte[] bytes = file.getBytes();
			Path path = Paths.get(UPLOADED_FOLDER + file.getOriginalFilename());
			Files.write(path, bytes);
			System.out.println(this.getMd5(this.UPLOADED_FOLDER+file.getOriginalFilename())+"*****");
			responseEntity = new ResponseEntity<String>(this.getHashFile(), HttpStatus.OK);
		} catch (IOException e) {
			e.printStackTrace();
			responseEntity =  new ResponseEntity<String>("Erreur", HttpStatus.INTERNAL_SERVER_ERROR);
		}
return responseEntity;
}

Après, évite les print dans ton code, utilise un log.

A+.

[keokaz]

merci andry ,

voici ce que j'ai essayé:

Code java :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
 
@RestController
public class TeleverserService {
 
	private static String UPLOADED_FOLDER = "C:/Users/aker/Desktop/upload/";
	private String fichierHash;
	ResponseEntity<String> responseEntity = null;
 
	@GetMapping("/hello")
	ResponseEntity<String> hello() {
		return new ResponseEntity<>("Hello World!", HttpStatus.OK);
	}
 
	@RequestMapping(value = "/upload", method = RequestMethod.POST)
 
	public  ResponseEntity<String> FileUpload(@RequestParam("fichier") MultipartFile file) {
		try {
 
			// Get the file and save it somewhere
			byte[] bytes = file.getBytes();
			Path path = Paths.get(UPLOADED_FOLDER + file.getOriginalFilename());
			Files.write(path, bytes);
			this.fichierHash =this.getMd5(this.UPLOADED_FOLDER+file.getOriginalFilename());
 
		}catch (IOException e) {
			e.printStackTrace();
			responseEntity =  new ResponseEntity<String>("Erreur", HttpStatus.INTERNAL_SERVER_ERROR);
		}
		return this.responseEntity;
 
	}

(quand tu me dit d'utiliser les log, c'est des console log dans le front-end ou les log coté java ?)

je redonne mon front angular:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
 onUpload(){
    console.log("onUload .....");
    console.log(this.selectedFile);
 
    const fd = new FormData();
    fd.append('fichier',this.selectedFile,this.selectedFile.name);
    console.log("resultat FD ====>");
    console.log(fd);
    this.http.post("http://localhost:8181/upload/",fd).subscribe(
      res => {
        console.log("retour http ...");
      }
    );
 
  }

je ne reçois rien du tout:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
File*{name: "ubonheur-26-36v-500w-kit-de-velo-electrique-roue.jpg", lastModified: 1564547795499, lastModifiedDate: Wed Jul 31 2019 06:36:35 GMT+0200 (heure d’été d’Europe centrale), webkitRelativePath: "", size: 110735,*…}
connexion.component.ts:31 resultat FD ====>
connexion.component.ts:32 FormData*{}
connexion.component.ts:35 retour http ...

sinon j'ai tenté de faire un test tout simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
	@GetMapping("/hello")
	ResponseEntity<String> hello() {
		return new ResponseEntity<>("Hello World!", HttpStatus.OK);
	}

avec angular:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
        this.http.get("http://localhost:8181/hello").subscribe(data=>{
          console.log(data);
        });

j'ai bien une réponse, mais le retour n'est pas accepté:

[andry.aime]

voici ce que j'ai essayé:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
 
@RestController
public class TeleverserService {
 
	private static String UPLOADED_FOLDER = "C:/Users/aker/Desktop/upload/";
	private String fichierHash;
	ResponseEntity<String> responseEntity = null;
 
	@GetMapping("/hello")
	ResponseEntity<String> hello() {
		return new ResponseEntity<>("Hello World!", HttpStatus.OK);
	}
 
	@RequestMapping(value = "/upload", method = RequestMethod.POST)
 
	public  ResponseEntity<String> FileUpload(@RequestParam("fichier") MultipartFile file) {
		try {
 
			// Get the file and save it somewhere
			byte[] bytes = file.getBytes();
			Path path = Paths.get(UPLOADED_FOLDER + file.getOriginalFilename());
			Files.write(path, bytes);
			this.fichierHash =this.getMd5(this.UPLOADED_FOLDER+file.getOriginalFilename());
 
		}catch (IOException e) {
			e.printStackTrace();
			responseEntity =  new ResponseEntity<String>("Erreur", HttpStatus.INTERNAL_SERVER_ERROR);
		}
		return this.responseEntity;
 
	}

Mais regarde bien ce que j'ai mis dans mon code.

(quand tu me dit d'utiliser les log, c'est des console log dans le front-end ou les log coté java ?)

Tu vois bien que tu utilises déjà log dans ton js, et où est ce qu'il y a print dans tes codes?

j'ai bien une réponse, mais le retour n'est pas accepté:

C'est parce qu'angular s'attend que le serveur retourne un format JSON mais pas un simple String.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

this.http.post("http://localhost:8181/upload/",fd, {responseType: 'text'})

A+.

[keokaz]

merci de ton aide j'ai bien reçu le resultat
j'avais oublié de mettre ce que j'envois , mais je n'ai pas eu d'erreur de json ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 
@RestController
public class TeleverserService {
 
	private static String UPLOADED_FOLDER = "C:/Users/aker/Desktop/upload/";
	private String fichierHash;
	ResponseEntity<String> responseEntity = null;
 
	@GetMapping("/hello")
	ResponseEntity<String> hello() {
		return new ResponseEntity<>("Hello World!", HttpStatus.OK);
	}
 
	@RequestMapping(value = "/upload", method = RequestMethod.POST)
 
	public  ResponseEntity<String> FileUpload(@RequestParam("fichier") MultipartFile file) {
		try {
 
			// Get the file and save it somewhere
			byte[] bytes = file.getBytes();
			Path path = Paths.get(UPLOADED_FOLDER + file.getOriginalFilename());
			Files.write(path, bytes);
			this.fichierHash =this.getMd5(this.UPLOADED_FOLDER+file.getOriginalFilename());
 
		}catch (IOException e) {
			e.printStackTrace();
			responseEntity =  new ResponseEntity<String>("Erreur", HttpStatus.INTERNAL_SERVER_ERROR);
		}
		return new ResponseEntity<>(this.fichierHash, HttpStatus.OK);
 
	}

pour le log tu avais rajouté cela dans mon code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
			e.printStackTrace();
			responseEntity =  new ResponseEntity<String>("Erreur", HttpStatus.INTERNAL_SERVER_ERROR);

j'ai besoin de prinln afin de savoir ou est en est le boot car sinon je m'y perd vite ...

[andry.aime]

mais je n'ai pas eu d'erreur de json ...

Ce n'est pas ce que dit l'image que tu as posté, d'où la correction que j'ai donné.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
	private static String UPLOADED_FOLDER = "C:/Users/aker/Desktop/upload/";

Ce genre de variable se met dans une configuration.

pour le log tu avais rajouté cela dans mon code:

J'ai simplement ajouté une valeur de retour en cas d'erreur.

j'ai besoin de prinln afin de savoir ou est en est le boot car sinon je m'y perd vite ...

Les log sont faits pour ça: https://docs.spring.io/spring-boot/d...s-logging.html

A+.

[keokaz]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
mais je n'ai pas eu d'erreur de json ...

tu m'a donnée la bonne façon de le faire pour dire à angular de recevoir du texte

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
    this.http.post("http://localhost:8181/upload/",fd,{responseType: 'text'}).subscribe(
      res => {
        console.log("response"+res+"<==="); 
      }
    );

c'était vraiment simple, mais je n'ai pas pensé simplement cette erreur, mais je vais modifier cela en créant de la dao avec un modèle "fichier" et
de transmettre plutôt que du texte du json pour avoir le nom du vrai fichier, sa taille et son descriptif.

De lire dans un fichier un log il faut sans cesse aller le voir, d'ailleur j'ai pas préciser dans mon code , j'utilise commandeLInerunner pour obtenir
les retour de la console:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
@SpringBootApplication
public class KodCms implements CommandLineRunner {

en tout cas merci de ton aide , cela ma aidé à avancer .

[andry.aime]

De lire dans un fichier un log il faut sans cesse aller le voir, d'ailleur j'ai pas préciser dans mon code , j'utilise commandeLInerunner pour obtenir
les retour de la console:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
@SpringBootApplication
public class KodCms implements CommandLineRunner {

en tout cas merci de ton aide , cela ma aidé à avancer .

Ça ne t’empêche pas d'utiliser un fichier log, et la sortie dans ce log peut être visualisé directement dans la console de ton IDE. Un fichier log est très utile pour faciliter de tracer les utilisations, surtout les erreurs.

A+.

[andry.aime]

Après, à ce que je vois, ton application ne se lance pas, il n'arrive pas à trouver FichierRepository pour l'injecter dans TeleverserService. Apparemment, cette interface n'a pas été scanné par spring puisque ce n'est pas annoté correctement.