Specific steps for using paging, file uploading, and jquery in springboot

Pagination :

　　pom.xml plus dependencies

<dependency>
        <groupId>com.github.pagehelper</groupId>
        <artifactId>pagehelper-spring-boot-starter</artifactId>
        <version>1.1.2</version>
 </dependency>

  In the method in the Service

public PageInfo<User> findAll(int page,int size) {
        PageHelper.startPage(page,size);
        //The source code remains unchanged 
        PageInfo <User> model= new PageInfo<> (collection);
         return model;
}

　　applicattion.yml 中

#pagehelperPagination Plugin
pagehelper:
    helperDialect: mysql
    reasonable: true
    supportMethodsArguments: true
    params: count=countSql

File upload :

　　　　Add dependencies to pom.xml

<dependency>
            <groupId>com.github.tobato</groupId>
            <artifactId>fastdfs-client</artifactId>
            <version>1.25.2-RELEASE</version>
</dependency>

　　　　Total configuration application.properties

#fastdfs2
fdfs.soTimeout =1500 
fdfs.connectTimeout =600 
fdfs.thumbImage.width =150 
fdfs.thumbImage.height =150 
fdfs.trackerList[ 0]=192.168.25.133:22122 #The default is port 22122 
fdfs.prefixpath = http: // 192.168.25.133/ #This is the file management server ip

　　　　Controller

@CrossOrigin(origins = "*", maxAge = 360)//Set the maximum upload value 
@Controller 
public class userAction {

　 @Value("${fdfs.prefixpath}")
   private String prefixpath;



　　// Image upload 
    @RequestMapping("/upload" )
    @ResponseBody
    public Map<String,Object> upload(MultipartFile file) throws Exception {
        String exname = file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf(".") + 1);
        StorePath storePath = storageClient.uploadFile(file.getInputStream(), file.getSize(), exname, null);
        String url = prefixpath + storePath.getFullPath();
        System.out.println(url);
        Map<String,Object> map=new HashMap<>();
        map.put("urls",url);
        System.out.println("----"+map.get("urls"));
        return map;
    }

　　　　html page

<body>

    <form action="addUser" method="post">
        <input type="hidden" id='photo' name='photo'/>
        <table>
            <tr>
                <td>用户名</td>
                <td><input type="text" name="uname"/></td>
            </tr>
            <tr>
                <>td</password>td
                <td><input type="text" name="password"/></td>
            </tr>
            <tr>
                <td>生日</td>
                <td><input type="date" name="birthday"/></td>
            </tr>
            <tr>
                <td>头像</td>
                <td><input type='file' id='file' name='file' form="pff" />
                    <a id='yla' href='' target='_blank'><img id='ylm' src='' width="200px" height="200px"/></a>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="submit" value="提交"/>
                </td>
            </tr>
        </table>
    </form>
    <form id='pff' method="post" enctype="multipart/form-data" th:action="@{upload}">
    </form>
</body>

<script type="text/javascript" src="/webjars/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="/jquery.form.min.js"></script>
<script type="text/javascript">
    $("#file").change(function(){
        alert(this.value);
        if(this.value!=''){
            $( ' #pff ' ).ajaxSubmit({
                type:'post',
                dataType:'json',
                success:function(data){
                    alert(data.urls);
                        $("#yla").attr("href",data.urls);
                        $("#ylm").attr("src",data.urls);
                        $("#photo").attr("value",data.urls);
                }
            });
        }
    })
</script>

jQuery

　　Add dependencies to pom.xml

　　　　　<!--jquer-->
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>jquery</artifactId>
            <version>2.1.4</version>
        </dependency>

　　html page, import

<script type="text/javascript" src="/webjars/jquery/2.1.4/jquery.min.js"></script>

Specific steps for using paging, file uploading, and jquery in springboot

Guess you like