皆様初めまして
私は現在以下のものを利用してphpでファイルのアップロードを実装しております。
jquery-file-upload
vangrant+virtualHostの環境でドキュメントルート配下に「test」フォルダを作成し、その中に上記リンクよりダウンロードしたフォルダをそのまま格納して動かそうとしたところ、開発者ツールにて「http://127.0.0.1:10080/test/server/php/ 500 (Internal Server Error)」
と怒られてしまいました。。。
権限の問題かなと思い、設定ファイルで指定されているアップロード先「server/php」に権限を「777」としてみましたが、結果は変わりませんでした。
こちらを動かす際になにか足りない設定などは御座いますでしょうか?
html
1basic.html 2<!DOCTYPE HTML> 3<!-- 4/* 5 * jQuery File Upload Plugin Basic Demo 6 * https://github.com/blueimp/jQuery-File-Upload 7 * 8 * Copyright 2013, Sebastian Tschan 9 * https://blueimp.net 10 * 11 * Licensed under the MIT license: 12 * https://opensource.org/licenses/MIT 13 */ 14--> 15<html lang="en"> 16<head> 17<!-- Force latest IE rendering engine or ChromeFrame if installed --> 18<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><![endif]--> 19<meta charset="utf-8"> 20<title>jQuery File Upload Demo - Basic version</title> 21<meta name="description" content="File Upload widget with multiple file selection, drag&drop support and progress bar for jQuery. Supports cross-domain, chunked and resumable file uploads. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads."> 22<meta name="viewport" content="width=device-width, initial-scale=1.0"> 23<!-- Bootstrap styles --> 24<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 25<!-- Generic page styles --> 26<link rel="stylesheet" href="css/style.css"> 27<!-- CSS to style the file input field as button and adjust the Bootstrap progress bars --> 28<link rel="stylesheet" href="css/jquery.fileupload.css"> 29</head> 30<body> 31<div class="navbar navbar-default navbar-fixed-top"> 32 <div class="container"> 33 <div class="navbar-header"> 34 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-fixed-top .navbar-collapse"> 35 <span class="icon-bar"></span> 36 <span class="icon-bar"></span> 37 <span class="icon-bar"></span> 38 </button> 39 <a class="navbar-brand" href="https://github.com/blueimp/jQuery-File-Upload">jQuery File Upload</a> 40 </div> 41 <div class="navbar-collapse collapse"> 42 <ul class="nav navbar-nav"> 43 <li><a href="https://github.com/blueimp/jQuery-File-Upload/tags">Download</a></li> 44 <li><a href="https://github.com/blueimp/jQuery-File-Upload">Source Code</a></li> 45 <li><a href="https://github.com/blueimp/jQuery-File-Upload/wiki">Documentation</a></li> 46 <li><a href="https://blueimp.net">© Sebastian Tschan</a></li> 47 </ul> 48 </div> 49 </div> 50</div> 51<div class="container"> 52 <h1>jQuery File Upload Demo</h1> 53 <h2 class="lead">Basic version</h2> 54 <ul class="nav nav-tabs"> 55 <li class="active"><a href="basic.html">Basic</a></li> 56 <li><a href="basic-plus.html">Basic Plus</a></li> 57 <li><a href="index.html">Basic Plus UI</a></li> 58 <li><a href="angularjs.html">AngularJS</a></li> 59 <li><a href="jquery-ui.html">jQuery UI</a></li> 60 </ul> 61 <br> 62 <blockquote> 63 <p>File Upload widget with multiple file selection, drag&drop support and progress bar for jQuery.<br> 64 Supports cross-domain, chunked and resumable file uploads.<br> 65 Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.</p> 66 </blockquote> 67 <br> 68 <!-- The fileinput-button span is used to style the file input field as button --> 69 <span class="btn btn-success fileinput-button"> 70 <i class="glyphicon glyphicon-plus"></i> 71 <span>Select files...</span> 72 <!-- The file input field used as target for the file upload widget --> 73 <input id="fileupload" type="file" name="files[]" multiple> 74 </span> 75 <br> 76 <br> 77 <!-- The global progress bar --> 78 <div id="progress" class="progress"> 79 <div class="progress-bar progress-bar-success"></div> 80 </div> 81 <!-- The container for the uploaded files --> 82 <div id="files" class="files"></div> 83 <br> 84 <div class="panel panel-default"> 85 <div class="panel-heading"> 86 <h3 class="panel-title">Demo Notes</h3> 87 </div> 88 <div class="panel-body"> 89 <ul> 90 <li>The maximum file size for uploads in this demo is <strong>999 KB</strong> (default file size is unlimited).</li> 91 <li>Only image files (<strong>JPG, GIF, PNG</strong>) are allowed in this demo (by default there is no file type restriction).</li> 92 <li>Uploaded files will be deleted automatically after <strong>5 minutes or less</strong> (demo files are stored in memory).</li> 93 <li>You can <strong>drag & drop</strong> files from your desktop on this webpage (see <a href="https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support">Browser support</a>).</li> 94 <li>Please refer to the <a href="https://github.com/blueimp/jQuery-File-Upload">project website</a> and <a href="https://github.com/blueimp/jQuery-File-Upload/wiki">documentation</a> for more information.</li> 95 <li>Built with the <a href="http://getbootstrap.com/">Bootstrap</a> CSS framework and Icons from <a href="http://glyphicons.com/">Glyphicons</a>.</li> 96 </ul> 97 </div> 98 </div> 99</div> 100<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js" integrity="sha384-xBuQ/xzmlsLoJpyjoggmTEz8OWUFM0/RC5BsqQBDX2v5cMvDHcMakNTNrHIW2I5f" crossorigin="anonymous"></script> 101<!-- The jQuery UI widget factory, can be omitted if jQuery UI is already included --> 102<script src="js/vendor/jquery.ui.widget.js"></script> 103<!-- The Iframe Transport is required for browsers without support for XHR file uploads --> 104<script src="js/jquery.iframe-transport.js"></script> 105<!-- The basic File Upload plugin --> 106<script src="js/jquery.fileupload.js"></script> 107<!-- Bootstrap JS is not required, but included for the responsive demo navigation --> 108<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 109<script> 110/*jslint unparam: true */ 111/*global window, $ */ 112$(function () { 113 'use strict'; 114 // Change this to the location of your server-side upload handler: 115 var url = window.location.hostname === 'blueimp.github.io' ? 116 '//jquery-file-upload.appspot.com/' : 'server/php/'; 117 $('#fileupload').fileupload({ 118 url: url, 119 dataType: 'json', 120 done: function (e, data) { 121 $.each(data.result.files, function (index, file) { 122 $('<p/>').text(file.name).appendTo('#files'); 123 }); 124 }, 125 progressall: function (e, data) { 126 var progress = parseInt(data.loaded / data.total * 100, 10); 127 $('#progress .progress-bar').css( 128 'width', 129 progress + '%' 130 ); 131 } 132 }).prop('disabled', !$.support.fileInput) 133 .parent().addClass($.support.fileInput ? undefined : 'disabled'); 134}); 135</script> 136</body> 137</html> 138
環境
centos6.7
apache2.4(apacheのテストページが表示されることは確認できております。)
ディレクトリ構造
<<ドキュメントルート>>
┗test
┣server
┃ ┗php
┃ ┗files(予想ではこちらにアップされると思っていました...)
┣js
┣img
┣css
┗cors
どなたか解決方法などご存知の方がいらっしゃいましたら、ご教授願えれば幸いです。宜しくお願い致します。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。