0
Angular2、TypeScriptを使用してファイルをJSONデータとともにサーバーに送信しています。角度2のファイルをアップロードしてダウンロードしますか？
HTMLコード
<input type="file" class="form-control" name="avatar" id="uploadyour" name="uploadyour" #uploadyour="ngModel" [(ngModel)]="model.uploadyour"
(change)="fileChange($event)" placeholder="Upload file" accept=".pdf,.doc,.docx" >
app.component.ts。
import { Http, Headers, Response, Request, RequestMethod, URLSearchParams, RequestOptions } from "@angular/http";
import * as FileSaver from "file-saver";
import {Observable} from 'rxjs/Rx';
import { Injectable } from '@angular/core';
fileChange(event) {
let fileList: FileList = event.target.files;
if(fileList.length > 0) {
let file: File = fileList[0];
let formData:FormData = new FormData();
console.log(file);
formData.append('uploadFile', file, file.name);
let headers = new Headers();
headers.append('enctype', 'multipart/form-data');
headers.append('Accept', 'application/json');
console.log(headers);
let options = new RequestOptions({ headers: headers });
console.log(formData);
this.http.post("http://localhost:1337/trackstatus/upload", formData, options)
.map(res => res.json())
.catch(error => Observable.throw(error))
.subscribe(
data => console.log('success'),
error => console.log(error)
)
}
}
controller.js
upload: function (req, res) {
req.file('avatar').upload(function (err, files) {
if (err)
return res.serverError(err);
return res.json({
message: files.length + ' file(s) uploaded successfully!',
files: files
});
});
},
以下のエラーが発生しています。
XMLHttpRequestはhttp://localhost:1337/trackstatus/uploadをロードできません。要求ヘッダーフィールドenctypeは、プリフライト応答でAccess-Control-Allow-Headersによって許可されていません。
の可能性のある重複した[原点はアクセス制御 - 許可 - 起源によって許可されていません] （http://stackoverflow.com/questions/10143093/origin-is-not-allowed-by-access-control-allow-origin） –
ここでapp.componentに「Access-Control-Allow-Origin」を追加したい.tsまたはcontroller.js。 – phani