2017-09-09 14 views
1

アップロード画像ファイルと、残りAPIに

import { Component } from '@angular/core'; 
 
import { Http, RequestOptions, Headers, Response } from '@angular/http'; 
 
import { Observable } from 'rxjs/Rx'; 
 
@Component({ 
 
selector: 'my-app', 
 
templateUrl: './app/app.component.html', 
 
styleUrls: ['./app/styles/styles.css'] 
 
}) 
 
export class AppComponent { 
 
private isUploadBtn: boolean = true; 
 
constructor(private http: Http) { 
 
} 
 
//file upload event 
 
fileChange(event) { 
 
debugger; 
 
let fileList: FileList = event.target.files; 
 
if (fileList.length > 0) { 
 
let file: File = fileList[0]; 
 
let formData: FormData = new FormData(); 
 
formData.append('uploadFile', file, file.name); 
 
let headers = new Headers() 
 
headers.append('Content-Type', 'json'); 
 
headers.append('Accept', 'application/json'); 
 
let options = new RequestOptions({ headers: headers }); 
 
let apiUrl1 = "/api/UploadFileApi"; 
 
this.http.post(apiUrl1, formData, options) 
 
.map(res => res.json()) 
 
.catch(error => Observable.throw(error)) 
 
.subscribe( 
 
data => console.log('success'), 
 
error => console.log(error) 
 
) 
 
} 
 
window.location.reload(); 
 
} 
 
}
<div class="fileUpload btn btn-primary" *ngIf="isUploadBtn"> 
 
<span>Upload</span> 
 
<input type="file" id="btnUpload" value="Upload" (change)="fileChange($event)" class="upload" /> 
 
</div>

を送って、私はジャンゴREST APIによって対処されており、コードの上に実装しました。しかし、サポートされていないメディアタイプ... 415のステータスコードが表示されます。

私はPOSTMANで同じリクエストを送信している場合は受け付けます。 \ -H 'キャッシュ制御:キャッシュなし' \ -Hのコンテンツ・タイプ:マルチパート/フォーム - : ポストマンカールコマンドは

curl -X POST \ 

http://192.168.1.223:8010/profilepic/ \ -H '基本OTc5Nzk3OTc5NzoxMjM =承認' ですデータ;境界= ---- WebKitFormBoundary7MA4YWxkTrZu0gW」\ -H '郵便配達トークン:0e6c2353-5a24-2223-d4f3-b8d74c334a3d' \ -F [email protected]/home/ashwini/Pictures/step4.png

マイカールコマンドは

curl 'http://192.168.1.223:8010/profilepic/' -H 'Origin: http://192.168.1.144:4200' -H 'Accept-Encoding: gzip, deflate' -H 'Accept-Language: en-GB,en-US;q=0.8,en;q=0.6' -H 'User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36' -H 'Content-Type: multipart/form-data; boundary=AaB03x' -H 'Accept: application/json, text/plain, */*' -H 'Referer: http://192.168.1.144:4200/' -H 'Connection: keep-alive' --data-binary '[email protected]/home/ashwini/Pictures/step4.png' --compressed 

答えて

0

あなたのコンテンツタイプは、あなたが持っているJSコールと異なります。

+0

上記のcurl commands..1stは受け入れられ、2番目は受け入れられません。 –

+1

最初のcurlコマンドにはauthヘッダーがありますが、2番目のコマンドはありません。最初のものには-Fスイッチがありますが、2番目のものはありません。これは、フォームを最初のものではなく2番目のものでエミュレートしていることを意味します。私はそれが問題だとは思っていませんが、調べるべきことです。 – evenflow58

関連する問題