// In order to use the MinIO JavaScript API to generate the pre-signed URL, begin by instantiating
// a `Minio.Client` object and pass in the values for your server.
// The example below uses values for play.min.io:9000
constMinio=require('minio')varclient=newMinio.Client({endPoint:'play.min.io',port:9000,useSSL:true,accessKey:'Q3AM3UQ867SPQQA43P2F',secretKey:'zuf+tfteSlswRu7BJ86wekitnifILbZam1KYY3TG'})// Instantiate an `express` server and expose an endpoint called `/presignedUrl` as a `GET` request that
// accepts a filename through a query parameter called `name`. For the implementation of this endpoint,
// invoke [`presignedPutObject`](https://github.com/minio/minio-js/blob/master/docs/zh_CN/API.md#presignedputobjectbucketname-objectname-expiry-callback)
// on the `Minio.Client` instance to generate a pre-signed URL, and return that URL in the response:
// express is a small HTTP server wrapper, but this works with any HTTP server
constserver=require('express')()server.get('/presignedUrl',(req,res)=>{client.presignedPutObject('uploads',req.query.name,(err,url)=>{if(err)throwerrres.end(url)})})server.get('/',(req,res)=>{res.sendFile(__dirname+'/index.html');})server.listen(8080)
2. 创建客户端 Web 应用
客户端 Web 应用的用户界面包含一个选择器字段,允许用户选择要上传的文件,以及一个用于触发名为 upload 的 onclick 处理函数的按钮:
<inputtype="file"id="selector"multiple><buttononclick="upload()">Upload</button><divid="status">No uploads</div><scripttype="text/javascript">// `upload` iterates through all files selected and invokes a helper function called `retrieveNewURL`.
functionupload(){// Get selected files from the input element.
varfiles=document.querySelector("#selector").files;for(vari=0;i<files.length;i++){varfile=files[i];// Retrieve a URL from our server.
retrieveNewURL(file,(file,url)=>{// Upload the file to the server.
uploadFile(file,url);});}}// `retrieveNewURL` accepts the name of the current file and invokes the `/presignedUrl` endpoint to
// generate a pre-signed URL for use in uploading that file:
functionretrieveNewURL(file,cb){fetch(`/presignedUrl?name=${file.name}`).then((response)=>{response.text().then((url)=>{cb(file,url);});}).catch((e)=>{console.error(e);});}// ``uploadFile` accepts the current filename and the pre-signed URL. It then uses `Fetch API`
// to upload this file to S3 at `play.min.io:9000` using the URL:
functionuploadFile(file,url){if(document.querySelector('#status').innerText==='No uploads'){document.querySelector('#status').innerHTML='';}fetch(url,{method:'PUT',body:file}).then(()=>{// If multiple files are uploaded, append upload status on the next line.
document.querySelector('#status').innerHTML+=`<br>Uploaded ${file.name}.`;}).catch((e)=>{console.error(e);});}</script>