ThinkPHP6의 서식 있는 텍스트 편집기에 이미지를 업로드하는 방법은 무엇입니까?-ThinkPHP-php.cn

ThinkPHP6은 뛰어난 PHP 프레임워크로서 풍부한 운영 라이브러리와 도구를 제공하여 개발자가 기능적 요구 사항을 더 빠르게 실현할 수 있도록 해줍니다. 웹 개발에서 서식 있는 텍스트 편집기는 사용자가 콘텐츠를 보다 편리하게 편집하는 데 도움이 되는 필수 도구 중 하나로 사용되는 경우가 많습니다. 그러나 사용자가 사진을 삽입하려면 사진 업로드 기능 지원이 필요합니다.

이 기사에서는 UMEditor를 예로 들어 ThinkPHP6에서 서식 있는 텍스트 편집기의 이미지 업로드 기능을 구현하는 방법을 소개합니다.

1단계: UMEditor 소개

UMEditor의 리소스 파일(js, css, 이미지 등 포함)을 프로젝트 디렉터리 아래의 public 디렉터리에 넣은 다음 HTML 페이지에 UMEditor의 관련 리소스 파일을 도입합니다. 예는 다음과 같습니다.

로그인 후 복사

2단계: 이미지 업로드 인터페이스 작성

ThinkPHP6에서는 Route 클래스와 Controller 클래스를 통해 인터페이스 작성이 가능합니다.

다음 코드를 사용하여 경로 디렉터리에 upload.php 파일을 만듭니다.


        
         로그인 후 복사

이 경로에 매핑된 컨트롤러 메서드는 업로드 컨트롤러의 uploadImage 메서드입니다.

앱 디렉터리에 api 디렉터리를 만든 다음 api 디렉터리에 업로드 컨트롤러와 UploadService 서비스를 만듭니다. 코드는 다음과 같습니다.

업로드 컨트롤러:

uploadImage($file); return json($result); } }

로그인 후 복사

UploadService 서비스:

putFile('images', $file); $url = Config::get("filesystem.disks.{$storage}.url") . '/' . str_replace('\', '/', $savename); return [ 'state' => 'SUCCESS', 'url' => $url, 'title' => '', 'original' => $file->getOriginalName(), 'type' => $file->getOriginalExtension(), 'size' => $file->getSize(), ]; } }

로그인 후 복사

In UploadService , 이미지 업로드 목적을 달성하기 위해 ThinkPHP6에서 제공하는 파일 저장 기능을 사용했습니다. 특정 구현에서는 Filesystem 클래스와 Config 클래스를 사용합니다. 구성 파일 config/filesystem.php에서 해당 저장 방법과 경로를 구성해야 합니다.

3단계: UMEditor 구성