SAE下整合头像上传插件

由于SAE条件限制，所有的读写权限就只有storage模块可以，因此一般的设置头像就需要做整改，以便满足SAE的限制。

下面首先是选择一款上传头像插件，鄙人到网上搜了一大把，最后还是选择了一款叫fullAvatarEditor的富头像上传插件，

从官网下载代码包：

将如下图所示的js和swf文件放置到JS目录下面：

然后就是与swf交互的通知XML文件放置到站点根目录下：

引入的文件已经完成了，下面就是在设置头像页面加载对应的插件以及做对应的配置：

代码如下：

<script type="text/javascript" src="/Public/js/swfobject.js"></script>
<script type="text/javascript" src="/Public/js/fullAvatarEditor.js"></script>
<script type="text/javascript">
swfobject.addDomLoadEvent(function () {
    var swf = new fullAvatarEditor("swfContainer", {
            id: 'swf',
            upload_url: '/sns/doPhotoUpload/',
            src_upload:2,
            avatar_sizes : '220*220',			//定义单个头像
            avatar_sizes_desc :'220*220像素',	//头像尺寸的提示文本。
            checkbox_visible : false			//不显示复选框，外部自定义
            }, function (msg) {
                switch(msg.code)
                {
//                        case 1 : alert("页面成功加载了组件！");break;
//                        case 2 : alert("已成功加载默认指定的图片到编辑面板。");break;
                        case 3 :
                                if(msg.type == 0)
                                {
                                        alert("摄像头已准备就绪且用户已允许使用。");
                                }
                                else if(msg.type == 1)
                                {
                                        alert("摄像头已准备就绪但用户未允许使用！");
                                }
                                else
                                {
                                        alert("摄像头被占用！");
                                }
                        break;
                        case 5 : 
                                window.location.reload();
                        break;
                }
            }
        );
        document.getElementById("upload").οnclick=function(){
            swf.call("upload");
        };
    });
</script>
<script type="text/javascript">
$(function(){
    $("#navigation > ul > li:eq(0) > a").css({'background-color':'#212933'});
});
function updateavatar() {
	window.location.reload();
}
</script>

<div id="userpicture_main_centre">  
    	<div class="userPicture_nav">
         	<ul>
            	<li class="my_header" title="我的头像"><a href="">我的头像</a></li>
<!--                <li class="my_privacy" title="隐私筛选"><a href="">隐私筛选</a></li>-->
            </ul>
        </div>    
    <div id="userpicture_text">
   		<span class="picture_style">当前我的头像</span><br />
        <span class="my_head_tips_style">如果您还没有设置自己的头像，系统会显示为默认头像，您需要自己上传一张新照片来作为自己的个人头像。</span>     
        <div id="userpicture_bg"><img src="{$picture}" /></div>
        <span class="picture_style">设置我的新头像</span><br />
        <span class="my_head_tips_style">提示：头像保存后，您可能需要刷新一下本页面(按F5键)，才能查看最新的头像效果。</span>
        <div style="margin-bottom:20px;">
            <p id="swfContainer"></p>
        </div>
    </div>
    </div>
    <div style="clear:both;"></div>
 </div>

下面是上传的后台代码：

/**
     * @todo do upload photo
     */
    public function doPhotoUpload(){
        $this->isMemberLogin();
        $nickname = session('member_user');
        $mcmember = new McMemberModel();
        $memberinfo = $mcmember ->getMemberInfoByNickname($nickname);
        $storage = new SaeStorage();
        $domain = 'public';
        $type = null;
        switch ($_FILES['__avatar1']['type']){
            case 'image/jpeg':
                $type = 'jpg';
                break;
            case "image/gif":
                $type = 'gif';
                break;
            case "image/png":
                $type = 'png';
                break; 
            default :
                $type = 'jpg';
                break;
        }
        $destFileName = $memberinfo[0]['id'].'-avatar.'.$type;
        $srcFileName = $_FILES['__avatar1']['tmp_name'];
        $result = $storage->upload($domain,$destFileName, $srcFileName);
        $data['userico'] = $result;
        $mcmember ->updateMemberInfo($nickname, $data);
        $return['code']=5;
        echo json_encode($return);
    }

以上仅供参考，大家可以自己去进行优化！