봄 부팅에서 각도 4의 파일을 올리시겠습니까?

나는 다음과 같이 API는 (봄 부팅에서) 파일을 업로드 요청을 처리해야 : 아래 봄 부팅에서 각도 4의 파일을 올리시겠습니까?

@PostMapping("/api/admin/product/{id}/upload") 
public ResponseEntity<Product> postUpload(@PathVariable("id") Integer id, @RequestParam("image") MultipartFile imageFile) { 
    Product product = productService.findOne(id); 
    return new ResponseEntity<>(productService.upload(product, imageFile),HttpStatus.OK); 
}

내 요청을 처리 할 수있는 서비스입니다. 위의 API에 맞게 어떻게 수정해야합니까?

@Injectable() 
 
export class ProductServiceService { 
 
    private baseUrl = 'http://localhost:8080/api/admin/product'; 
 
    private headers = new Headers({'Content-Type' : 'multipart/form-data', 'Access-Control-Allow-Origin' : '*'}); 
 
    private options = new RequestOptions({headers: this.headers}); 
 
    constructor(private _http: Http) { } 
 
    postUpload(id) { 
 
    const formdata: FormData = new FormData(); 
 
formdata.append('image', image); 
 
return this._http.post(this.baseUrl + '/' + id + '/upload', formdata, this.options) 
 
      .map((res: Response) => res.json()) 
 
      .catch(this.errorHandler); 
 
    } 
 
    errorHandler(error: Response) { 
 
    return Observable.throw(error || 'SERVER ERROR'); 
 
    } 
 
}

그리고 이것은 오류가 후

감사를 구축입니다! 당신이 공유하는 코드를 기반으로 내 관찰의 거의

출처

2017-11-05 Hồ Mạnh Lực

** 서버 **는 CORS를 사용하도록 설정해야합니다 (따라서 ** 응답 **에서 Access-Control-Allow-Origin 헤더를 설정해야합니다). https://docs.spring.io/spring-boot/docs/1.5.8.RELEASE/reference/htmlsingle/#boot-features-cors를 읽어보십시오. 또는 CORS가 필요하지 않은 스프링 부트 서버에서 각도 응용 프로그램을 제공하십시오. –

서버 및 각도 앱에서 CORS를 사용하도록 설정했습니다. 그러나 여전히 작동하지 않습니다! –

콘솔에 오류가 있으면 다음과 같이 표시됩니다. 그래서 당신이하지 않았거나 당신이 그것을 잘못했다. –

private headers = new Headers({'Content-Type' : 'application/json'});. 이것은 잘못된 콘텐츠 유형은 multipart/form-data
this._http.get을해야합니다 -이 POST
파일이 내가 당신에게 정확한 답을 줄 각도에 익숙하지 않은 오전 image 요청 PARAM

으로 연결해야해야한다.

업데이트 :

클라이언트 응용 프로그램이 당신이 당신의 각도 JS 응용 프로그램에 Zuul 프록시를 실행하고 http://localhost:8080/api에 /api URL을 매핑 할 수있는 또 다른 봄 부팅 응용 프로그램 인 경우. @EnableZuulProxy *이 속성에 다음을 추가로 Zuul 프록시 구성 클래스를 주석 * 당신의 치어 에 spring-cloud-starter-zuul에 의존성을 추가로 간단한 * 로 사용 : http://localhost:4200/api/admin/product/17/upload과를 : 클라이언트 응용 프로그램에서 그래서 zuul.routes.api.url http://localhost:8080/api

당신은 API를 호출 클라이언트 응용 프로그램 (Zuul 프록시 사용)은 http://localhost:8080/api/admin/product/17/upload을 서버에서 호출합니다.

출처

2017-11-05 15:37:22 MohamedSanaulla

코드를 다시 작성했지만 여전히 작동하지 않습니다. 수정 해 드리겠습니다. 감사합니다. 감사합니다. –

'{ 'Content-Type': 'multipart/form-data', 'Access-Control-Allow-Origin': '*'}'를'{ 'enctype': 'multipart/form' -data '}'. 그러나 귀하의 도움에 감사드립니다. –

봄 부팅에서 각도 4의 파일을 올리시겠습니까?

답변

관련 문제