ali-oss

第一步：安装阿里云OSS <!-- 引入在线资源 --> <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-x.x.x.min.js"></script> <!-- 引入本地资源 --> <script src="./aliyun-oss-sdk-x.x.x.min.js"></script> 注意： x.x.x代表版本号，具体版本信息可在这 访问查看 引入在线资源方式依赖于CDN服务器的稳定性，推荐用户使用离线方式引入，即通过本地资源或自行构建的方式 也可使用npm安装SDK npm install ali-oss 第二步：安装完成后使用 可使用 import 或 require 进行引用。 region，accessKeyId,stsToken,bucket需要后端同事提供接口获取，其中region是阿里云所在区域，登录阿里云右上角能查看，例如“oss-cn-hangzhou”,bucket是阿里云仓库的名称 let OSS = require('ali-oss'); let client = new OSS({ region: '<oss region>', 　accessKeyId:'your accessKeyId', 　stsToken:'your stsToken', 　bucket:'your

博主在最近的工作中，接触到了使用thinkjs框架作为后台架构的网店后台Node服务，因为其使用的qiniu上传图片接口不符合需求，需要改为ali-oss接口，一路遇到不少坑，在此做一下记录总结。 首先是elementUI前端部分 上传至后台，需要将flie文件，转为 FormData 对象后传至后台，因使用的组件库为element，其upload的组件中， action 为必传（博主此项传空），同时将 auto-upload 传 false （意思为不自动上传），然后上传操作在 on-change 事件中完成，回调完毕后重显DOM。具体代码片段如下： < el - form - item label = "印花图片" prop = "url" v - if = "infoForm.url" class = "image-uploader-diy new-height" > < img v - if = "infoForm.url" : src = "infoForm.url" class = "image-show" / > < el - button class = "dele-list-pic" type = "primary" @click = "delePicList" > < i class = "fa fa-trash-o" > < / i > < / el -

安装AliOSS-storage composer require jacobcyl/ali-oss-storage:^2.1 在config/app.php 中providers数组增加代码 Jacobcyl\AliOSS\AliOssServiceProvider::class, 在config/filesystem.php 中disks数组中增加代码, 其中access_id, access_key参数都是到阿里云提供 'oss' => [ 'driver' => 'oss', 'access_id' => env('ALIYUN_ACCESS_KEY_ID'), 'access_key' => env('ALIYUN_ACCESS_KEY_SECRET'), 'bucket' => env('ALIYUN_OSS_BUCKET'), 'endpoint' => env('ALIYUN_OSS_ENDPOINT'), 'url' => env('ALIYUN_OSS_URL'), 'ssl' => false, 'isCName' => false, 'debug' => false, ], 设置默认驱动为oss 'default' => env('FILESYSTEM_DRIVER', 'oss'), 在config/admin.php中修改upload配置 'upload

1.封装上传和下载的方法 安装 ali-oss包 npm install ali-oss 新建 utils/oss.js: 然后在utils/oss.js写入代码: 1.导入ali-oss import OSS from 'ali-oss' 2.配置信息 const region = "oss-cn-shanghai" const accessKeyId = "xxxxx" const accessKeySecret = "xxxxx" const bucket = "xxxxx" import { Message } from 'element-ui'; let client = new OSS({ region : region, accessKeyId : accessKeyId, accessKeySecret : accessKeySecret, bucket : bucket }); 3.上传 const CooOss = function(file){ if(this instanceof CooOss){ let objectKey = file.lastModified+'_'+file.name; return new Promise((resolve,reject) => { client.multipartUpload(objectKey, file)