php tp5上传图片到阿里云OSS
生活随笔
收集整理的這篇文章主要介紹了
php tp5上传图片到阿里云OSS
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
1.登錄阿里云OSS管理控制臺(tái)創(chuàng)建Bucket
(寫(xiě)入名稱,這個(gè)我已經(jīng)創(chuàng)建過(guò)了,我接下來(lái)會(huì)用到,注意Endpoint,后面會(huì)用到)
為了方便管理圖片,可以在Bucket多建目錄進(jìn)行存放:
2.在tp5的config中做以下配置
AccessKey ID和 Access Key Secret可以在這里查看
3.到阿里云對(duì)象存儲(chǔ)OSS官網(wǎng)文檔,下載PHP的demo,下載后解壓重命名文件夾為aliyun-oss,我放到了tp5的extend目錄下面:
4.我定義了一個(gè)Common類,里面有上傳圖片的方法
5.前臺(tái)
<div class="layui-upload" id="upload-thumb"><label class="layui-form-label">縮略圖</label><button type="button" class="layui-btn" id="thumb">上傳圖片</button><div class="layui-upload-list"><label class="layui-form-label"></label><img class="layui-upload-img" id="demo1" width="150" height="150" {notempty name="$article.thumb"}src="{$article.thumb}"{/notempty}>{notempty name="$article.thumb"}<input type="hidden" name="thumb" value="{$article.thumb}">{/notempty}<p id="demoText"></p></div> </div> //上傳圖片接口layui.use('upload', function(){var upload = layui.upload;//執(zhí)行實(shí)例var uploadInst = upload.render({elem: '#thumb' //綁定元素,url: "{:url('common/uploadtest')}" //上傳接口,data:{use:'article_thumb'},done: function(res){//上傳完畢回調(diào)if(res.code == 200) {//前臺(tái)顯示預(yù)覽圖$('#demo1').attr('src',res.data);$('#upload-thumb').append('<input type="hidden" name="thumb" value="'+ res.data +'">');} else {layer.msg(res.msg);}},error: function(){//請(qǐng)求異?;卣{(diào)//演示失敗狀態(tài),并實(shí)現(xiàn)重傳var demoText = $('#demoText');demoText.html('<span style="color: #FF5722;">上傳失敗</span> <a class="layui-btn layui-btn-mini demo-reload">重試</a>');demoText.find('.demo-reload').on('click', function(){uploadInst.upload();});}});});總結(jié)
以上是生活随笔為你收集整理的php tp5上传图片到阿里云OSS的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 用Ubuntu编写第一个C程序并预处理、
- 下一篇: thinkphp5+阿里短信发送验证码