美图秀秀头像插件与七牛云结合
生活随笔
收集整理的這篇文章主要介紹了
美图秀秀头像插件与七牛云结合
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
美圖API說明文檔,非常好用,
**下載crossdomain.xml文件,把解壓出來的crossdomain.xml文件放在您保存圖片或圖片來源的服務器根目錄下,
比如: http://example.com.cn,那么crossdomain.xml的路徑為:http://example.com.cn/crossdomain.xml。
需要注意的是crossdomain.xml必須部署于站點根目錄下才有效, crossdomain.xml的目的是授權來自美圖域下的flash向您的站點上傳圖片或者從您的站點加載圖片。
【備注】由于本地測試會被flash安全沙箱攔住,請自行搭建web服務器,在web 環境中測試。**
如果想要從七牛讀取圖片,需要在使用的空間中上傳一份crossdomain.xml
美圖官文檔非常清晰易懂,良心之作。
<script src="http://open.web.meitu.com/sources/xiuxiu.js" type="text/javascript"></script><script type="text/javascript">var uptoken = $("input[name=token]").val();console.log(uptoken);window.onload=function(){/*第1個參數是加載編輯器div容器,第2個參數是編輯器類型,第3個參數是div容器寬,第4個參數是div容器高*/xiuxiu.embedSWF("altContent",5,"100%","100%");//修改為您自己的圖片上傳接口xiuxiu.setUploadURL("http://up.qiniu.com");xiuxiu.setUploadArgs({token:uptoken});xiuxiu.setUploadType(2);xiuxiu.setUploadDataFieldName("file");xiuxiu.onInit = function (){xiuxiu.loadPhoto("<{$pager.img}><{$MEMBER.face}>");//修改為要處理的圖片url}xiuxiu.onUploadResponse = function (data) {console.log(JSON.parse(data).key);$.ajax({url: "<{link ctl='ucenter/member:upload'}>",type: 'POST',data: {'uid': "<{$MEMBER.uid}>",'data[img]': JSON.parse(data).key,},success:function(response,status,xhr) {alert('上傳成功');}});}}</script><div id="altContent"></div>總結
以上是生活随笔為你收集整理的美图秀秀头像插件与七牛云结合的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 高德地图计算两坐标之间距离
- 下一篇: 视觉无人机进行高速公路违章检测—高速公路