질문을 삭제하지 말아주세요.!
 
1
0
-1

김주원님 책 으로 배우고 있는데 파일첨부기능 공부중에 dropzone으로 게시물 등록은 잘 됩니다. 그런데 destroy때 500에러가 나는데 이유를 모르겟습니다.

삭제를 할때 form은 이렇습니다.

  myDropzone.on('removedfile', function(file) {
            console.log(file);
            console.log(file._id);
            $.ajax({
              type: 'DELETE',
              url: '/attachments/' + file._id
            }).then(function(data) {
              console.log(data);
              handleFormElement(data.id, true);
              if (/^image/.test(data.mime)) {
                handleContent('content', data.url, true);
              }
            })
          });

이렇게 하면 개발자도구에


이렇게 오류가 뜨는데 500에러는 서버 문법오류라고 해서 controller를 확인했는데 destroy함수는 이렇습니다.

public function destroy(\App\Attachment $attachment)
  {
      dd($attachment);
      $path = attachments_path($attachment->name);
        if (\File::exists($path)) {
          \File::delete($path);
      }
        $attachment->delete();
        return response()->json($attachment, 200, [], JSON_PRETTY_PRINT);
  }

책과 동일하게 했습니다. 물론 라우트서비스프로바이더에 

Route::model('attachment',\App\Attachment::class);

이렇게 등록도 잘 해주었습니다. destroy함수를 보시면 dd를 찍었는데 dd조차 접근하지 못하는것같습니다.

추가적으로 destroy시 개발자도구는 이렇습니다.

몇시간째 쳐다보는데도 이유를 모르겟습니다ㅠㅠ

매번 답변 너무 감사드립니다! 저같은 현상을 겪는 분들께 많은 도움이 될 답변 부탁드립니다.

    CommentAdd your comment...

    2 answers

    1.  
      1
      0
      -1

      아이고.. 5.4였군요. 위에 제 답변 전부 무시하고, 아래 질문과 답변을 참고하세요.


      npm install 명령과 gulp가 안됩니다. (5.4.18버전)

      1. 이용준

        package.json 설정하고 npm install --no-bin-links 를 했더니

        이런 에러가 뜨는데 이건 상관 없는것인가요? node_modules에는 설치한 파일들이 설치되었길래 여쭤봅니다.

      2. 이용준

        어쨓든 끝까지 해보았더니 

        이런 에러가 뜹니다..

      3. 이용준

        npm bugs 파일은 이렇습니다.

        0 info it worked if it ends with ok
        1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe',
        1 verbose cli   'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js',
        1 verbose cli   'run',
        1 verbose cli   'dev' ]
        2 info using npm@4.1.2
        3 info using node@v7.7.4
        4 verbose run-script [ 'predev', 'dev', 'postdev' ]
        5 info lifecycle @~predev: @
        6 silly lifecycle @~predev: no script for predev, continuing
        7 info lifecycle @~dev: @
        8 verbose lifecycle @~dev: unsafe-perm in lifecycle true
        9 verbose lifecycle @~dev: PATH: C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin;C:\Users\SAMSUNG\myapp2\node_modules\.bin;C:\Users\SAMSUNG\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\local\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\bin;C:\Users\SAMSUNG\bin;C:\Program Files\Java\jdk1.8.0_111\bin;C:\ProgramData\Oracle\Java\javapath;C:\Program Files (x86)\Intel\iCLS Client;C:\Program Files\Intel\iCLS Client;C:\windows\system32;C:\windows;C:\windows\System32\Wbem;C:\windows\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\Samsung\SamsungLink\AllShare Framework DMS\bin;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\MySQL\MySQL Utilities 1.6;C:\Program Files\mingw-w64\x86_64-6.3.0-win32-seh-rt_v5-rev1\mingw64\bin;C:\Users\SAMSUNG\.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm;C:\Program Files\Microsoft SQL Server\130\Tools\Binn;C:\Program Files (x86)\Windows Kits\8.1\Windows Performance Toolkit;C:\Program Files\Anaconda3;C:\Program Files\Anaconda3\Scripts;C:\Program Files\Anaconda3\Library\bin;C:\Program Files\Git\cmd;C:\Program Files\nodejs;C:\Bitnami\wampstack-5.6.30-1\php;C:\Program Files\MySQL\MySQL Workbench 6.3 CE;C:\ProgramData\ComposerSetup\bin;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files\nodejs;C:\MinGW\bin;C:\Users\SAMSUNG\AppData\Local\atom\bin;C:\Users\SAMSUNG\AppData\Roaming\Composer\vendor\bin;C:\Users\SAMSUNG\AppData\Local\Microsoft\WindowsApps;C:\Users\SAMSUNG\AppData\Roaming\npm;C:\Program Files\Git\usr\bin\vendor_perl;C:\Program Files\Git\usr\bin\core_perl
        10 verbose lifecycle @~dev: CWD: C:\Users\SAMSUNG\myapp2
        11 silly lifecycle @~dev: Args: [ '/d /s /c', 'npm run development' ]
        12 silly lifecycle @~dev: Returned: code: 1  signal: null
        13 info lifecycle @~dev: Failed to exec dev script
        14 verbose stack Error: @ dev: `npm run development`
        14 verbose stack Exit status 1
        14 verbose stack     at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:279:16)
        14 verbose stack     at emitTwo (events.js:106:13)
        14 verbose stack     at EventEmitter.emit (events.js:194:7)
        14 verbose stack     at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:40:14)
        14 verbose stack     at emitTwo (events.js:106:13)
        14 verbose stack     at ChildProcess.emit (events.js:194:7)
        14 verbose stack     at maybeClose (internal/child_process.js:899:16)
        14 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
        15 verbose pkgid @
        16 verbose cwd C:\Users\SAMSUNG\myapp2
        17 error Windows_NT 10.0.14393
        18 error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "dev"
        19 error node v7.7.4
        20 error npm  v4.1.2
        21 error code ELIFECYCLE
        22 error @ dev: `npm run development`
        22 error Exit status 1
        23 error Failed at the @ dev script 'npm run development'.
        23 error Make sure you have the latest version of node.js and npm installed.
        23 error If you do, this is most likely a problem with the  package,
        23 error not with npm itself.
        23 error Tell the author that this fails on your system:
        23 error     npm run development
        23 error You can get information on how to open an issue for this project with:
        23 error     npm bugs
        23 error Or if that isn't available, you can get their info via:
        23 error     npm owner ls
        23 error There is likely additional logging output above.
        24 verbose exit [ 1, true ]
        
        
        
      4. 김주원

        node_modules 폴더를 지우고, package.json을 라라벨5.4 최초 설치시의 클린한 상태(https://github.com/laravel/laravel/blob/master/package.json)로 원복 시킨 후, 제가 깃허브에 써 놓은 가이드에 따라 처음부터 다시 해 보세요.

      5. 이용준

        여전히 이렇습니다...npm install 이후에 npm run dev하니 이렇습니다.

      6. 이용준

        webpack은 어떻게 해서 성공적으로 되었습니다! 그런데 분명히 웹팩설정에

        const { mix } = require('laravel-mix');
        
        mix.sass('resources/assets/sass/app.scss', 'public/css');
        
        mix.js([
        	'node_modules/highlightjs/highlight.pack.js',
        	'resources/assets/js/app.js',
        	'node_modules/dropzone/dist/dropzone.js',
        	'node_modules/marked/lib/marked.js',
        	'node_modules/jquery-tabby/jquery.textarea.js',
        	'node_modules/autosize/dist/autosize.js',
        	'resources/assets/js/forum.js'
        ], 'public/js');
        
        mix.version([
            'public/css/app.css',
            'public/js/app.js'
        ]);
        
        mix.copy('node_modules/font-awesome/fonts', 'public/fonts');
        
        
        

        이렇게 해주었고 public/js/app.js도 존재하는데 app.js에 내용이 하나도 없습니다.npm run dev는 성공적으로 되었는데 그렇습니다. webpack설정에 어디가 잘못되었나요?

      CommentAdd your comment...
    2.  
      1
      0
      -1

      개발자 도구의 Preview와 Response 탭에는 어떤 내용이 나오나요? 아니면 storage/logs/laravel.log 의 가장 마지막 레코드는 무엇인가요? 이 정보들을 보고 디버깅하셔야 합니다.

      1. 이용준

        각각 Preview와 Response입니다!!! laravel 로그에는 아무것도 안찍히네요ㅠㅠ 

      2. 김주원

        본문에 없고 27.4 절에서 "드롭존 미리 보기에서 파일을 삭제하면 서버에 해당 파일 삭제 요청하고, 이미지 파일이라면 작성 중인 본문에서 삽입했던 마크다운을 지운다"라는 부분까지 실습을 하셨군요.

        그리고 제가 app.js가 변경되었다는 내용은 쓰지 않았네요. 죄송합니다.

        문제의 원인은 Ajax 요청할 때 CSRF 토큰을 전달하지 않아서 그런것입니다. 아래 커밋 로그의 변경 내용을 확인하고 반영해 주세요.

        https://github.com/appkr/l5code/commit/443c010666eeb0baf6fa152307527cd48d28ab7c#diff-23

      3. 이용준

        한가지 문제가 생겼습니다. app.js를 변경하고 했더니 앱을 작동중에

        이런 오류가 발생합니다. 분명히 pakage.json에 

        {
          "private": true,
          "scripts": {
            "prod": "gulp --production",
            "dev": "gulp watch"
          },
          "devDependencies": {
            "autosize": "^3.0.17",
            "bootstrap-sass": "^3.3.7",
            "dropzone": "^4.3.0",
            "font-awesome": "4.6.3",
            "gulp": "^3.9.1",
            "highlightjs": "^8.7.0",
            "jquery": "^3.1.0",
            "jquery-tabby": "^0.13.1",
            "laravel-elixir": "^6.0.0-9",
            "laravel-elixir-browsersync-official": "^1.0.0",
            "laravel-elixir-vue-2": "^0.3.0",
            "laravel-elixir-webpack-official": "^1.0.2",
            "lodash": "^4.14.0",
            "marked": "^0.3.6",
            "select2": "^4.0.3",
            "select2-bootstrap-css": "^1.4.6",
            "vue": "^2.1.0",
            "vue-resource": "^0.9.3"
          },
          "name": "myapp2",
          "description": "<p align=\"center\"><img src=\"https://laravel.com/assets/img/components/logo-laravel.svg\"></p>",
          "version": "1.0.0",
          "main": "gulpfile.js",
          "directories": {
            "doc": "docs",
            "test": "tests"
          },
          "author": "",
          "license": "ISC"
        }

        이렇게 잘 되어있습니다. 그리고 노드모듈에도 잘 깔려져있구요.

        이건 gulpfile의 일부입니다.   아까 개발자도구에 제이쿼리 오류도 나는데 이유를 모르겟습니다.

        이것은 app.js 입니다. 그대로 복사해서 넣었습니다!

        /**
         * First we will load all of this project's JavaScript dependencies which
         * include Vue and Vue Resource. This gives a great starting point for
         * building robust, powerful web applications using Vue and Laravel.
         */
        
        require('./bootstrap');
        
        Vue.component('example', require('./components/Example.vue'));
        
        const app = new Vue({
          el: 'body',
        
          ready() {
            hljs.initHighlightingOnLoad();
            this.removeFlashMessages();
            this.setJqueryAjaxHeaders();
          },
        
          methods: {
            removeFlashMessages() {
              if ($('.alert')) {
                $('.alert').delay(5000).fadeOut();
              }
            },
        
            setJqueryAjaxHeaders() {
              $.ajaxSetup({
                headers: {
                  'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
              });
            }
          }
        });
        
        
        

        그리고 이상한게 gulp를 했을때 오류가 많이 납니다. 

        resources/assets/js/bootstrap.js는 분명히 있습니다!! 도와주십쇼 이게 안되서 시간을 너무 많이 잡아먹습니다..

      4. 김주원

        라라벨 버전이 뭐죠? 책에 실린 코드는 모두 라라벨 5.3과 Vue.js 1 버전을 사용합니다. 그림으로 봐서는 Vue.js 2를 사용한 것으로 추정되는데 아래 링크의 package.json을 참고해서 버전을 수정해주세요.


        https://github.com/appkr/l5code/blob/443c010666eeb0baf6fa152307527cd48d28ab7c/package.json


        bootstrap.js는 아래를 참고하세요.

        https://github.com/appkr/l5code/blob/443c010666eeb0baf6fa152307527cd48d28ab7c/resources/assets/js/bootstrap.js

        app.js의 

        Vue.component('example', require('./components/Example.vue'));

        부분은 삭제해주세요.

      5. 이용준

        라라벨은 5.4.18 버전입니다.   저기 vue 컴포넌트 에러를 구글링 해보니 vue.js2를 쓰라고 해서 한번 시도해봤는데 안되더라구요.. 그래서 저렇게 해보았는데 역시 안됬습니다ㅠㅠ 

        Vue.component('example', require('./components/Example.vue')); 

        이부분 지우고 해보겟습니다.


      6. 이용준
        Vue.component('example', require('./components/Example.vue')); 

        이부분을 지우고 해도 위와 똑같은 오류가 납니다ㅠㅠ

        이렇게해도 에러가 납니다ㅠㅠ jquery는 왜 인식을 갑자기 또 못하는건지ㅠ

      CommentAdd your comment...