spring定時任務-文件上傳進度條

spring定時任務

導依賴

<!-- https://mvnrepository.com/artifact/org.quartz-scheduler/quartz -->
    <dependency>
        <groupId>org.quartz-scheduler</groupId>
        <artifactId>quartz</artifactId>
        <version>2.2.3</version>
    </dependency>
複製代碼

配置定時任務類

package com.atguigu.scw.portal.service;
    
    import org.springframework.stereotype.Service;
    
    @Service
    public class ExampleJob {
    
        public void hello() {
            System.out.println("定時任務觸發===========>");
        }
    
    }
複製代碼

配置定時任務

<?xml version="1.0" encoding="UTF-8"?>
    <beans xmlns="http://www.springframework.org/schema/beans"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xmlns:context="http://www.springframework.org/schema/context"
        xmlns:mvc="http://www.springframework.org/schema/mvc"
        xsi:schemaLocation="http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.3.xsd
            http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
            http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.3.xsd">
    
    
    
        <!-- <bean id="exampleJob"
            class="com.atguigu.scw.portal.service.ExampleJob"></bean> -->
    
        <!--配置定時任務觸發類和方法  -->
        <bean id="jobDetail"
            class="org.springframework.scheduling.quartz.MethodInvokingJobDetailFactoryBean">
            <property name="targetObject" ref="exampleJob" />
            <property name="targetMethod" value="hello" />
        </bean>
    
    
        <!--配置觸發器，指定什麼時候觸發 -->
        <bean id="cronTrigger"
            class="org.springframework.scheduling.quartz.CronTriggerFactoryBean">
            <property name="jobDetail" ref="jobDetail" />
            <!-- run every morning at 6 AM -->
            <property name="cronExpression" value="*/5 * * * * ?" />
        </bean>
    
    
        <!--配置定時任務調用哪個觸發器  -->
        <bean
            class="org.springframework.scheduling.quartz.SchedulerFactoryBean">
            <property name="triggers">
                <list>
                    <ref bean="cronTrigger" />
                </list>
            </property>
        </bean>
    </beans>

複製代碼

cron表達式使用

每隔5秒執行一次：*/5 * * * * ?
每隔1分鐘執行一次：0 */1 * * * ?
天天23點執行一次：0 0 23 * * ?
天天凌晨1點執行一次：0 0 1 * * ?
每個月1號凌晨1點執行一次：0 0 1 1 * ?
每個月最後一天23點執行一次：0 0 23 L * ?
每週星期天凌晨1點實行一次：0 0 1 ? * L
在26分、29分、33分執行一次：0 26,29,33 * * * ?
天天的0點、13點、18點、21點都執行一次：0 0 0,13,18,21 * * ?
複製代碼

參考

docs.spring.io/spring/docs…

文件上傳進度條

ajax異步提交表單$("#subBtn").on('click', function() { return false}是js對象的機制

Submit點擊按鈕直接提交是瀏覽器的機制

文件上傳

表單直接提交action='${ctp}/member/upload' method='post' enctype="multipart/form-data"

<form action='${ctp}/member/upload' method='post' enctype="multipart/form-data">
        <div class="form-group">
            <input type="file" class="form-control" id="file" name='file'>
        </div>
        <div class="progress">
            <div class="progress-bar" role="progressbar" aria-valuenow="60"
                aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
                60%</div>
        </div>
        <button type="submit" id='subBtn' class="btn btn-default">Submit</button>
    </form>複製代碼

ajax提交type : "post",contentType : false,processData : false

進度條:獲取myXhr = $.ajaxSettings.xhr()對象並返回

<form id='submitForm'>
        <div class="form-group">
            <input type="file" class="form-control" id="file" name='file'>
        </div>
        <div class="progress" style='display: none;'>
            <div class="progress-bar" role="progressbar" aria-valuenow="0"
                aria-valuemin="0" aria-valuemax="100" style="width: 0%;">0%</div>
        </div>
        <button type="submit" id='subBtn' class="btn btn-default">Submit</button>
    </form>
    
    <script type="text/javascript">
        $("#subBtn").on('click', function() {
            var fd = new FormData($("#submitForm")[0]);
            $.ajax({
                url : "${ctp}/member/upload",
                data : fd,
                type : "post",
                contentType : false,
                processData : false,
                //獲取ajaxSettings中的xhr對象，爲它的upload屬性綁定progress事件的處理函數  
                xhr : function() {
                    myXhr = $.ajaxSettings.xhr()
                    //檢查upload屬性是否存在  
                    if (myXhr.upload) {
                        //綁定progress事件的回調函數  
                        myXhr.upload.addEventListener('progress',
                                progressHandlingFunction, false)
                    }
                    //xhr對象返回給jQuery使用  
                    return myXhr;
                },
                success : function(result) {
                    console.log("result==========>", result)
                },
                error : function(e) {
                    console.log('e=========>', e)
                }
            })
            return false
        })
        var progressHandlingFunction = function(e) {
            var curr = e.loaded
            var total = e.total
            process = curr / total * 100
            console.log('上傳進度============>', process)
            $('.progress').attr('style', 'display:show;')
            $('.progress-bar').html(process + '%')
            $('.progress-bar').attr('style', 'width:' + process + '%;')

        }
    </script>
複製代碼

圖片預覽

$("#ad_file_input").on('change', function(event) {
        $(this).empty()
        $(this).parent('.form-group').next('.form-group').find('.imgdiv').empty()
        
        fileList = event.currentTarget.files
        log('fileList==============>', fileList)
        
        var URL = window.URL || window.webkitURL
        var imgURL
        //遍歷上傳的文件進行顯示 
        $.each(fileList, function (index, item) {
            //建立一個臨時的url地址
           imgURL = URL.createObjectURL(item)
           log('this=========>',this)
           log('item==========>',item)
           $('#ad_file_input').parent(".form-group").next(".form-group").find(".imgdiv").append("<img src='"+imgURL+"' style='width:200px;height:220px;'/>").append('<p>'+item.name+'<p>')
        })
    })
複製代碼