【Spring Cloud 五】OpenFeign服务调用

这里写目录标题

  • 系列文章目录
  • 背景
  • 一、OpenFeign是什么
    • Feign是什么
      • Feign的局限性
    • OpenFeign是什么
  • 二、为什么要有OpenFeign
  • 三、如何使用OpenFeign
    • 服务提供者order-service
      • pom文件
      • yml配置文件
      • 启动类
      • 实体
      • ParamController
    • 服务消费者user-service
      • pom文件
      • yml配置文件
      • 启动类
      • 接口类
      • UserController
    • 运行效果
  • 调用超时配置
  • 五、OpenFeign调用参数的处理
  • 六、OpenFeign日志打印功能
  • 总结

系列文章目录

【Spring Cloud一】微服务基本知识
【Spring Cloud 三】Eureka服务注册与服务发现
【Spring Cloud 四】Ribbon负载均衡

背景

目前开发的项目其微服务之间的调用方式使用的就是OpenFeign的方式,为了更加的体会到它代码的便捷和高效,所以博主对OpenFeign进行了再次学习和实践,加强对OpenFeign的整体理解。

一、OpenFeign是什么

在了解OpenFeign之前我们先来了解Feign,因为OpenFeign和Feign之间是一种继承关系。

Feign是什么

Feign是一个声明式的模块化的HTTP客户端工具,他是由Netflix开发。它简化了在Java应用中编写HTTP请求的方式,能够让开发者可以通过简单的注解来定义对其他服务的RESTFul调用,从而避免编写繁琐的HTTP请求。

在传统的HTTP客户端中,我们通常需要手动构建HTTP请求,包括设置请求的URL,方法、请求头、请求体等。而使用Feign,你只需要定义一个接口,并在接口的方法上添加注解,就可以实现对其他服务的调用。Feign在运行时会根据接口定义自动创建代理实现,帮助你处理底层的HTTP请求细节。

Netflix的Feign默认集成了Eureka和Ribbon。

Feign的局限性

  1. NetFlix Feign不支持Spring MVC注解,如果在Spring Cloud使用Spring MVC注解的话,可以考虑使用Spring Cloud OpenFeign。
  2. NetFlix Feign在2018年宣布不再对其进行积极开发,虽然设计任然在维护和改进Feign但是毕竟不那么积极了。

OpenFeign是什么

OpenFeign也是一个HTTP客户端工具,它是基于Feign的封装和增强,使得在Spring Cloud环境中使用Feign更加强大和灵活。

  1. OpenFeign继承了Feign的声明式HTTP客户端的特性,允许开发者使用接口和注解来定义对其他服务的RESTful调用,从而简化了服务间通信的代码。

  2. OpenFeign还增加了一些功能,如自动负载均衡、而在Feign中,你需要手动使用Ribbon的相关注解来实现负载均衡。

  3. 支持熔断器:OpenFeign整合了Hystrix,提供了熔断器的功能,可以在服务不可用时快速失败,防止级联故障。这使得系统在面对服务故障时更加稳健。

在Spring Cloud项目中推荐使用OpenFeign来实现服务间通信,以获得更好的功能和集成性能。

二、为什么要有OpenFeign

为什么要有OpenFeign,它解决了什么问题。

  1. 相比较于传动发送HTTP请求,使用OpenFeign发送跨服务请求更加方便、灵活和高效。
  2. 更好的与Spring Cloud集成与其他组件(Eureka、Ribbon、Hystrix等)无缝集成,更加方便和高效。
  3. 自动负载均衡:OpenFeign整合了Ribbon,可以自动实现负载均衡,将请求分发给多个服务实例,提高了系统的可用性和性能。

三、如何使用OpenFeign

整个系统中有三个服务,Eurka服务,一个服务提供者,一个服务消费者。
在这里插入图片描述

如何搭建Eurka服务可以访问这篇博客【Spring Cloud 三】Eureka服务注册与服务发现

服务提供者order-service

pom文件

<?xml version="1.0" encoding="UTF-8"?>
<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 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.3.12.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.wangwei</groupId>
    <artifactId>order-service</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>order-service</name>
    <description>order-service</description>
    <properties>
        <java.version>8</java.version>
        <spring-cloud.version>Hoxton.SR12</spring-cloud.version>
    </properties>
    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.cloud</groupId>
            <artifactId>spring-cloud-starter-netflix-eureka-client</artifactId>
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>
    <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>org.springframework.cloud</groupId>
                <artifactId>spring-cloud-dependencies</artifactId>
                <version>${spring-cloud.version}</version>
                <type>pom</type>
                <scope>import</scope>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <excludes>
                        <exclude>
                            <groupId>org.projectlombok</groupId>
                            <artifactId>lombok</artifactId>
                        </exclude>
                    </excludes>
                </configuration>
            </plugin>
        </plugins>
    </build>

</project>

yml配置文件

server:
    port: 8080

spring:
    application:
        name: order-service

eureka:
    client:
        service-url: 
            defaultZone: http://localhost:8761/eureka
        register-with-eureka: true #设置为fasle 不往eureka-server注册
        fetch-registry: true #应用是否拉取服务列表到本地
        registry-fetch-interval-seconds: 10 #为了缓解服务列表的脏读问题,时间越短脏读越少 性能相应的消耗回答

    instance: #实例的配置
        instance-id: ${eureka.instance.hostname}:${spring.application.name}:${server.port}
        hostname: localhost #主机名称或者服务ip
        prefer-ip-address: true #以ip的形式显示具体的服务信息
        lease-renewal-interval-in-seconds: 10 #服务实例的续约时间间隔

启动类

@SpringBootApplication
@EnableEurekaClient
public class OrderServiceApplication {

    public static void main(String[] args) {
        SpringApplication.run(OrderServiceApplication.class, args);
    }

}

实体

@Data
@AllArgsConstructor
@NoArgsConstructor
@Builder
public class Order {

    private Integer id;
    private String name;
    private Double price;
    private Date time;

}

ParamController

@RestController
public class ParamController {

    @GetMapping("testUrl/{name}/and/{age}")
    public String testUrl(@PathVariable("name")String name ,@PathVariable("age")Integer age){
        System.out.println(name+":"+age);
        return "ok";
    }

    @GetMapping("oneParam")
    public String oneParam(@RequestParam(required = false)String name){
        System.out.println(name);
        return "ok";
    }

    @GetMapping("twoParam")
    public String twoParam(@RequestParam(required = false)String name,@RequestParam(required = false)Integer age){
        System.out.println(name+":"+age);
        return "ok";
    }

    @PostMapping("oneObj")
    public String oneObj(@RequestBody Order order){
        System.out.println(order);
        return "ok";
    }

    @PostMapping("oneObjOneParam")
    public String twoParam(@RequestBody Order order,@RequestParam("name")String name){
        System.out.println(order+":"+name);

        return "ok";
    }
}

服务消费者user-service

pom文件

<?xml version="1.0" encoding="UTF-8"?>
<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 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.3.12.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.wangwei</groupId>
    <artifactId>user-service</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>user-service</name>
    <description>user-service</description>
    <properties>
        <java.version>8</java.version>
        <spring-cloud.version>Hoxton.SR12</spring-cloud.version>
    </properties>
    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.cloud</groupId>
            <artifactId>spring-cloud-starter-netflix-eureka-client</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.cloud</groupId>
            <artifactId>spring-cloud-starter-openfeign</artifactId>
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>
    <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>org.springframework.cloud</groupId>
                <artifactId>spring-cloud-dependencies</artifactId>
                <version>${spring-cloud.version}</version>
                <type>pom</type>
                <scope>import</scope>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <excludes>
                        <exclude>
                            <groupId>org.projectlombok</groupId>
                            <artifactId>lombok</artifactId>
                        </exclude>
                    </excludes>
                </configuration>
            </plugin>
        </plugins>
    </build>

</project>

yml配置文件

server:
    port: 8081

spring:
    application:
        name: user-service

eureka:
  client:
    service-url: 
      defaultZone: http://localhost:8761/eureka
    register-with-eureka: true #设置为fasle 不往eureka-server注册
    fetch-registry: true #应用是否拉取服务列表到本地
    registry-fetch-interval-seconds: 10 #为了缓解服务列表的脏读问题,时间越短脏读越少 性能相应的消耗回答


  instance: #实例的配置
    instance-id: ${eureka.instance.hostname}:${spring.application.name}:${server.port}
    hostname: localhost #主机名称或者服务ip
    prefer-ip-address: true #以ip的形式显示具体的服务信息
    lease-renewal-interval-in-seconds: 10 #服务实例的续约时间间隔

启动类

package com.wangwei.userservice;

import feign.Logger;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.cloud.client.loadbalancer.LoadBalanced;
import org.springframework.cloud.netflix.eureka.EnableEurekaClient;
import org.springframework.cloud.openfeign.EnableFeignClients;
import org.springframework.context.annotation.Bean;
import org.springframework.web.client.RestTemplate;

@SpringBootApplication
@EnableEurekaClient
@EnableFeignClients //开启feign的客户端,才可以帮助我们发送调用
public class UserServiceApplication {

    public static void main(String[] args) {
        SpringApplication.run(UserServiceApplication.class, args);
    }
}

接口类

package com.wangwei.userservice.feign;

import com.wangwei.userservice.domain.Order;
import org.springframework.cloud.openfeign.FeignClient;
import org.springframework.web.bind.annotation.*;


/**
 * @FeignClient(value = "order-service")
 * value就是提供者的应用名称
 */
@FeignClient(value = "order-service")
public interface UserOrderFeign {

    /**
     * 你需要调用哪个controller 就写它的方法签名(除了方法体的一个方法的所有属性
     * @return
     */
    @GetMapping("doOrder")
     String doOrder();

    @GetMapping("testUrl/{name}/and/{age}")
    public String testUrl(@PathVariable("name")String name , @PathVariable("age")Integer age);

    @GetMapping("oneParam")
    public String oneParam(@RequestParam(required = false)String name);

    @GetMapping("twoParam")
    public String twoParam(@RequestParam(required = false)String name,@RequestParam(required = false)Integer age);

    @PostMapping("oneObj")
    public String oneObj(@RequestBody Order order);
    @PostMapping("oneObjOneParam")
    public String oneObjOneParam(@RequestBody Order order,@RequestParam("name")String name);
}

UserController

package com.wangwei.userservice.controller;

import com.wangwei.userservice.domain.Order;
import com.wangwei.userservice.feign.UserOrderFeign;
import feign.Feign;
import org.apache.catalina.User;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.cloud.openfeign.FeignClient;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.client.RestTemplate;

import java.lang.reflect.InvocationHandler;
import java.lang.reflect.Method;
import java.lang.reflect.Proxy;
import java.util.Date;


@RestController
public class UserController {

    @Autowired
    private UserOrderFeign userOrderFeign;
    

    /**
     * 总结:
     * feign的默认等待时间为1s
     * 超过1s就直接报错了
     *
     * @return
     */

    @GetMapping("userDoOrder")
    public String userDoOrder(){
        //这里发起远程调用
        String result = userOrderFeign.doOrder();
        return result;
    }


    @GetMapping("testParam")
    public String testParam(){
        String url = userOrderFeign.testUrl("David", 18);
        System.out.println(url);


        String david = userOrderFeign.oneParam("David");
        System.out.println(david);

        String wangwei = userOrderFeign.twoParam("wangwei", 18);
        System.out.println(wangwei);

        Order order = Order.builder()
                .name("西蓝花")
                .price(5D)
                .time(new Date())
                .id(1)
                .build();
        String s = userOrderFeign.oneObj(order);
        System.out.println(s);


        String wangwei1 = userOrderFeign.oneObjOneParam(order, "wangwei");
        System.out.println(wangwei1);
        return "ok";


    }
}

运行效果

先启动Eureka服务再启动服务提供者,最后启动服务消费者。

如下图所示已经调用成功。
在这里插入图片描述

在这里插入图片描述

调用超时配置

因为ribbon默认调用超时时长为1s,可以进行修改,可以查看DefaultClientConfigImpl。

我们在服务提供者order-service中新建一个controller,进行超时测试。

@RestController
public class OrderController {

    @GetMapping("doOrder")
    public String doOrder(){
        try{
            //模拟操作数据库等 耗时2s
            TimeUnit.SECONDS.sleep(2);
        }catch (InterruptedException e){
            e.printStackTrace();
        }
        return "牛奶-鸡蛋-麦片";
    }
}

然后我们通过服务消费者user-service进行调用测试:
可以发现出现了超时。
在这里插入图片描述
我们可以在消费者的配置文件中声明Ribbon的超时时间。

# feign只是帮你封装了远程调用的功能 底层还是ribbon 所以我们需要去修改ribbon的时间

ribbon:
    ReadTimeout: 3000 # 3s超时时间(从服务器读取到可用资源所用的时间)
    ConnectTimeout: 3000 #连接服务超时时间

添加这个配置就行了。

五、OpenFeign调用参数的处理

首先传参确保消费者和提供者的参数列表一致,包括返回值,方法签名。

  1. 通过URL传参,GET请求,参数列表使用@PathVariable
  2. 如果是GET请求,每个基本参数必须加上@RequestParam
  3. 如果是POST请求,而且是对象集合等参数,必须加上@RequestBody或者@RequestParam

六、OpenFeign日志打印功能

OpenFeign还提供了日志打印功能,通过日志打印功能,能够清晰的看到发送的HTTP请求中的细节。

总结

在Spring Cloud中是OpenCluod的步骤主要是,引入openFeign依赖;启动类添加开启openFeign客户端;声明与服务端相同的方法并添加对应注册;需要注意根据项目情况配置调用服务的超时时间。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/59643.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

微信小程序真机防盗链referer问题处理

公司使用百度云存储一些资源&#xff0c;然后现在要做防盗链&#xff0c;在CDN加入Referer白名单后发现PC是正常的&#xff0c;微信小程序无法正常访问资源了。然后是各种查啊&#xff0c;然后发现是微信小程序不支持Referer的修改&#xff0c;且在小程序开发工具是Referer是固…

ATFX汇评:非农就业报告来袭,汇市或迎剧烈波动

ATFX汇评&#xff1a;美国非农就业报告每月发布一次&#xff0c;其中非农就业人口和失业率两项数据最受关注。7月季调后非农就业人口&#xff0c;将于今日20:30公布&#xff0c;前值为20.9万人&#xff0c;预期值20万人&#xff1b;7月失业率&#xff0c;同一时间公布&#xff…

极光笔记 | 浅谈企业级SaaS产品的客户成长旅程管理(上)—— 分析篇

本文作者&#xff1a;陈伟&#xff08;极光用户体验部高级总监&#xff09; “企业级SaaS产品与C端互联网产品特征差异很大&#xff0c;有些甚至是截然相反&#xff0c;这些特征也会成为后续客户成长旅程的重要影响变量。本文就如何设计并服务好企业级SaaS产品客户成长旅程进行…

概念解析 | 利用IAA迭代自适应方法实现高精度角度估计

利用IAA迭代自适应方法实现高精度角度估计 注1:本文系“概念辨析”系列之一,致力于简洁清晰地解释、辨析复杂而专业的概念。本次辨析的概念是:IAA迭代自适应方法在雷达角度估计中的应用。 背景介绍 在雷达目标检测与定位中,准确估计目标角度是实现高精度定位的关键。传统的基于…

面试热题(前中序遍历构建树)

给定两个整数数组 preorder 和 inorder &#xff0c;其中 preorder 是二叉树的先序遍历&#xff0c; inorder 是同一棵树的中序遍历&#xff0c;请构造二叉树并返回其根节点。 题目中是给定两个数组&#xff0c;一个是存放这颗树的前序遍历的数组&#xff0c;一个是存放这棵树的…

消息队列项目(2)

我们使用 SQLite 来进行对 Exchange, Queue, Binding 的硬盘保存 对 Message 就保存在硬盘的文本中 SQLite 封装 这里是在 application.yaml 中来引进对 SQLite 的封装 spring:datasource:url: jdbc:sqlite:./data/meta.dbusername:password:driver-class-name: org.sqlite.…

字典与数组第5讲:数组区域内,数组公式的编辑和删除

【分享成果&#xff0c;随喜正能量】我们的心和宇宙本是相通的&#xff0c;所以生命内在蕴含了无限的智慧&#xff0c;但在没有开发没有证悟之前&#xff0c;生命是渺小而短暂的……..。 《VBA数组与字典方案》教程&#xff08;10144533&#xff09;是我推出的第三套教程&#…

cmake配置Qt工程

cmake 工程配置 # 指定版本和项目 cmake_minimum_required(VERSION 3.10) set(TARGET_NAME labelDeviceView) project(${TARGET_NAME} ) include(${CMAKE_CURRENT_LIST_DIR}/../../../../../../ossLib/ossLib/env.cmake) set(CMAKE_PREFIX_PATH "D:/Qt6/6.5.2/msvc2019…

MyBatis核心 - SqlSession如何通过Mapper接口生成Mapper对象

书接上文 MyBatis – 执行流程 我们通过SqlSession获取到了UserMapper对象&#xff0c;代码如下&#xff1a; // 获取SqlSession对象 SqlSession sqlSession sqlSessionFactory.openSession();// 执行查询操作 try {// 获取映射器接口UserMapper userMapper sqlSession.get…

第3章 数据和C

本章介绍以下内容&#xff1a; 关键字&#xff1a;int 、short、long、unsigned、char、float、double、_Bool、_Complex、_Imaginary 运算符&#xff1a;sizeof() 函数&#xff1a;scanf() 整数类型和浮点数类型的区别 如何书写整型和浮点型常数&#xff0c;如何声明这些类型的…

计蒜客T1116——验证子串

C实现验证子串的功能:今天复习了一下数据结构的串部分的内容&#xff0c;突然想起来子串匹配的实现&#xff0c;于是计蒜客随便找一道题写一下&#xff0c;核心的代码为裁剪子串和字符串比较两个内容&#xff0c;建议理解背诵&#xff0c;考研大概率会考。 子串裁剪 string Sf…

小鱼深度产品测评之:阿里云容器服务器ASK,一款不需购买节点,即可直接部署容器应用。

容器服务器ASK测评 1、引言2、帮助文档3、集群3.1集群列表3.1.1 详情3.1.1.1概览 tab3.1.1.2基本信息 tab3.1.1.4集群资源 tab3.1.1.5 集群日志 tab3.1.1.6 集群任务 tab 3.1.2 应用管理3.1.2.1 详情3.1.2.2 详情3.1.2.3 伸缩3.1.2.4 监控 3.1.3 查看日志3.1.3.1 集群日志3.1.3…

AcWing 24:机器人的运动范围 ← BFS、DFS

【题目来源】https://www.acwing.com/problem/content/description/22/【题目描述】 地上有一个 m 行和 n 列的方格&#xff0c;横纵坐标范围分别是 0∼m−1 和 0∼n−1。 一个机器人从坐标 (0,0) 的格子开始移动&#xff0c;每一次只能向左&#xff0c;右&#xff0c;上&#…

nginx服务

web服务&#xff1a; 国外主流的网站服务还是apache 国内主流的网站服务是&#xff1a;nginx Nginx网站服务 nginx是一个高性能、轻量级的web服务软件。 nginx的特点&#xff1a; 1.稳定性相对较高。&#xff08;但是没有apache稳定&#xff09; 2.系统资源消耗低。体现在处理h…

“科创中国”青百会轮值主席吴甜:以大语言模型为代表的AI将引发产业变革

8月1日&#xff0c;“科创中国”青年百人会&#xff08;后文简称青百会&#xff09;联合百度举办“青创汇”高端对话&#xff0c;围绕人工智能技术创新与产业发展交流研讨&#xff0c;同时正式成立“科创中国”青年百人会女性工作委员会。该委员会将鼓励更多女性投身科技创新事…

如何隐藏开源流媒体EasyPlayer.js视频H.265播放器的实时录像按钮?

目前我们TSINGSEE青犀视频所有的视频监控平台&#xff0c;集成的都是EasyPlayer.js版播放器&#xff0c;它属于一款高效、精炼、稳定且免费的流媒体播放器&#xff0c;可支持多种流媒体协议播放&#xff0c;包括WebSocket-FLV、HTTP-FLV&#xff0c;HLS&#xff08;m3u8&#x…

S7-200SMART与ET200SP远程IO模块进行PROFINET通信的具体方法

S7-200SMART与ET200SP远程IO模块进行PROFINET通信的具体方法 使用前提: 只有标准型且固件版本为V2.4及以上的S7-200 SMART CPU才支持 PROFINET 控制器功能。 S7-200 SMART 作 PROFINET 控制器最多可带8个 IO 设备(例如:远程 IO、阀岛、变频器、伺服和机器人等)。 本例中以 …

【C# 基础精讲】为什么选择C# ?

C#&#xff08;C Sharp&#xff09;是由微软开发的一种通用、面向对象的编程语言。它最初于2000年发布&#xff0c;自那时以来逐渐成为开发者的首选之一。C#的设计目标是提供一种简单、现代、可靠且安全的编程语言&#xff0c;使开发者能够轻松构建各种类型的应用程序。 为什么…

Element-plus中tooltip 提示框修改宽度——解决方案

tooltip 提示框修改宽度方法&#xff1a; 在element中&#xff0c;想要设置表格的内容&#xff0c;超出部分隐藏&#xff0c;鼠标悬浮提示 可以在el-table 上添加show-overflow-tooltip属性 同时可以通过tooltip-options配置提示信息 如下图代码 <el-tableshow-overflo…

Cocos creator(2d) 使用 shader + uv 实现单张图片衔接滚动效果

在游戏中&#xff0c;当我们需要让背景图片无缝衔接无限滚动时(打飞机这种背景一直滚动&#xff0c;或者肉鸽游戏地图一直在走等等)&#xff0c;通常的做法是 在游戏中放两个背景node&#xff0c;在update中控制这两张背景图片的移动&#xff0c;并让其收尾衔接即可。(具体代码…