天天看點

SpringCloud-Feign

1.先建立一pom個項目

2.在pom項目下面在建立三個子項目

SpringCloud-Feign

注冊中心pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>cn.ps</groupId>
		<artifactId>SPRINGCLOUD</artifactId>
		<version>0.0.1-SNAPSHOT</version>
	</parent>
	<artifactId>SPRINGCLOUD_CRETER</artifactId>
	<dependencies>
		<!-- 引入注冊中心 -->
		<dependency>
			<groupId>org.springframework.cloud</groupId>
			<artifactId>spring-cloud-starter-netflix-eureka-server</artifactId>
		</dependency>
	</dependencies>
	<!-- 不加此依賴打出來的jar包不可用,因為沒有第三方面的包 -->
	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
		</plugins>
	</build>
</project>
           

注冊中心main方法

package cn.ps;

import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.cloud.netflix.eureka.server.EnableEurekaServer;

@SpringBootApplication
@EnableEurekaServer
public class CenterController {
	public static void main(String[] args) {
        new SpringApplicationBuilder(CenterController.class).web(true).run(args);
    }
}
           

注冊中心application.yml檔案

server:
  #注冊中心端口号
  port: 8761

eureka:
  instance:
    #本機ip位址
    hostname: localhost
    #将來注冊到注冊中心的微服務包括注冊中心都是用ip位址
    preferIpAddress: true
  client:
    #是否注冊到注冊中心 注冊中心自己不需要注冊
    registerWithEureka: false
    #是否抓取注冊中心的注冊資訊
    fetchRegistry: false
    serviceUrl:
      #是微服務和用戶端用來注冊和發現的位址
      defaultZone: http://${eureka.instance.hostname}:${server.port}/eureka/
           

Service微服務pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>cn.ps</groupId>
		<artifactId>SPRINGCLOUD</artifactId>
		<version>0.0.1-SNAPSHOT</version>
	</parent>
	<artifactId>SPRINGCLOUD_SERVICE</artifactId>
	<dependencies>
		<!-- 引入微服務 -->
		<dependency>
			<groupId>org.springframework.cloud</groupId>
			<artifactId>spring-cloud-starter-eureka</artifactId>
		</dependency>

		<!-- 引入mysql驅動 -->
		<dependency>
			<groupId>mysql</groupId>
			<artifactId>mysql-connector-java</artifactId>
		</dependency>

		<!-- 引入資料源 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-data-jpa</artifactId>
		</dependency>
		
		<!-- 引入mybatis-plus -->
		<dependency>
			<groupId>com.baomidou</groupId>
			<artifactId>mybatis-plus-boot-starter</artifactId>
			<version>3.0.5</version>
		</dependency>

		<!-- 引入分頁插件 -->
		<dependency>
			<groupId>com.github.pagehelper</groupId>
			<artifactId>pagehelper</artifactId>
			<version>4.1.6</version>
		</dependency>

		<!-- 引入小辣椒 -->
		<dependency>
			<groupId>org.projectlombok</groupId>
			<artifactId>lombok</artifactId>
			<scope>provided</scope>
		</dependency>

	</dependencies>
</project>
           

入口ServiceMain

package cn.ps;

import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.cloud.netflix.eureka.EnableEurekaClient;
import org.springframework.cloud.netflix.feign.EnableFeignClients;
import org.springframework.web.bind.annotation.RestController;

@SpringBootApplication
@EnableEurekaClient
//啟動feign
@EnableFeignClients
@RestController
public class EmpService {
    public static void main(String[] args) {
        new SpringApplicationBuilder(EmpService.class).web(true).run(args);
    }
}
           

Service微服務application.yml檔案

eureka:
  instance:
    #将來注冊到注冊中心的微服務包括注冊中心都是用ip位址
    preferIpAddress: true
  client:
    #是否注冊到注冊中心 注冊中心自己不需要注冊
    registerWithEureka: true
    #是否抓取注冊中心的注冊資訊
    fetchRegistry: true
    serviceUrl:
      defaultZone: http://192.168.153.132:8761/eureka/
spring:
  application:
    name: empservice
  datasource:
    url: jdbc:mysql://localhost/unit02
    username: root
    password: ps123456
    driver-class-name: com.mysql.jdbc.Driver
server:
  port: 8899
           

控制層Controller

package cn.ps.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.DeleteMapping;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.PutMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RestController;
import cn.ps.entity.Emp;
import cn.ps.entity.Result;
import cn.ps.service.EmpService;

@RestController
public class EmpController {
	
	@Autowired
	EmpService es;
	
	@GetMapping(value="/emps")
	public Result queryEmp(String ename,String page,String limit) {
		try {
			Result queryEmp = es.queryEmp(ename, page, limit);
			return queryEmp;
		} catch (Exception e) {
			e.printStackTrace();
		}
		return null;
	}
	
	@PostMapping(value="/emp")
	public Result addEmp(@RequestBody Emp emp) {
		Result result = new Result();
		try {
			es.addEmp(emp);
		} catch (Exception e) {
			result.setCode(1);
			result.setMsg("新增出錯:"+e.getMessage());
		}
		return result;
	}
	
	@DeleteMapping(value="/emp/{empno}")
	public Result delEmp(@PathVariable("empno") String empno) {
		Result result = new Result();
		try {
			es.delEmp(empno);
		} catch (Exception e) {
			result.setCode(1);
			result.setMsg("删除出錯:"+e.getMessage());
		}
		return result;
	}
	
	@PutMapping(value="/emp")
	public Result update(@RequestBody Emp emp) {
		Result result=new Result();
		try{
			es.update(emp);
		}catch (Exception e){
			result.setCode(1);
			result.setMsg("修改出錯:"+e.getMessage());
			
		}
		return result;
	}
	
}
           

實體類entiry

Emp

package cn.ps.entity;

import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import lombok.Data;
import lombok.NoArgsConstructor;

@Data
@NoArgsConstructor
//表名
@TableName("epm")
public class Emp {
	//mysql主鍵自動生成,不加可能會報讀取逾時
	@TableId(type=IdType.AUTO)
	private String empno;
	private String ename;
	private String sal;
	private String phone;
	private String email;
}
           

Result

package cn.ps.entity;

import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import lombok.Data;
import lombok.NoArgsConstructor;

@Data
@NoArgsConstructor
//表名
@TableName("epm")
public class Emp {
	//mysql主鍵自動生成,不加可能會報讀取逾時
	@TableId(type=IdType.AUTO)
	private String empno;
	private String ename;
	private String sal;
	private String phone;
	private String email;
}
           

自動寫sql語句Mapper

package cn.ps.mapper;

import org.apache.ibatis.annotations.Mapper;
import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import cn.ps.entity.Emp;

@Mapper
public interface EmpMapper extends BaseMapper<Emp>{
	
}
           

接口實作ServiceImpl

package cn.ps.service.impl;

import org.apache.commons.lang.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.web.bind.annotation.DeleteMapping;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.PutMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestParam;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.core.metadata.IPage;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import cn.ps.entity.Emp;
import cn.ps.entity.Result;
import cn.ps.mapper.EmpMapper;
import cn.ps.service.EmpService;

@Service
public class EmpServiceImpl implements EmpService {

	@Autowired
	EmpMapper em;
	
	@GetMapping(value="/emps")
	public Result queryEmp(String ename, String page,String limit) {
		if(StringUtils.isEmpty(ename)) {
			ename="";
		}
		//拼接like查詢條件
		QueryWrapper<Emp> qw=new QueryWrapper();
		qw.like("ename", ename);
		//目前頁數
		int curPageI=Integer.parseInt(page);
		//目前條數
		int pageNumI=Integer.parseInt(limit);
		//進行分頁和條件查詢
		IPage<Emp> pageData=em.selectPage(new Page(curPageI,pageNumI), qw);
		Result result =new Result();
		result.setCode(0);
		result.setCount((int)pageData.getTotal());
		result.setData(pageData.getRecords());
		return result;
	}
	
	@PostMapping(value="/emp")
	public void addEmp(@RequestBody Emp emp) {
		em.insert(emp);
	}
	
	@DeleteMapping(value="/emp/{empno}")
	public void delEmp(@PathVariable("empno") String empno) {
		em.deleteById(empno);
	}
	
	@PutMapping(value="/emp")
	public void update(@RequestBody Emp emp) {
		em.updateById(emp);
	}
	
}
           

工具類utils

分頁掃描

package cn.ps.utils;

import com.baomidou.mybatisplus.extension.plugins.PaginationInterceptor;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.transaction.annotation.EnableTransactionManagement;

//Spring boot方式
@EnableTransactionManagement
@Configuration
@MapperScan("cn.ps.controller.*.*")
public class ConfBean {
    @Bean
    public PaginationInterceptor paginationInterceptor() {
        return new PaginationInterceptor();
    }
}
           

View微服務pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>cn.ps</groupId>
		<artifactId>SPRINGCLOUD</artifactId>
		<version>0.0.1-SNAPSHOT</version>
	</parent>
	<artifactId>SPRINGCLOUD_EMPVIEW</artifactId>
	<dependencies>
		<!-- 引入微服務 -->
		<dependency>
			<groupId>org.springframework.cloud</groupId>
			<artifactId>spring-cloud-starter-eureka</artifactId>
		</dependency>

		<!-- 引入小辣椒 -->
		<dependency>
			<groupId>org.projectlombok</groupId>
			<artifactId>lombok</artifactId>
			<scope>provided</scope>
		</dependency>

		<!-- 引入feign -->
		<dependency>
			<groupId>org.springframework.cloud</groupId>
			<artifactId>spring-cloud-starter-openfeign</artifactId>
		</dependency>

	</dependencies>
</project>
           

入口ViewMain

package cn.ps;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.cloud.netflix.feign.EnableFeignClients;

@SpringBootApplication
//掃描Feign
@EnableFeignClients
public class EmpView {
	
	 public static void main(String[] args) {
	        SpringApplication.run(EmpView.class, args);
	 }
	 
}
           

View微服務application.yml

eureka:
  instance:
    #将來注冊到注冊中心的微服務包括注冊中心都是用ip位址
    preferIpAddress: true
  client:
    #是否注冊到注冊中心 注冊中心自己不需要注冊
    registerWithEureka: true
    #是否抓取注冊中心的注冊資訊
    fetchRegistry: true
    serviceUrl:
      defaultZone: http://192.168.153.132:8761/eureka/
spring:
  application:
    name: empview
server:
  #程式入口使用80端口
  port: 80
           

控制層Controller

package cn.ps.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.DeleteMapping;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.PutMapping;
import org.springframework.web.bind.annotation.RestController;
import cn.ps.entity.Emp;
import cn.ps.entity.Result;
import cn.ps.feign.EmpFeign;

@RestController
public class EmpController {
	
	@Autowired
	EmpFeign ef;
	
	@GetMapping(value="/emps")
	public Result queryEmp(String ename,String page,String limit){
		Result queryEmp = ef.queryEmp(ename,page,limit);
		return queryEmp;
	}
	
	@PostMapping(value="/emp")
	public Result addEmp(Emp emp) {
		Result result = new Result();
		ef.addEmp(emp);
		return result;
	}
	
	@DeleteMapping(value="/emp/{empno}")
	public Result delEmp(@PathVariable("empno") String empno) {
		Result result = new Result();
		ef.delEmp(empno);
		return result;
	}
	
	@PutMapping(value="/emp/{empno}")
	public Result updEmp(@PathVariable("empno") String empno, Emp emp) throws Exception {
		Result result=new Result();
		emp.setEmpno(empno);
		ef.update(emp);
		return result;
	}
	
}
           

Feign調用Service微服務的控制層

注意:必須加注解不加調用不了

package cn.ps.feign;

import org.springframework.cloud.netflix.feign.FeignClient;
import org.springframework.web.bind.annotation.DeleteMapping;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.PutMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestParam;

import cn.ps.entity.Emp;
import cn.ps.entity.Result;

關聯Service微服務
@FeignClient(name = "EMPSERVICE")
public interface EmpFeign {
	
	@GetMapping(value="/emps")
	public Result queryEmp(@RequestParam("ename") String ename,@RequestParam("page") String page,@RequestParam("limit") String limit);
	
	@PostMapping(value="/emp")
	public void addEmp(@RequestBody Emp emp);
	
	@DeleteMapping(value="/emp/{empno}")
	public void delEmp(@PathVariable("empno") String empno);
	
	@PutMapping(value="/emp")
	public void update(@RequestBody Emp emp);
	
}
           

實體類對應Service服務的實體類可不加@TableId

前端layui

在resources下

建立一個static檔案(可以是static或者public)

在static下建立一個html放入一下代碼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="resources/layui/css/layui.css">
    <script src="resources/layui/layui.js"></script>
    <script type="text/javascript" src="jquery-3.3.1.js"></script>
    <script>

       layui.use('form',function () {
           var form = layui.form;
           form.on('submit(myForm)', function(data){
               layui.table.reload('empTable', {
                   url: 'emps'
                   ,where: data.field
                   ,page: curr = 1
               });
               return false;
           });

           form.on('submit(addForm)', function(data){
               $.ajax({
                   url:'emp',
                   dataType:'json',
                   type:'post',
                   data:data.field,
                   success:function (da) {
                       if(da.code==0){
                           alert("新增成功");
                           layer.close(addWindow);
                           layui.table.reload('empTable', {
                               url: 'emps'
                           });
                       }else{
                           alert(da.msg);
                       }
                   }
               })
               return false;
           });

           form.on('submit(updateForm)', function(data){
               data.field["_method"]="put";
               $.ajax({
                   url:'emp/'+data.field.empno,
                   dataType:'json',
                   type:'post',
                   data:data.field,
                   success:function (da) {
                       if(da.code==0){
                           alert("修改成功");
                           layer.close(addWindow);
                           layui.table.reload('empTable', {
                               url: 'emps'
                           });
                       }else{
                           alert(da.msg);
                       }
                   }
               })
               return false;
           });


       })

        layui.use('table', function(){
            var table = layui.table;
            //第一個執行個體
            table.render({
                elem: '#empTable'
                ,height: 312
                ,url: 'emps' //資料接口
                ,page: true //開啟分頁
                ,cols: [[ //表頭
                    {field: 'empno', title: '雇員編号', width:160, sort: true, fixed: 'left'}
                    ,{field: 'ename', title: '名稱', width:160}
                    ,{field: 'sal', title: '薪水', width:160}
                    ,{field: 'email', title: '郵箱', width: 160}
                    ,{field: 'phone', title: '手機号碼', width: 160, sort: true}
                    ,{field: 'dle', title: '操作', width: 160, sort: true,templet: function(d){
                            var data = JSON.stringify(d);
                            return "<button onclick='empDelete("+d.empno+")' >删除</button> " +
                                "<button onclick=\"empUpdate(this)\" data='"+data+"' >修改</button>" ;
                        }}
                ]]
            });
        });

       function empUpdate(_this) {
           var data = JSON.parse($(_this).attr("data"));
          // var source = JSON.parse(event.srcElement.getAttribute("data"));
           layui.use('layer', function() {
               addWindow = layer.open({
                   type: 1,
                   area:['500px','450px'],
                   content: $("#updateForm")
               });
           });
           layui.form.val("updateForm",data);
       }

       var addWindow = null;
        function empAdd() {
            layui.use('layer', function() {
                addWindow = layer.open({
                    type: 1,
                    area:['500px','450px'],
                    content: $("#addForm")
                });
            });
        }
        function empDelete(empno) {
            $.ajax({
                url:'emp/'+empno,
                dataType:'json',
                type:'post',
                data:{
                    "_method":"delete"
                },
                success:function (da) {
                    if(da.code==0){
                        alert("删除成功");
                        layui.table.reload('empTable', {
                            url: 'emps'
                        });
                    }else{
                        alert(da.msg);
                    }
                }
            })
            return false;
        }

    </script>
</head>
<body>
<form class="layui-form" action="">
    <div class="layui-inline">
        <label class="layui-form-label">雇員名稱</label>
        <div class="layui-input-inline" style="width: 200px;">
            <input type="text" name="ename" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-input-inline" style="width: 100px;">
            <button class="layui-btn" lay-submit lay-filter="myForm">查詢</button>
        </div>
        <div class="layui-input-inline" style="width: 100px;">
            <a href="javascript:empAdd()" class="layui-btn" >新增</a>
        </div>
    </div>
</form>

<table id="empTable" lay-filter="test"></table>
</body>
</html>

<form id="addForm" class="layui-form" style="display: none" >
    <div class="layui-form-item">
        <label class="layui-form-label">名稱</label>
        <div class="layui-input-block">
            <input type="text" name="ename"   lay-verify="required" placeholder="請輸入名稱" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">薪水</label>
        <div class="layui-input-block">
            <input type="text" name="sal"  lay-verify="number" placeholder="請輸入薪水" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">郵箱</label>
        <div class="layui-input-block">
            <input type="text" name="email"  lay-verify="email" placeholder="請輸入郵箱" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手機号碼</label>
        <div class="layui-input-block">
            <input type="text" name="phone"  lay-verify="phone" placeholder="請輸入标題" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="addForm">立即送出</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>



<!-- 修改 -->
<form id="updateForm" class="layui-form" lay-filter="updateForm" style="display: none" >
    <input type="hidden" name="empno">
    <div class="layui-form-item">
        <label class="layui-form-label">名稱</label>
        <div class="layui-input-block">
            <input type="text"  name="ename"   lay-verify="required" placeholder="請輸入名稱" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">薪水</label>
        <div class="layui-input-block">
            <input type="text" name="sal"  lay-verify="number" placeholder="請輸入薪水" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">郵箱</label>
        <div class="layui-input-block">
            <input type="text" name="email"  lay-verify="email" placeholder="請輸入郵箱" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手機号碼</label>
        <div class="layui-input-block">
            <input type="text" name="phone"  lay-verify="phone" placeholder="請輸入标題" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="updateForm">立即送出</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
           

繼續閱讀