我正在尝试通过ajax上传包含文件的表单,但是在服务器端,我只是得到了我无法使用的纯文本。
如果我使用processData:false,contentType:false和cache:false,则会发生这种情况,如果我不使用它们,则文件不会上传。
JavaScript:
$("#purchase-attachment-form").on('submit', function (e) {
if ($('#paf_input').get(0).files.length === 0) {
alert('Please Select A file');
return;
}
e.preventDefault();
$.ajax({
url: "{{route('add_attachment_to_purchase')}}",
data: new FormData($("#purchase-attachment-form")[0]),
type: 'post',
processData: false,
cache: false,
success: function (data) {
alerts(data, 'Adding Purchase Attachment');
},
error: function (jqXHR, textStatus, errorThrown) {
alerts(2, "Adding Purchase Attachment");
}
});
});
HTML:
<form id="purchase-attachment-form" class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="defaultModalLabel">Add Attachment</h4>
</div>
<div class="modal-body">
<div class="row clearfix">
<div class="col-lg-6">
<div class="form-group">
<label>Type</label>
<div class="form-line">
<select class="form-control select" name="type">
<option value="quotation">Quotation</option>
<option value="conparison">Comparison</option>
<option value="invoice">Invoice</option>
<option value="payment_offer">Payment Offer</option>
</select>
<input type="hidden" name="purchase" id="purchase_on_attachment" value="{{encrypt($purchase->id)}}"class="form-control" />
</div>
</div>
</div>
@csrf
<div class="col-lg-6">
<div class="form-group">
<input type="file" class="hidden" id="paf_input" name="attachment" required />
<button type="button" id="paf_btn" onclick="$('#paf_input').trigger('click');" class="material-icons waves-effect btn btn-circle">add</button>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary waves-effect">Add</button>
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">CLOSE</button>
</div>
</form>
控制器:
public function create(Request $request) {
// return $request->all();
// return $request->getContent();
$this->validate($request, [
'type' => 'required',
'purchase' => 'required',
'attachment' => 'required',
]);
$role = \App\Role::where('role', strtoupper(auth()->getDefaultDriver()))->first();
if ($role == null) {
return '2';
}
$role_id = $role->id;
$time = time();
if ($request->hasFile('attachment')) {
$attachment = $request->file('attachment');
$att_file_name = $attachment->getClientOriginalName();
$att_file = ($time++) . $att_file_name;
$att_file_saved = $request->attachment->storeAs('public/purchase/attachments/', $att_file);
}
$pa = new Purchase_Attachment();
$pa->type = $request->type;
$pa->purcahse_id = decrypt($request->purcahse);
$pa->user_id = auth()->user()->id;
$pa->role_id = $role_id;
$pa->address = $att_file;
$pa->save();
return redirect(route('view_purchase_view', ['prid' => $request->purcahse]));
}
我无法通过在服务器端指定输入名称来获取任何数据。 通过返回$ request-> getContent()在服务器端获取数据:
------WebKitFormBoundaryhtJyrJXT3BFCCQHF
Content-Disposition: form-data; name="type"
quotation
------WebKitFormBoundaryhtJyrJXT3BFCCQHF
Content-Disposition: form-data; name="purchase"
eyJpdiI6IktVUHh4ZmE1d3VGa3lhV0JZUDdtRkE9PSIsInZhbHVlIjoiRDQ3Zmt6N2VwODhpamN6VVpGUHhCdz09IiwibWFjIjoiNWE3ZTViOTgwOGQxNmI3MGU1ZTdmZTE3MDZmN2FhZTYxYTMzNzY1NjA3NzliMDQwNjJlY2QzNDg3OGVjMDk4ZSJ9
------WebKitFormBoundaryhtJyrJXT3BFCCQHF
Content-Disposition: form-data; name="_token"
YMTaQStR84KBEXuocHKoiDj6dqlpzdUju9MUAbtq
------WebKitFormBoundaryhtJyrJXT3BFCCQHF
Content-Disposition: form-data; name="attachment"; filename="safe_image.jpg"
Content-Type: image/jpeg
Some Binary Data Here, Stakoverflow denied uploading
答案 0 :(得分:0)
您是否尝试过创建像这样的变量:
let x = new FormData();
x.append("name_file", data);
在ajax调用中
{
...
data: x,
processData: false,
contentType: false,
type: 'POST',
...
}
以及后端,在您的Controller中:
public myFunction(Request $request){
$file = $request->file("name_file");
}
在这篇文章中,您可以找到一个示例如何使用JQuery发送数据: