|
|
|
สอบถามเรื่อง Multiple array upload image drop zone ครับ |
|
|
|
|
|
|
|
ผมมี class upload
มันจะทำการอัพไม่ให้ชื่อซ้ำกันได้โดยใช้วิธีเพิ่ม _n ตัวเลขไปเรื่อยๆ เช่น aa.jpg ถ้ามีก็เป็น aa_1.jpg aa_2.jpg ไปเรื่อยๆ
https://github.com/Rundiz/upload
|
|
|
|
|
Date :
2021-01-22 17:58:03 |
By :
mr.v |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ตัวนี้เป็น Web API .NET Core 3.1 เป็นแค่ต้นแบบ ทำเอาไว้แต่ผมไม่ได้ใช้งานแล้ว
กรณีหลายฯรูปก็แค่ใส่ For เข้าไป
(ใช้ Node.js ก็เยี่ยมยอดเหมือนกันนะ มันสุดยอดเลยไอ้ Node.js)
Code (C#)
public partial class ConstructionController : ControllerBase
{
[HttpGet]
[Route("GetBOQ_WorkProcessImageFileExists")]
public async Task<IActionResult> GetBOQ_WorkProcessImageFileExists(string filename) {
var wpiPath = Utils.GetWorkingProcess_FileUploadPath();//.Replace(@"/", @"\");
var isExists = Utils.FileExists(wpiPath + filename);
await Task.Delay(0);
return Ok(isExists);
}
/// <summary>
/// Single Image Upload file.
/// </summary>
/// <returns></returns>
[HttpPost]
[Route("UploadWorkProcess_Image")]
public async Task<IActionResult> UploadWorkProcess_Image() {
ApiMessage results = new ApiMessage();
var httpPostedFile = HttpContext.Request.Form.Files["file"]; // IFormFile
var ProjectCode = HttpContext.Request.Form["projectcode"]; //
var Site_Code = HttpContext.Request.Form["site_code"]; //
var DigSeq = HttpContext.Request.Form["digseq"]; //
var FileName = HttpContext.Request.Form["filename"]; //
var FileType = HttpContext.Request.Form["filetype"]; //
var FileSize = HttpContext.Request.Form["filesize"]; //
var ImageSource = HttpContext.Request.Form["imagesource"]; //
var sp = Utils.GetWorkingProcess_FileUploadPath(); // wwwroot/imgSEX/workingprocess/
var fileName = Path.GetFileNameWithoutExtension(httpPostedFile.FileName);
var fileExtention = Path.GetExtension(httpPostedFile.FileName); // .jpg, .png, etc
var UniqFilName = DateTime.Now.ToString("yyyyMMddHHmmss"); //20201231083059 ระดับวินาที
if (httpPostedFile != null) {
try {
await httpPostedFile.SaveAsAsync(sp + fileName + UniqFilName + "f." + fileExtention ); // รูปต้นฉบับ
// Resize Image for Thumb
using (var stream = httpPostedFile.OpenReadStream()) {
using (var img = Image.FromStream(stream)) {
img.ScaleByHeight(150) // ขนาด 150 x 150
//.AddImageWatermark(sp + fname")
//.AddTextWatermark("http://PORNHUB.com") // ใส่ข้อความพื้นหลัง ลิขสิทธิ์
.SaveAs(sp + httpPostedFile.FileName); // รูปย่อ
}
}
// Write To Database hear.
BOQ_WorkProcessImage m = new BOQ_WorkProcessImage
{
ProjectCode = "", // รหัสโครงการ
Site_Code = "", // รหัส RIG
DigSeq = 99, // ต้นที่
};
results.IsSuccess = false;
results.SuccessMessage = "Success";
}
catch (Exception ex) {
results.IsSuccess = false;
results.ErrorMessage = ex.Message;
throw;
}
}
return Ok(results);
}
//private int Add(string? number) {
// string? aha = null;
// aha = aha?.ToString() + "Hi";
// return 1;
//}
}
|
|
|
|
|
Date :
2021-01-23 11:24:33 |
By :
ผ่านมา |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ตอนนี้แก้ไขได้เรียบร้อยครับ ขอบคุณทุกท่านครับ
Vuejs
<vue-dropzone
:options="dropzoneOptions"
:useCustomSlot="true"
v-on:vdropzone-success-multiple="dropzoneSuccess" // แก้ไขให้เป็น multiple
ref="myVueDropzone"
id="dropzone"
class="dropzone"
>
</vue-dropzone>
<script>
dropzoneOptions: {
maxFilesize: 2,
acceptedFiles: '.jpg,.jpeg',
previewsContainer: false,
uploadMultiple: true, // multiple file
parallelUploads: 100, // limit request
url: '/api/admin/facilities/uploadimages',
headers: {
'Authorization': 'Bearer ' + localStorage.getItem('adminToken'),
},
},
</script>
Laravel Controller
public function uploadImages(Request $request)
{
$files = $request->file('file');
$url = array();
foreach ($files as $key => $file) {
$type = $file->getClientOriginalExtension();
if ($type === 'jpg' || $type === 'jpeg') {
$rename = $key.'-'.date('YmdHis').'.jpg';
$description = 'facilities/'.$rename;
$image = Image::make($file)->fit(600, 360);
Storage::disk('public')->put($description,$image->stream('jpg',100));
array_push($url,Storage::url($description));
}
}
return response()->json(['url' => $url]);
}
|
ประวัติการแก้ไข 2021-01-24 10:36:07 2021-01-24 10:36:34
|
|
|
|
Date :
2021-01-24 10:35:20 |
By :
Genesis™ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 04
|