wc之上传图片

wc上传图片：以上传头像为例

1.找到views/default/account/settings/profile.tpl.htm中

init_avatar_uploader($('#avatar_uploader'), $('#avatar_uploading_status'), $("#avatar_src"));//找到上传的三个控件

2.找到../static/js/functions.js文件中使用了jquery中的AjaxUpload方法

function init_img_uploader(upload_url, upload_name, upload_element, upload_status_elememt, perview_element)
{
    return new AjaxUpload(upload_element, {
        action: upload_url,//处理的图片上传的action,此处应该为:../app/account/ajax.php中的avatar_upload_action()
        name: upload_name,
        responseType: 'json',//数据格式为json

        onSubmit: function (file, ext) {//提交时做的验证以及页面变化
            if (!new RegExp('(png|jpe|jpg|jpeg|gif)$', 'i').test(ext))
            {
                alert('上传失败: 只支持 jpg、gif、png 格式的图片文件');

                return false;
            }

            this.disable();

            if (upload_status_elememt)
            {
                upload_status_elememt.show();
            }
        },

        onComplete: function (file, response) {//数据从服务器返回时,做的处理
            this.enable();

            if (upload_status_elememt)
            {
                upload_status_elememt.hide();
            }

            if (response.errno == -1)
            {
                alert(response.errno);
            }
            else
            {
                if (typeof(perview_element.attr('src')) != 'undefined')
                {
                    perview_element.attr('src', response.rsm.preview + '?' + Math.floor(Math.random() * 10000));
                }
                else
                {
                    perview_element.css('background-image', 'url(' + response.rsm.preview + '?' + Math.floor(Math.random() * 10000) + ')');
                }
            }
        }
    });
}

3.服务端的处理主要涉及到两个类../app/account/ajax.php与upload.php

function avatar_upload_action()
    {
        AWS_APP::upload()->initialize(array(
            'allowed_types' => 'jpg,jpeg,png,gif',
            'upload_path' => get_setting('upload_dir') . '/avatar/' . $this->model('account')->get_avatar($this->user_id, '', 1),
            'is_image' => TRUE,
            'max_size' => get_setting('upload_avatar_size_limit'),
            'file_name' => $this->model('account')->get_avatar($this->user_id, '', 2),
            'encrypt_name' => FALSE
        ))->do_upload('user_avatar');if (AWS_APP::upload()->get_error())
        {
            switch (AWS_APP::upload()->get_error())
            {
                default:
                    H::ajax_json_output(AWS_APP::RSM(null, '-1', AWS_APP::lang()->_t('错误代码') . ': ' . AWS_APP::upload()->get_error()));
                break;

                case 'upload_invalid_filetype':
                    H::ajax_json_output(AWS_APP::RSM(null, '-1', AWS_APP::lang()->_t('文件类型无效')));
                break;    

                case 'upload_invalid_filesize':
                    H::ajax_json_output(AWS_APP::RSM(null, '-1', AWS_APP::lang()->_t('文件尺寸过大, 最大允许尺寸为 %s KB', get_setting('upload_size_limit'))));
                break;
            }
        }

        if (! $upload_data = AWS_APP::upload()->data())
        {
            H::ajax_json_output(AWS_APP::RSM(null, '-1', AWS_APP::lang()->_t('上传失败, 请与管理员联系')));
        }

        if ($upload_data['is_image'] == 1)
        {
            foreach(AWS_APP::config()->get('image')->avatar_thumbnail AS $key => $val)
            {
                $thumb_file[$key] = $upload_data['file_path'] . $this->model('account')->get_avatar($this->user_id, $key, 2);

                AWS_APP::image()->initialize(array(
                    'quality' => 90,
                    'source_image' => $upload_data['full_path'],
                    'new_image' => $thumb_file[$key],
                    'width' => $val['w'],
                    'height' => $val['h']
                ))->resize();
            }
        }

        $update_data['avatar_file'] = $this->model('account')->get_avatar($this->user_id, null, 1) . basename($thumb_file['min']);

        // 更新主表
        $this->model('account')->update_users_fields($update_data, $this->user_id);

        if (!$this->model('integral')->fetch_log($this->user_id, 'UPLOAD_AVATAR'))
        {
            $this->model('integral')->process($this->user_id, 'UPLOAD_AVATAR', round((get_setting('integral_system_config_profile') * 0.2)), '上传头像');
        }

        H::ajax_json_output(AWS_APP::RSM( array(
            'preview' => get_setting('upload_url') . '/avatar/' . $this->model('account')->get_avatar($this->user_id, null, 1) . basename($thumb_file['max'])
        ), 1, null));
    }

4.大致流程完毕！