<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
	<channel>
				<title><![CDATA[Ajax로 파일을 업로드하고 싶습니다]]></title>
		<link>https://www.cosmosfarm.com/threads/rss/document/24798</link>
		<description><![CDATA[<p> Ajax로 excel을 업로드한 뒤에 파일을 읽어서 DB에 넣어주고 싶습니다.</p>

<p>구글에서 돌아다니는 소스를 통해서 소스를 짜고 있는데 문제는 제가 하고 있는게 맞는건지 확신이 없어서</p>

<p>소스를 검토+잘못된 것은 첨삭을 부탁드리려고 글을 올리게 되었습니다</p>

<p>Ajax로 보내는 소스입니다 id="upfile"은 &lt;input type="file" id="upfile"&gt; 입니다</p>

<pre>
<code>		$("#upfile").off().on('change', function() {		
			var data = $("#upfile").val();

			console.log("시작");
			console.log(data);
			console.log("종료");
			$.post(ajax_object.ajax_url, {     //ajax object
				action : 'set_excel',           //hook name
				data : data,
				processData: false,
				contentType: false
			}, function(data) {
				console.log(data);
				alert(data);
			});
		});</code></pre>

<p> </p>

<p>function.php 에서 받는 소스입니다</p>

<pre>
<code class="language-php">	$upfile_name = $_FILES['upfile']['name']; // 파일이름
	$upfile_type = $_FILES['upfile']['type']; // 확장자
	$upfile_size = $_FILES['upfile']['size']; // 파일크기
	$upfile_tmp  = $_FILES['upfile']['tmp_name']; // 임시 디렉토리에 저장된 파일명
	$uploadfile = $uploaddir . $_FILES['userfile']['name'];</code></pre>

<p>(인터넷에서 전부다 excel파일을 이렇게 받던데 ajax로 하려고 하니깐 안되더군요)</p>

<p>워드프레스 자체가 플러그인을 사용해서 업로드가 가능하지만</p>

<p>excel 파일을 업로드하면서 DB에 Import하는 플러그인을 못 찾겠더군요</p>

<p>그래서 직접적으로 소스를 만지면서 기능을 구현하려고 하여 이렇게 질문하게 되었습니다</p>]]></description>
		<copyright>Copyright 2026, 코스모스팜</copyright>
				<item>
			<title><![CDATA[안녕하세요.

별 다른 설정을 하지 않으셨다면 wp_upload_dir() 함수를 사용하시면

/wp-content/upload...]]></title>
			<link>https://www.cosmosfarm.com/threads/document/24923</link>
			<description><![CDATA[<p>안녕하세요.</p>

<p>별 다른 설정을 하지 않으셨다면 wp_upload_dir() 함수를 사용하시면</p>

<p>/wp-content/uploads/년도/월 경로를 표시합니다.</p>

<p>년도와 월은 현재 시간을 기준으로 설정됩니다.</p>

<p>만약 wp_upload_dir('2018/09') 처럼 사용하시면</p>

<p>/wp-content/uploads/2018/09로 표시됩니다.</p>

<p> </p>

<p>워드프레스 관리자 -&gt; 외모 -&gt; 테마 편집기 페이지에서 functions.php 파일 하단에</p>

<p>아래의 코드를 추가해서 확인해보실 수 있습니다.</p>

<pre>
<code class="language-php">add_action('init', 'my_init');
function my_init(){
	print_r(wp_upload_dir());
	echo '&lt;br&gt;';
	print_r(wp_upload_dir('2018/09'));
}</code></pre>

<p>고맙습니다.</p>]]></description>
			<author>스레드봇</author>
			<pubDate>Mon, 23 Jul 2018 01:42:06 +0000</pubDate>
			<category>워드프레스</category>
		</item>
				<item>
			<title><![CDATA[감사합니다 덕분에 무사히 잘 해겼습니다

그런데 죄송하지만 추가적인 질문좀 있습니다.

이 파일을 업...]]></title>
			<link>https://www.cosmosfarm.com/threads/document/24905</link>
			<description><![CDATA[<p>감사합니다 덕분에 무사히 잘 해겼습니다</p>

<p>그런데 죄송하지만 추가적인 질문좀 있습니다.</p>

<p>이 파일을 업로드 했을 때 경로가 필요합니다.</p>

<p>wp_upload_dir()를 사용해보니 제 로컬서버의 절대경로가 나오는데 제가 필요한건 동적인 파일경로가 필요합니다.</p>

<p>예를 들어 미디어라이브러리에서 7월에 저장되면 "http://localhost:XXXX/wordpress/upload/2018/07/FileName.확장자"</p>

<p>9월에 저장되면 "http://localhost:XXXX/wordpress/upload/2018/09/FileName.확장자" 이런 식으로 경로를 필요합니다</p>

<p>이러기 위해서는 어떤 식으로 값을 가져오나요?</p>]]></description>
			<author>검은내일</author>
			<pubDate>Sun, 22 Jul 2018 06:54:13 +0000</pubDate>
			<category>워드프레스</category>
		</item>
				<item>
			<title><![CDATA[wp_handle_upload 함수를 사용하시려면

Ajax 파일 데이터를 넘겨줄 때 실제 파일 형식에 맞춰서 넘겨주...]]></title>
			<link>https://www.cosmosfarm.com/threads/document/24892</link>
			<description><![CDATA[<p>wp_handle_upload 함수를 사용하시려면</p>

<p>Ajax 파일 데이터를 넘겨줄 때 실제 파일 형식에 맞춰서 넘겨주셔야 합니다.</p>

<p>워드프레스에서는 $("#upfile1") 코드 대신 jQuery("#upfile1") 이런 식으로 적용해주셔야 합니다.</p>

<p> </p>

<p>예제 코드를 만들어 봤습니다.</p>

<p>아래의 코드를 활용해보시겠어요?</p>

<pre>
<code class="language-html">&lt;input type="file" id="upfile1" name="upfile1" accept="image/*"/&gt;
&lt;script&gt;
jQuery(document).ready(function() {
    jQuery('#upfile1').on('change', function(e){
        e.preventDefault;

        var formData = new FormData();
        var files_data = jQuery('#upfile1');

		formData.append('upfile1', jQuery(files_data)[0].files[0]);
        formData.append('action', 'set_excel');  

        jQuery.ajax({
            type: 'POST',
            url: '&lt;?php echo admin_url( 'admin-ajax.php' ); ?&gt;',
            data: formData,
            contentType: false,
            processData: false,
            success: function(response){
				alert(response);
            }
        });
    });
});
&lt;/script&gt;</code></pre>

<p> </p>

<p>테마 쪽 functions.php 파일에는 아래의 코드를 활용해보세요.</p>

<pre>
<code class="language-php">add_action('wp_ajax_set_excel', 'set_excel');
add_action('wp_ajax_nopriv_set_excel', 'set_excel');
function set_excel(){
	if(!function_exists('wp_handle_upload')){
		require_once(ABSPATH . 'wp-admin/includes/file.php');
	}

	$uploadedfile = $_FILES['upfile1'];
	$movefile = wp_handle_upload($uploadedfile, array('test_form' =&gt; false));
	
	if($movefile &amp;&amp; ! isset($movefile['error'])){
		echo "업로드 되었습니다.";
	}
	else{
		echo $movefile['error'];
	}
	exit;
}</code></pre>

<p>고맙습니다.</p>]]></description>
			<author>스레드봇</author>
			<pubDate>Fri, 20 Jul 2018 08:10:15 +0000</pubDate>
			<category>워드프레스</category>
		</item>
				<item>
			<title><![CDATA[안녕하세요 지금 3일째 붙잡고 있는데 잘 안되고 있습니다.

정리를 하고 싶어서 질문을 올립니다

1. ...]]></title>
			<link>https://www.cosmosfarm.com/threads/document/24885</link>
			<description><![CDATA[<p>안녕하세요 지금 3일째 붙잡고 있는데 잘 안되고 있습니다.</p>

<p>정리를 하고 싶어서 질문을 올립니다</p>

<p>1. 올려주신 예제를 이런 식으로 쓰는 것이 맞는건지 확인하고 싶습니다</p>

<pre>
<code class="language-php">function set_excel() {
	if ( ! function_exists( 'wp_handle_upload' ) ) {
	    require_once( ABSPATH . 'wp-admin/includes/file.php' );
	}

	$uploadedfile = $_FILES['upfile1'];
//	$uploadedfile = $_POST['data'];

//	print_r($uploadedfile);

	$upload_overrides = array( 'test_form' =&gt; false );

	$movefile = wp_handle_upload( $uploadedfile, $upload_overrides );

	if ( $movefile &amp;&amp; ! isset( $movefile['error'] ) ) {
	    echo "File is valid, and was successfully uploaded.\n";
	    var_dump( $movefile );
	} else {
	    /**
	     * Error generated by _wp_handle_upload()
	     * @see _wp_handle_upload() in wp-admin/includes/file.php
	     */
	    echo $movefile['error'];
	}
}
add_action('wp_ajax_set_excel', 'set_excel'); //logged in.
add_action('wp_ajax_nopriv_set_excel', 'set_excel'); //not logged in.</code></pre>

<p>ajax를 통해 파일을 업로드 하기 위해서 함수를 지정하여서 예제소스를 넣었습니다.</p>

<p> </p>

<p>2. jQuery를 이용하여 Ajax를 사용해 파일을 업로드 하려고 합니다.(해당 jQuery는 custom.js에서 사용하고 있습니다)</p>

<pre>
<code class="language-javascript">$("#upfile1").off().on('change', function() {
			var file_data = $("#upfile1").prop("files")[0];   
			var form_data = new FormData();
			form_data.append("files", file_data);

//			var data = $("#upfile").val();   

		    console.log("시작");
			console.log(form_data.get("files"));
			console.log("종료");
		   	$.post(ajax_object.ajax_url, {     //ajax object
				action : 'set_excel',           //hook name
				data : form_data.get("files"),
				processData: false,
    			contentType: false,
    			type: 'POST',
				mimeType: 'multipart/form-data'
			}, function(data) {
				console.log(data);
				alert(data);
			});
		});</code></pre>

<p>해당 소스는 file이 들어왔을 때 자동적으로 실행해서 데이터를 업로드 하려고 구현할 예정입니다</p>

<p>console.log(form_data.get(files)) 을 찍을 경우 해당 로그가 출력이 됩니다</p>

<pre>
<code>File(158) {name: "mycsv.csv", lastModified: 1532003962671, lastModifiedDate: Thu Jul 19 2018 21:39:22 GMT+0900 (한국 표준시), webkitRelativePath: "", size: 158, …}</code></pre>

<p>소스를 보시면 아시다시피 해당 데이터를 function.php -&gt; set_excel()로 데이터를 보내고 있습니다.</p>

<p>그런데 이 데이터가 형식에 맞게 보내는건지 잘 모르겠습니다</p>

<p>(Ajax가 실행되면 출력되는 해당 오류)</p>

<pre>
<code>Uncaught TypeError: Illegal invocation
    at e (jquery.js?ver=1.12.4:4)
    at dc (jquery.js?ver=1.12.4:4)
    at dc (jquery.js?ver=1.12.4:4)
    at Function.n.param (jquery.js?ver=1.12.4:4)
    at Function.ajax (jquery.js?ver=1.12.4:4)
    at Function.n.(:8080/wordpress/%eb%ac%b8%ec%a0%9c%ec%b6%9c%ec%a0%9c/anonymous function) [as post] (http://localhost:8080/wordpress/wp-includes/js/jquery/jquery.js?ver=1.12.4:4:23175)
    at HTMLInputElement.&lt;anonymous&gt; (custom.js?ver=4.9.7:243)
    at HTMLInputElement.dispatch (jquery.js?ver=1.12.4:3)
    at HTMLInputElement.r.handle (jquery.js?ver=1.12.4:3)</code></pre>

<p> </p>

<p>3. formdata의 값을 재대로 쓰고 있는지 확인하고 싶습니다.</p>

<p>위 소스를 보시면 눈치 채실수도 있지만 formdata는 enctype="multipart/form-data"를 자동으로 지정해준다고 하여 Form을 따로 지정을 안하고</p>

<p>file에 지정된 ID, Name 값만 가지고 왔습니다. 그래도 오류가 생기길래 값을 보낼때 mimeType : 'multipart/form-data' 로 설정하였으나 아무런 효과가 없었습니다</p>

<p> </p>

<p>4. 올려주신 wp_handle_upload 함수가 테마에 따라 적용이 안 될수 있는지 궁금합니다.</p>

<p>지금 제가 사용하는 테마의 이름은 <strong>Study Circle</strong> 입니다 wp_handle_upload의 관련된 함수가 지정이 안되서</p>

<p>혹시 출력이 안되는게 아닐까 생각도 들고 있습니다. 그런데 이걸 확인해보고 싶어도 어떻게 확인하는지 잘 모르겠습니다.</p>

<p> </p>

<p>더 궁금한게 있지만 우선 가장 중요한것은 이 4가지인거 같습니다.</p>

<p>이렇게 되면 파일이 미디어 라이브러리에 들어가야 된다고 생각하며 코드를 짠건데 자꾸 막혀있습니다.</p>]]></description>
			<author>검은내일</author>
			<pubDate>Fri, 20 Jul 2018 03:30:12 +0000</pubDate>
			<category>워드프레스</category>
		</item>
				<item>
			<title><![CDATA[올려드린 사이트는 참고용으로 올려드렸습니다.

말씀하신 것처럼 functions.php 쪽에 추가하신 Ajax Ac...]]></title>
			<link>https://www.cosmosfarm.com/threads/document/24815</link>
			<description><![CDATA[<p>올려드린 사이트는 참고용으로 올려드렸습니다.</p>

<p>말씀하신 것처럼 functions.php 쪽에 추가하신 Ajax Action으로 하셔도 됩니다.</p>

<p>functions.php 쪽에 추가하신 코드에</p>

<p>실제 업로드는 워드프레스 내장 함수인 <a href="https://codex.wordpress.org/Function_Reference/wp_handle_upload" target="_blank">wp_handle_upload()</a> 함수를 사용해보시겠어요?</p>

<p>고맙습니다.</p>]]></description>
			<author>스레드봇</author>
			<pubDate>Thu, 19 Jul 2018 03:30:53 +0000</pubDate>
			<category>워드프레스</category>
		</item>
				<item>
			<title><![CDATA[예제를 봐도 잘 모르는 이유는 Form 태그의 Action 값 때문에 그렇습니다

워드프레스는 form에서 데이...]]></title>
			<link>https://www.cosmosfarm.com/threads/document/24813</link>
			<description><![CDATA[<p>예제를 봐도 잘 모르는 이유는 Form 태그의 Action 값 때문에 그렇습니다</p>

<p>워드프레스는 form에서 데이터를 보낼때 어디 ~.php에 데이터를 보내세요</p>

<p>라는게 안되는걸로 알고 있습니다. 실제로 몇몇 실험 해보고 안됬었구요</p>

<p>그래서 찾은게 Ajax를 이용하여 Action의 function.php의 함수를 실행하고 거기로 데이터를 보내는 식으로 했는데</p>

<p>파일 업로드는 이런식으로 하면 안되는건가요?</p>]]></description>
			<author>검은내일</author>
			<pubDate>Thu, 19 Jul 2018 02:53:07 +0000</pubDate>
			<category>워드프레스</category>
		</item>
				<item>
			<title><![CDATA[안녕하세요~^^

워드프레스의 wp_handle_upload() 함수를 사용해보시겠어요?

아래 예제 코드도 참고해...]]></title>
			<link>https://www.cosmosfarm.com/threads/document/24807</link>
			<description><![CDATA[<p>안녕하세요~^^</p>

<p>워드프레스의 <a href="https://codex.wordpress.org/Function_Reference/wp_handle_upload" target="_blank">wp_handle_upload()</a> 함수를 사용해보시겠어요?</p>

<p>아래 예제 코드도 참고해주세요.</p>

<pre>
<code class="language-php">if ( ! function_exists( 'wp_handle_upload' ) ) {
    require_once( ABSPATH . 'wp-admin/includes/file.php' );
}

$uploadedfile = $_FILES['file'];

$upload_overrides = array( 'test_form' =&gt; false );

$movefile = wp_handle_upload( $uploadedfile, $upload_overrides );

if ( $movefile &amp;&amp; ! isset( $movefile['error'] ) ) {
    echo "File is valid, and was successfully uploaded.\n";
    var_dump( $movefile );
} else {
    /**
     * Error generated by _wp_handle_upload()
     * @see _wp_handle_upload() in wp-admin/includes/file.php
     */
    echo $movefile['error'];
}</code></pre>

<p>위의 예제 코드에서 $_FILES['<strong>file</strong>']; 이 부분은</p>

<p>실제로 &lt;input type="file" name="<strong>file</strong>"&gt; 코드에서 input의 name과 일치시켜 주시면 됩니다.</p>

<p> </p>

<p>form 태그에 enctype="multipart/form-data" 속성이 있는지 확인해보세요.</p>

<p>&lt;form enctype="multipart/form-data"&gt; 이런 형식입니다.</p>

<p>해당 속성 없이는 파일이 전송되지 않습니다.</p>

<p> </p>

<p>추가로 PHP의 파일 업로드 방식과 스택 오버플로우에 올라온 질문을 참고해보시면 도움이 되실 듯합니다.</p>

<p><a href="http://php.net/manual/kr/features.file-upload.post-method.php" target="_blank">http://php.net/manual/kr/features.file-upload.post-method.php</a><br />
<a href="https://wordpress.stackexchange.com/questions/198781/wordpress-ajax-file-upload-frontend" target="_blank">https://wordpress.stackexchange.com/questions/198781/wordpress-ajax-file-upload-frontend</a></p>

<p>고맙습니다.</p>]]></description>
			<author>스레드봇</author>
			<pubDate>Thu, 19 Jul 2018 02:06:58 +0000</pubDate>
			<category>워드프레스</category>
		</item>
			</channel>
</rss>