JSFiddle - React, Tailwind, and code Playground

by nullice

HTML

<script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.js"></script>
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.js"></script>
<pre id="sc"></pre>

Babel + JSX

let token = getToken("/2018-111-demo" + new Date().getTime() + ".txt", "lanhu", "eVOKBBTrci4jk4rDiQlqzkfs2FU=")

sc.innerText ="token:"+ JSON.stringify(token,null,4)+"\n"

upOnce()

function upOnce(){
         sc.innerText += "\n 上传文件... \n"
        var formData = new FormData()
        formData.append("policy", token.policy)
        formData.append("signature", token.signature)
        formData.append("file", new Blob(["啊,我是文件内容,\n 柳汀斜对野人窗,零落衰条傍晓江。\n正是霜风飘断处,寒鸥惊起一双双。\n"], {type: "text/json"}))
        axios.post("https://v0.api.upyun.com/lanhu", formData).then(function(e){
         sc.innerText += "\n 上传完成 \n"
        		sc.innerText += "\n" +JSON.stringify(e,null,4)
            sc.innerText += "\n 下载地址:"  +"uppic.lanhuapp.com" +e.data.url
        })

}

function getToken (saveKey = "/text.json", bucket, apiKey)
{
   sc.innerText += "\n 生成 token... \n"
    var p = {
        bucket: bucket,
        "save-key": saveKey,
        expiration: Math.floor(new Date().getTime() / 1000) + 86400,
    }
    var Policy = BASE64(JSON.stringify(p))
    console.log("Policy", Policy)

    var signature = MD5(Policy + "&" + apiKey)
    console.log("signature", signature)

    return {
        signature,
        policy: Policy,
    }
}

function MD5 (value)
{
  
   // https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.js
    return md5(value)
}


function BASE64 (value)
{
    return  window.btoa(value);
}