我尝试将文件上传到服务器时,最近出现了一个问题(我不知道发生了什么变化)。 使用所有其他GET和POST网站工作正常,但问题是我需要上传文件(我有一个特定的功能)。
我的网站是使用angularjs和Java Spring作为后端构建的。
这里有一个在工厂中用来上传文件的功能:
var SaveMethod = function(params, callback){
var result = $q.defer();
var form = new FormData();
var xhr = new XMLHttpRequest;
// Additional POST variables required by the API script
form.append("file", params.files);
xhr.upload.onprogress = callback;
xhr.open('POST', SessionService.apiUrl + '/video/save');
xhr.setRequestHeader("Authorization", 'Bearer ' + SessionService.getToken());
xhr.timeout = result.promise;
xhr.onload = function(e) {
if (xhr.status == 200) {
result.resolve(e.target.response);
}
else {
result.reject(xhr.statusText);
}
};
xhr.send(form);
return result.promise;
};
这是控制器:
$scope.upload = function(item) {
$scope.values.videosubmitted = true;
$scope.values.object.name = item.name.substr(0, item.name.lastIndexOf('.'));
$scope.values.uploading = true;
var params = {
files: item
};
VideoFactory.Save(params, callback).then(function(response){
response = JSON.parse(response);
$scope.values.uploading = false;
if (response.success) {
$scope.values.object.images = response.data.images;
$scope.values.object.code = response.data.code;
$scope.values.object.source = response.data.source;
$scope.values.object.preview = response.data.preview;
}
else
{
$scope.values.error = true;
$scope.values.errorMessage = response.code;
}
}, function(response){
if (response == null) {
$scope.values.error = true;
$scope.values.errorMessage = "ERROR__SERVER_NON_WORKING";
}
else
{
$scope.values.error = true;
$scope.values.errorMessage = response.code;
}
$scope.values.uploading = false;
});
}
视图(以防万一)
<div class="row" ng-show="!values.videosubmitted">
<div class="col-md-10 no-padding-right">
<div class="dropzone" id="dropbox" callback-fn="upload(video)" file-dropzone="[video/mp4, video/3gpp, video/quicktime, video/x-msvideo, video/x-ms-wmv]"
file="image" file-name="imageFileName" values-max-file-size="9000000000">
<span translate="MODULES.VIDEO.DROPVIDEO"></span>
</div>
</div>
<div class="col-md-2 upload-btn no-padding-left">
<label class="upload-search btn btn-primary no-padding">
<div>
<input type="file" onchange="angular.element(this).scope().upload(this.files[0])"/>
<i class="fa fa-upload"></i>
<span translate="COMMON.FILESEARCH"></span>
</div>
</label>
</div>
</div>
问题是,在将文件发送到服务器之后,如果我从服务器获得成功响应并不重要,则重新加载页面并取消请求。在某些情况下,我从服务器获得成功的响应,但之后重新加载页面,在其他情况下,请求被取消并刷新页面。
我试过了超时但它没有用。
答案 0 :(得分:0)
这个问题与CORS有关,我猜... 问题在于我使用两个域进行Web开发,localhost用于常规使用,以及一个特定域,用于在社交媒体页面中识别以允许登录按钮。 所以我发现当我使用localhsot时一切正常,但是当使用其他域时它不是。
这很奇怪,因为后端对请求做出了正确的回应。