Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.10.2012, 14:56
Интересующийся
Отправить личное сообщение для iGusse Посмотреть профиль Найти все сообщения от iGusse
 
Регистрация: 17.12.2009
Сообщений: 14

Jquery upload file
привет всем. Собственно озадачился я поиском аплоудера, который бы показал прогрес бар. Аплоудер должен передавать не только сам фаил, а фаил как часть формы, т.е. дополнительно требовалось передать еще один hidden. ВСе это искалось для использования в связке с Youtube API.

Собственно стандартная форма выглядит так :
<form action="<!-- URL -->?nexturl=http://www.site.com/result.php" method="post" enctype="multipart/form-data">
 <input type="hidden" name="token" value="<!-- TOKEN -->"/>
<input type="file" name ="file"></div>
<input type="submit" value="Отправить видео">
</form>


Метку URL мы меняем тем значением что нам пришлет youtube. Метку Token меняем на неких ключ разработчикa (string).
Т.е. По сути мне надо залить фаил по определенному "урлу", и вместе с файлом передать езе одну переменную. После того как фаил зальется, ютуб перенаправляет нас по nexturl, в котором ГЕТОМ передает ID залитого видео, и статус ( удалось, не удалось, оборвалось, и т.д.)

поиски мои увенчались успехом. Jquery file uploadhttp://blueimp.github.com/jQuery-File-Upload/ вот что мне помогло. Заюзал так называемый байсик мод.

Собственно вот страничка с описанием как его подключить https://github.com/blueimp/jQuery-Fil...i/Basic-plugin


Собственно ребята на этом мои мытарства не закончились. Его бы теперь допилить немного. Фаил он отправляет, ютуб его принимает все ок. Вот только в ответ ютуб шлет заголовок Location. Как бы мне его вытащить из ответа, и перенаправить браузер по нему? Может кто подсобит?
Ответить с цитированием
  #2 (permalink)  
Старый 06.12.2013, 22:59
rk7 rk7 вне форума
Новичок на форуме
Отправить личное сообщение для rk7 Посмотреть профиль Найти все сообщения от rk7
 
Регистрация: 16.10.2013
Сообщений: 2

Ну что нашел ответ как?
Ответить с цитированием
  #3 (permalink)  
Старый 18.12.2013, 21:28
Профессор
Отправить личное сообщение для Mukhtar Посмотреть профиль Найти все сообщения от Mukhtar
 
Регистрация: 08.10.2010
Сообщений: 201

Сообщение от rk7 Посмотреть сообщение
Ну что нашел ответ как?
я нашел!

В общем делаешь такое
<div id="uploader">
     <div class="row fileupload-buttonbar">
            <div class="col-lg-7">
                <!-- The fileinput-button span is used to style the file input field as button -->
                <span class="btn btn-success fileinput-button">
                	<i class="icon-plus icon-white"></i>
                    <span>Загрузка фотографий</span>
                    <input type="file" name="files[]" multiple>
                </span>
                <button type="submit" class="btn btn-primary start">
                    <i class="glyphicon glyphicon-upload"></i>
                    <span>Start upload</span>
                </button>
                <button type="reset" class="btn btn-warning cancel">
                    <i class="glyphicon glyphicon-ban-circle"></i>
                    <span>Cancel upload</span>
                </button>
                <button type="button" class="btn btn-danger delete">
                    <i class="glyphicon glyphicon-trash"></i>
                    <span>Delete</span>
                </button>
                <input type="checkbox" class="toggle">
                <!-- The global file processing state -->
                <span class="fileupload-process"></span>
            </div>
            <!-- The global progress state -->
            <div class="col-lg-5 fileupload-progress fade">
                <!-- The global progress bar -->
                <div class="progress progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
                    <div class="progress-bar progress-bar-success" style="width:0%;"></div>
                </div>
                <!-- The extended global progress state -->
                <div class="progress-extended">&nbsp;</div>
            </div>
        </div>
        <!-- The table listing the files available for upload/download -->
        <table role="presentation" class="table"><tbody class="files"></tbody></table>
     </div>
    </div>


И инициализируешь в js

$('#mainWindow').fileupload({

}).on('fileuploadsubmit', function (e, data) {
data.formData = {твоя переменная: значение}

Затем заходишь в папку server/php/index.php (я использовал последней версии плагин, так что содержимое может отличаться. Рекомендую установить плагин версии 9.5.2)
Вставляешь вместо всего кода, который там есть этот
$options = array(
    'delete_type' => 'POST',
    'db_host' => 'localhost',
    'db_user' => 'root',
    'db_pass' => '',
    'db_name' => 'mycbc',
    'db_table' => 'card_photos'
);

error_reporting(E_ALL | E_STRICT);
require('UploadHandler.php');

class CustomUploadHandler extends UploadHandler {

    protected function initialize() {
    	$this->db = new mysqli(
    		$this->options['db_host'],
    		$this->options['db_user'],
    		$this->options['db_pass'],
    		$this->options['db_name']
    	);
        parent::initialize();
        $this->db->close();
    }

    protected function handle_form_data($file, $index) {
	$file->твоя переменная = @$_REQUEST['твоя переменная'][$index];
    }

    protected function handle_file_upload($uploaded_file, $name, $size, $type, $error,
            $index = null, $content_range = null) {
        $file = parent::handle_file_upload(
        	$uploaded_file, $name, $size, $type, $error, $index, $content_range
        );
        if (empty($file->error)) {
			$sql = 'INSERT INTO `'.$this->options['db_table']
				.'` (`name`, `size`, `type`, `твоя переменная`)'
				.' VALUES (?, ?, ?, ?)';
	        $query = $this->db->prepare($sql);
	        $query->bind_param(
	        	'sisss',
	        	$file->name,
	        	$file->size,
	        	$file->type,
			$file->твоя переменная
	        );
	        $query->execute();
	        $file->id = $this->db->insert_id;
        }
        return $file;
    }

    protected function set_additional_file_properties($file) {
        parent::set_additional_file_properties($file);
        if ($_SERVER['REQUEST_METHOD'] === 'GET') {
        	$sql = 'SELECT `id`, `type`, `title`, `description` FROM `'
        		.$this->options['db_table'].'` WHERE `name`=?';
        	$query = $this->db->prepare($sql);
 	        $query->bind_param('s', $file->name);
	        $query->execute();
	        $query->bind_result(
	        	$id,
	        	$type,
	        	$title,
	        	$description
	        );
	        while ($query->fetch()) {
	        	$file->id = $id;
        		$file->type = $type;
        		$file->title = $title;
        		$file->description = $description;
				$file->folder_name = $folder_name;
    		}
        }
    }

    public function delete($print_response = true) {
        $response = parent::delete(false);
        foreach ($response as $name => $deleted) {
        	if ($deleted) {
	        	$sql = 'DELETE FROM `'
	        		.$this->options['db_table'].'` WHERE `name`=?';
	        	$query = $this->db->prepare($sql);
	 	        $query->bind_param('s', $name);
		        $query->execute();
        	}
        } 
        return $this->generate_response($response, $print_response);
    }

}

$upload_handler = new CustomUploadHandler($options);


В общем для тебя даже доработал сохранение всех передаваемых значений в MySQL БД )))))))).
Надеюсь разберешься
Ответить с цитированием
  #4 (permalink)  
Старый 18.12.2013, 22:11
Профессор
Отправить личное сообщение для Mukhtar Посмотреть профиль Найти все сообщения от Mukhtar
 
Регистрация: 08.10.2010
Сообщений: 201

Сообщение от iGusse Посмотреть сообщение
привет всем. Собственно озадачился я поиском аплоудера, который бы показал прогрес бар. Аплоудер должен передавать не только сам фаил, а фаил как часть формы, т.е. дополнительно требовалось передать еще один hidden. ВСе это искалось для использования в связке с Youtube API.
Взамен прошу отправить мне Ваш вариант загрузки видео на Youtube, очень нужно тоже. Спасибо. вот почта m.suleimenov@mail.ru
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
JQuery file upload plugin проверка vyaceslav.kr jQuery 0 11.09.2012 00:50
Загрузка файлов на сервер: jquery и Commons File Upload kliver AJAX и COMET 11 02.07.2012 11:19
Jquery Upload image & PHP capscom jQuery 0 17.10.2011 17:06
jQuery Form Plugin - file upload IgorN jQuery 3 22.02.2011 15:17
jQuery multi file upload УБИВАЕТ explorer gagagogo jQuery 5 07.08.2009 09:43