upload file

อัปโหลดไฟล์

ใช้องค์ประกอบการอัปโหลดองค์ประกอบเพื่ออัปโหลดรูปภาพไปยังคลาวด์ Qi Niu

ข้อกำหนดด้านวิศวกรรม

1. Vue2.4 + Express4.14 + ES6
2. เวอร์ชันโหนดอยู่เหนือ 4.0 (ขอแนะนำให้ใช้ NVM เพื่อจัดการเวอร์ชันโหนด)
3. รูปแบบรหัสตรวจสอบ StandardJS

การพึ่งพาวิศวกรรม

1. Qiniu
2. Element-ui

การพึ่งพาการติดตั้ง

npm install

เริ่มโครงการ

1. พอร์ตวิศวกรรม 8080
2. เริ่มโหมดฟิวชั่น

npm start

หมายเหตุ: เริ่มต้นในโหมดนี้เพื่ออัปโหลดไฟล์

3. การเริ่มต้นโหมด Nodemon

npm run nodemon

กระบวนการ

1. คีย์สาธารณะการกำหนดค่าด้านหลังรหัสส่วนตัวและชื่อพื้นที่เก็บข้อมูล
2. กลยุทธ์การอัปโหลดอัปโหลดย้อนกลับใช้เพื่อสร้าง uploadtoken
3. ย้อนกลับ
4. โทรไปที่ Back -end API เพื่อรับ UploadToken ก่อนอัปโหลดไฟล์
5. อัปโหลดรูปภาพที่ปลายด้านหน้ารับที่อยู่รูปภาพที่ส่งคืนโดย Qi Niu

วัวเจ็ดตัว

1. ไฟล์ตรง
2. อัปโหลดบัตรกำนัล
3. node.js sdk

ปลายด้านหลัง

1. รหัส

   หมายเหตุ: ก่อนที่จะเริ่มโครงการให้แทนที่พารามิเตอร์ก่อนเช่น AccessKey, SecretKey, BucketName และพารามิเตอร์อื่น ๆ ไปยังพารามิเตอร์ที่สอดคล้องกันที่จัดทำโดย Qiniu สำหรับคุณ

2. วิธีการขออินเตอร์เฟส

 # request url
curl --request GET 
     --url ' http://localhost:8080/api/upload?fileName=123.png '

# body
{
    " code " : " 1 " ,
    " desc " : " ok " ,
    " result " : {
        " bucketName " : " bucket-name " ,
        " fileName " : " f90bad3c937d1dcdfc37.png " ,
        " uploadToken " : " JjO_ih1JuNJAKDT-cr5T10TSuBGyJf1 "
    }
}

ส่วนหน้า

1. รหัส

   หมายเหตุ: เอกสารเฉพาะอ้างอิงถึงการอัปโหลด Element-UI