summernote 上傳圖片到圖片服務器的解決方案(springboot 成功)


遇到的可以連接成功但是拒絕登錄的問題

前提說一下,我自己在自己的服務器上配置了nginx的反向代理,所以請求的時候才會直接寫的是我的ip地址,要配置nginx的話,可以看我的nginx的筆記

當代碼感覺沒有問題的時候,但還是無法上傳,首先問自己是不是被拒絕登陸了(還真是)

這個問題是當你使用特定的用戶的時候才會被拒絕請求

可以在ftpusers & user_list 中把你用到的用戶給注釋掉(不建議這么干,不能保證安全性)

1.首先檢查系統是否開啟了vsftp服務,如果沒有開啟,先開啟該服務。

2.查看配置

vsftpd的配置,配置文件中限定了vsftpd用戶連接控制配置。
vsftpd.ftpusers:位於/etc/vsftpd目錄下。它指定了哪些用戶賬戶不能訪問FTP服務器,例如root等。
vsftpd.user_list:位於/etc/vsftpd目錄下。該文件里的用戶賬戶在默認情況下也不能訪問FTP服務器,僅當vsftpd .conf配置文件里啟用userlist_enable=NO選項時才允許訪問。
vsftpd.conf:位於/etc/vsftpd目錄下。來自定義用戶登錄控制、用戶權限控制、超時設置、服務器功能選項、服務器性能選項、服務器響應消息等FTP服務器的配置。

3.配置修改完成后,執行service vsftpd restart重啟vsftpd服務。

下面是正式的代碼

前台代碼

用到的富文本編輯器是summernote前端代碼如下

用到的雲服務器是阿里雲的Centos 7

window.onload = function () {
        var summernote = $('.summernote').summernote({
            lang: 'zh-CN',
            height: 300,
            minHeight: 300,
            placeholder: '請輸入通知的內容',
            callbacks: { // 回調函數
                // 上傳圖片時使用的回調函數
                onImageUpload: function (files, editor, $editable) {
                    console.log(files)
                    sendFile(files[0], editor, $editable);
                }
            },
          
        });
        
        function sendFile(files, editor, welEditable) {
            data = new FormData();
            data.append("file", files);
            $.ajax({
                data: data,
                type: "POST",
                url: '/image/notice_add',
                //請求路徑
                cache: false,
                contentType: false,
                processData: false,
                dataType: "json",
                success: function (data) {
                    alert(data.message)
                    // data.message
                    let url = 'http://xxx.xxx.xxx.xxx/';
                    //上面是服務器的地址
                    $('.summernote').summernote('insertImage',url+data.message);  
                    //xxx的地方是圖片url的前綴 key為上傳后圖片的名字
                },error:
                    function (url) {
                        alert(JSON.stringify(url.message))
                    }
            });
        }

后台代碼(springboot)

首先是用到的工具類FtpFileUtil

public class FtpFileUtil {

    //ftp服務器ip地址
    private static final String FTP_ADDRESS = "39.96.11.225";
    //端口號
    private static final int FTP_PORT = 21;
    //用戶名 這里用到的是root 可以切合上面遇到的問題,實際開發中需要單獨創建一個用戶
    private static final String FTP_USERNAME = "root";
    //密碼
    private static final String FTP_PASSWORD = "XXXXXXXXXX";
    //圖片路徑
    private static final String FTP_BASEPATH = "/soft/code/images";

    public  static boolean uploadFile(String originFileName, InputStream input){
        boolean success = false;
        FTPClient ftp = new FTPClient();
        ftp.setControlEncoding("GBK");
        try {
            int reply;
            ftp.connect(FTP_ADDRESS, FTP_PORT);// 連接FTP服務器

            ftp.login(FTP_USERNAME, FTP_PASSWORD);// 登錄

            reply = ftp.getReplyCode();
            if (!FTPReply.isPositiveCompletion(reply)) {
                ftp.disconnect();

                return success;
            }
            ftp.setFileType(FTPClient.BINARY_FILE_TYPE);
            ftp.makeDirectory(FTP_BASEPATH );
            ftp.changeWorkingDirectory(FTP_BASEPATH );
            ftp.storeFile(originFileName,input);

            input.close();
            ftp.logout();
            success = true;
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            if (ftp.isConnected()) {
                try {
                    ftp.disconnect();
                } catch (IOException ioe) {
                }
            }
        }
        return success;
    }
}

上傳比較大的圖片的時候需要在springboot下配置ImageResolverConfig

@Configuration
public class ImageResolverConfig {
    @Bean
    public MultipartResolver multipartResolver() {
        CommonsMultipartResolver resolver=new CommonsMultipartResolver();
//        resolver.setDefaultEncoding("utf-8");
        resolver.setMaxInMemorySize(1048576);
        resolver.setMaxUploadSize(20971520);
        return resolver;
    }
}
@RestController
@RequestMapping("/image/")
public class ImageUploadController {

    @ResponseBody
    @RequestMapping(value = "notice_add", headers = ("content-type=multipart/*"), method = RequestMethod.POST)
    public ResponseResult MyselfImageUpload(@RequestParam("file") CommonsMultipartFile file, HttpServletRequest request){
        try {
            String path = ImageUploadPathConstant.UPLOAD_PATH;
            String fileName = UUID.randomUUID().toString().replace("-", "") + file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf("."));
            // File destFile = new File(path + "/" + fileName);
            // FileUtils.copyInputStreamToFile(file.getInputStream(), destFile);
            //上面代碼是拷貝到本地的,但是因為感覺並不人性化,所以采取了上傳到圖片服務器的思路
            InputStream inputStream=file.getInputStream();

            // String url = destFile.getAbsolutePath();

            String url = null;
            Boolean flag= FtpFileUtil.uploadFile(fileName,inputStream);
            if(flag){
                url = fileName;
            }
		//ResponseResult 是一個進行結果封裝的類
           
            return  ResponseResult.success(url);
        }catch (Exception e){
            return  null;
        }

    }

}

ResponseResult //這個類可以不進行使用,但是為了系統的其他功能的使用,盡量加上。用於結果的封裝

public class ResponseResult {

    //狀態碼
    private int status;

    //消息
    private String message;

    //返回數據
    private Object data;

    public ResponseResult(int status, String message, Object data) {
        this.status = status;
        this.message = message;
        this.data = data;
    }

    //成功
    public static ResponseResult success(Object data) {
        return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_SUCCESS, "success", data);
    }

    public static ResponseResult success(String message) {
        return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_SUCCESS, message, null);
    }

    public static ResponseResult success() {
        return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_SUCCESS, "success", null);
    }

    //失敗
    public static ResponseResult fail() {
        return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_FAIL, "fail", null);
    }

    public static ResponseResult fail(Object data) {
        return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_FAIL, "fail", data);
    }

    public static ResponseResult fail(String message) {
        return new ResponseResult(ResponseStatusConstant.RESPONSE_STATUS_FAIL, message, null);
    }

    public int getStatus() {
        return status;
    }

    public void setStatus(int status) {
        this.status = status;
    }

    public String getMessage() {
        return message;
    }

    public void setMessage(String message) {
        this.message = message;
    }

    public Object getData() {
        return data;
    }

    public void setData(Object data) {
        this.data = data;
    }

}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM