Golang微服务网关实现与请求转发

答案:Golang微服务网关通过HTTP服务器、路由匹配和反向代理实现请求转发,结合服务发现、负载均衡、认证、限流与熔断等机制提升系统稳定性与安全性。

golang微服务网关实现与请求转发

微服务架构下,网关就像是整个系统的“门面”,所有外部请求都得先通过它。在Golang里实现一个微服务网关,核心思路就是构建一个高性能的HTTP服务,它能智能地解析、处理并最终将请求转发到正确的后端微服务。这不仅仅是简单的路由,还涉及到认证、限流、熔断以及服务发现等一系列横切关注点,Go语言并发模型和轻量级特性,让它成为构建这类网关的理想选择。

我们常常会遇到这样的场景:随着业务增长,服务数量越来越多,客户端直接调用各个服务会变得异常复杂。这时候,一个统一的入口就显得尤为重要。用Go来构建这个入口,我的经验是,它能提供非常高效的请求处理能力。

解决方案

要实现一个Golang微服务网关并处理请求转发,我们可以从几个关键模块入手。最基础的是一个HTTP服务器,它负责接收所有客户端请求。然后,我们需要一个路由机制来决定哪个请求应该去哪个服务。最后,核心的转发逻辑通常会用到Go标准库中的

httputil.ReverseProxy

首先,搭建一个基础的HTTP服务。这很简单,

net/http

包就能搞定。但仅仅这样还不够,我们需要一个更强大的路由,比如

gorilla/mux

chi

,它们能让我们基于路径、方法、头部等定义复杂的路由规则。

立即学习“go语言免费学习笔记(深入)”;

package mainimport (    "log"    "net/http"    "net/http/httputil"    "net/url")// targetServiceMap 模拟服务发现,存储后端服务地址var targetServiceMap = map[string]string{    "/user/": "http://localhost:8001", // 用户服务    "/order/": "http://localhost:8002", // 订单服务}func main() {    http.HandleFunc("/", gatewayHandler)    log.Println("Gateway started on :8080")    log.Fatal(http.ListenAndServe(":8080", nil))}func gatewayHandler(w http.ResponseWriter, r *http.Request) {    // 这里可以加入认证、限流等前置处理    log.Printf("Received request: %s %s", r.Method, r.URL.Path)    // 简单的路由匹配    var targetURL *url.URL    for pathPrefix, serviceAddr := range targetServiceMap {        if len(r.URL.Path) >= len(pathPrefix) && r.URL.Path[:len(pathPrefix)] == pathPrefix {            var err error            targetURL, err = url.Parse(serviceAddr)            if err != nil {                http.Error(w, "Bad gateway configuration", http.StatusInternalServerError)                log.Printf("Error parsing target URL %s: %v", serviceAddr, err)                return            }            break        }    }    if targetURL == nil {        http.Error(w, "Service not found", http.StatusNotFound)        return    }    proxy := httputil.NewSingleHostReverseProxy(targetURL)    proxy.Director = func(req *http.Request) {        req.URL.Scheme = targetURL.Scheme        req.URL.Host = targetURL.Host        req.URL.Path = r.URL.Path // 保持原始路径        req.Host = targetURL.Host // 转发时修改Host头        // 可以在这里添加或修改请求头,例如传递认证信息        req.Header.Add("X-Forwarded-For", r.RemoteAddr)    }    // 处理代理过程中可能出现的错误    proxy.ErrorHandler = func(rw http.ResponseWriter, req *http.Request, err error) {        log.Printf("Proxy error: %v", err)        http.Error(rw, "Service unavailable", http.StatusBadGateway)    }    proxy.ServeHTTP(w, r)}

这段代码展示了一个最基础的转发逻辑。

gatewayHandler

函数会根据请求的URL路径前缀,匹配到对应的后端服务地址,然后利用

httputil.NewSingleHostReverseProxy

创建一个反向代理实例,并将请求转发过去。

proxy.Director

函数非常关键,它允许我们在请求转发前修改请求的各个部分,比如重写URL、修改Host头等。

当然,这只是一个起点。真实的网关还需要考虑很多东西,比如服务发现,不能把服务地址硬编码;还有认证、限流、熔断这些“附加值”功能,它们通常以中间件的形式集成进来。

Golang实现微服务网关的核心技术栈有哪些?

在Golang中构建一个高效、健壮的微服务网关,我们通常会用到一些核心的技术栈。这不仅仅是Go语言本身,还包括一些社区成熟的库和模式。

首先,

net/http

包是基石,它提供了HTTP客户端和服务端的所有基础功能。我们的网关就是建立在这个之上。

接着是路由库。标准库的

http.ServeMux

在简单场景下够用,但对于复杂的路由规则(例如路径参数、方法匹配、中间件链),

gorilla/mux

go-chi/chi

是更优的选择。它们提供了更灵活的路由匹配和组织方式,让我们可以清晰地定义API入口。

核心的反向代理功能由

net/http/httputil

包中的

ReverseProxy

结构体提供。这是Go标准库的精华之一,它极大地简化了请求转发的实现。通过配置其

Director

字段,我们可以完全控制转发请求的URL、头部等信息。

为了处理服务发现,我们通常会集成像Consul、Etcd或者Kubernetes API这样的注册中心。Go社区有相应的客户端库,比如

hashicorp/consul/api

用于Consul,

clientv3

用于Etcd,以及

k8s.io/client-go

用于Kubernetes。网关会定期从这些注册中心获取最新的服务实例列表。

中间件是网关实现各种横切关注点的关键。Go语言本身对中间件的支持非常友好,通过函数组合就可以实现。像

negroni

gorilla/handlers

这样的库能帮助我们更好地组织和管理中间件链,实现认证、日志记录、请求ID注入、限流等功能。

对于配置管理

spf13/viper

是一个非常强大的库,它支持从多种来源(文件、环境变量、命令行参数、远程配置中心)加载配置,这对于网关的动态配置至关重要。

高可用和容错方面,熔断器(Circuit Breaker)是必不可少的。

sony/gobreaker

是一个轻量级的Go语言熔断器实现,可以防止对故障服务的持续调用导致系统雪崩。限流器(Rate Limiter)则可以使用

juju/ratelimit

或者自己实现令牌桶算法来保护后端服务不被突发流量冲垮。

我个人在项目中,会倾向于选择

chi

作为路由,因为它轻量且性能不错,配合

httputil.ReverseProxy

,能很快搭建起一个高性能的网关骨架。服务发现则根据部署环境选择,Kubernetes环境下直接用

client-go

查询Service Endpoints是最自然的方式。

如何在Golang网关中实现动态服务发现与请求负载均衡?

动态服务发现和请求负载均衡是微服务网关的核心能力,它们让网关能够适应后端服务的动态变化,并有效地分配请求流量。

动态服务发现的实现思路是让网关不再硬编码后端服务的地址,而是通过与一个服务注册中心(如Consul、Etcd、Nacos或Kubernetes API)交互,实时获取服务实例的最新列表。

具体来说,网关内部会有一个服务注册中心的客户端,它会:

注册服务监听器:在启动时或定期向注册中心查询所有可用的后端服务实例(例如,用户服务有多少个实例,它们的IP和端口是什么)。维护服务列表:将查询到的服务实例信息存储在网关的内存中,通常是一个

map[string][]string

(服务名到实例地址列表的映射)。实时更新:注册中心通常支持事件通知机制,当服务实例上线或下线时,注册中心会通知网关,网关随即更新其内部的服务列表。如果注册中心不支持通知,网关可以采用定时轮询的方式来同步服务列表。

举个例子,如果使用Consul,你可以这样获取服务列表:

// 简化示例,实际需处理错误、连接池等// func getServiceInstances(serviceName string) ([]string, error) {//  config := consulapi.DefaultConfig()//  client, err := consulapi.NewClient(config)//  if err != nil {//      return nil, err//  }//  services, _, err := client.Health().Service(serviceName, "", true, nil)//  if err != nil {//      return nil, err//  }//  var instances []string//  for _, service := range services {//      instances = append(instances, fmt.Sprintf("http://%s:%d", service.Service.Address, service.Service.Port))//  }//  return instances, nil// }// 实际网关会有一个后台goroutine周期性调用此函数更新服务列表

请求负载均衡则是在网关获取到多个服务实例后,决定将当前请求转发给哪个实例的策略。常见的负载均衡算法有:

轮询(Round Robin):最简单也最常用,按顺序将请求分发给每个服务实例。随机(Random):随机选择一个服务实例。最少连接(Least Connections):将请求发送给当前连接数最少的服务实例。这需要网关维护每个实例的连接状态。加权轮询/随机(Weighted Round Robin/Random):根据服务实例的配置权重进行分配,权重高的实例获得更多请求。IP Hash:根据客户端IP地址的哈希值来选择服务实例,确保同一客户端的请求总是转发到同一个实例,适用于需要会话粘性的场景。

在Golang中实现负载均衡,通常会在

httputil.ReverseProxy

Director

函数中进行。当网关接收到请求后,它会:

根据请求路径或服务ID,从动态维护的服务列表中找到对应的服务实例集合。应用选定的负载均衡算法,从这个集合中选择一个目标服务实例。在

Director

函数中修改

req.URL.Host

req.URL.Scheme

,指向选定的目标实例。

以一个简单的轮询负载均衡为例:

type LoadBalancer struct {    sync.Mutex    targets []*url.URL    current int // 当前轮询索引}func NewLoadBalancer(serviceURLs []string) (*LoadBalancer, error) {    var targets []*url.URL    for _, uStr := range serviceURLs {        u, err := url.Parse(uStr)        if err != nil {            return nil, err        }        targets = append(targets, u)    }    return &LoadBalancer{targets: targets}, nil}func (lb *LoadBalancer) Next() *url.URL {    lb.Lock()    defer lb.Unlock()    if len(lb.targets) == 0 {        return nil    }    target := lb.targets[lb.current]    lb.current = (lb.current + 1) % len(lb.targets)    return target}// 在网关handler中:// serviceInstances, _ := getServiceInstances("userService") // 从服务发现获取// lb, _ := NewLoadBalancer(serviceInstances)// targetURL := lb.Next()// if targetURL == nil { /* handle no available instances */ }// proxy := httputil.NewSingleHostReverseProxy(targetURL)// proxy.Director = func(req *http.Request) {//  req.URL.Scheme = targetURL.Scheme//  req.URL.Host = targetURL.Host//  // ... 其他修改// }

这只是一个简化版本,实际的负载均衡器需要考虑服务实例的健康检查,将不健康的实例从列表中移除,避免请求发送到故障节点。

Golang微服务网关在处理认证、限流与熔断时有哪些最佳实践?

在Golang微服务网关中处理认证、限流和熔断,是构建一个稳定、安全且高性能系统的重要环节。我的经验是,将这些功能以中间件的形式集成,是最佳实践。这样既能保持代码的模块化,又能在请求进入核心转发逻辑前进行统一处理。

1. 认证(Authentication)与授权(Authorization)

最佳实践

统一认证入口:所有外部请求的认证都在网关层完成。客户端只需与网关交互,无需了解后端各个服务的认证机制。令牌验证:通常采用JWT(JSON Web Tokens)或OAuth2等标准。网关负责验证传入请求的令牌是否有效、是否过期,并解析出用户身份信息。身份传递:认证成功后,网关将用户身份信息(如用户ID、角色等)通过HTTP头部(例如

X-User-ID

,

X-User-Roles

)传递给下游微服务。下游服务可以直接使用这些信息进行业务逻辑处理,无需再次认证。快速失败:如果认证失败(令牌无效、缺失),网关应立即返回错误(如401 Unauthorized),避免无效请求进入后端。

Go语言实现思路

实现一个HTTP中间件,它会在

http.Handler

被调用之前执行。中间件会从请求头中提取认证令牌。调用一个认证服务或使用本地密钥验证令牌的有效性。如果验证通过,将解析出的用户上下文信息注入到

context.Context

中,或者添加到请求头中,然后调用下一个处理器。如果验证失败,直接向客户端返回

http.StatusUnauthorized

// 简化示例func AuthMiddleware(next http.Handler) http.Handler {    return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {        token := r.Header.Get("Authorization")        if token == "" {            http.Error(w, "Unauthorized", http.StatusUnauthorized)            return        }        // 实际中这里会调用认证服务或验证JWT        // 例如:claims, err := jwt.Parse(token, ...)        // if err != nil { http.Error(w, "Invalid token", http.StatusUnauthorized); return }        // 将用户ID等信息放入context或header        // ctx := context.WithValue(r.Context(), "userID", claims.UserID)        // r = r.WithContext(ctx)        next.ServeHTTP(w, r)    })}

2. 限流(Rate Limiting)

最佳实践

保护下游服务:在网关层进行限流,可以防止突发流量直接冲击后端微服务,避免服务过载。多维度限流:可以根据客户端IP、用户ID、API路径、API Key等不同维度进行限流,实现更精细的控制。平滑处理:使用令牌桶(Token Bucket)或漏桶(Leaky Bucket)算法,提供更平滑的流量控制。友好的错误响应:当请求被限流时,返回

http.StatusTooManyRequests

(429),并可在响应头中包含

Retry-After

字段,告知客户端何时可以重试。

Go语言实现思路

使用

juju/ratelimit

库实现令牌桶算法。为每个需要限流的维度(例如IP地址)维护一个独立的限流器实例。在中间件中检查当前请求是否允许通过。

// 简化示例// var ipLimiters = make(map[string]*ratelimit.Limiter)// var mu sync.Mutex // 保护ipLimitersfunc RateLimitMiddleware(next http.Handler) http.Handler {    return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {        // 获取客户端IP,或者根据业务需求获取用户ID等        ip := r.RemoteAddr        // 假设我们有一个全局的限流器工厂,可以根据IP创建或获取限流器        // limiter := getOrCreateLimiter(ip, rate.Every(time.Second/10), 10) // 每秒10个请求,桶容量10        // if !limiter.Allow() {        //  http.Error(w, "Too Many Requests", http.StatusTooManyRequests)        //  return        // }        next.ServeHTTP(w, r)    })}

3. 熔断(Circuit Breaking)

最佳实践

防止雪崩:当某个下游服务出现故障或响应缓慢时,熔断器会快速失败对该服务的请求,而不是让请求堆积并耗尽网关资源,从而防止故障扩散。自动恢复:熔断器在一段时间后会尝试“半开”状态,允许少量请求通过以探测服务是否恢复。细粒度控制:为每个后端服务或关键操作配置独立的熔断器。

Go语言实现思路

使用

sony/gobreaker

库。在调用后端服务之前,将实际的HTTP请求包装在熔断器的

Execute

方法中。熔断器会根据配置的错误率、超时等指标,自动切换状态(关闭、半开、打开)。

// 简化示例import "github.com/sony/gobreaker"// var cb *gobreaker.CircuitBreaker // 为每个后端服务创建一个熔断器实例func init() {    // cb = gobreaker.NewCircuitBreaker(gobreaker.Settings{    //  Name:        "userService",    //  MaxRequests: 3, // 半开状态下允许3个请求    //  Interval:    5 * time.Second, // 统计周期    //  Timeout:     10 * time.Second, // 熔断打开后,10秒后尝试半开    //  ReadyToOpen: func(counts gobreaker.Counts) bool {    //      return counts.Request > 10 && float64(counts.Failure)/float64(counts.Request) > 0.6    //  }, // 失败率超过60%且请求数大于10,则熔断    //  OnStateChange: func(name string, from, to gobreaker.State) {    //      log.Printf("Circuit Breaker '%s' changed from %s

以上就是Golang微服务网关实现与请求转发的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1403016.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月15日 19:12:47
下一篇 2025年12月15日 19:13:01

相关推荐

  • Uniapp 中如何不拉伸不裁剪地展示图片?

    灵活展示图片:如何不拉伸不裁剪 在界面设计中,常常需要以原尺寸展示用户上传的图片。本文将介绍一种在 uniapp 框架中实现该功能的简单方法。 对于不同尺寸的图片,可以采用以下处理方式: 极端宽高比:撑满屏幕宽度或高度,再等比缩放居中。非极端宽高比:居中显示,若能撑满则撑满。 然而,如果需要不拉伸不…

    2025年12月24日
    400
  • 如何让小说网站控制台显示乱码,同时网页内容正常显示?

    如何在不影响用户界面的情况下实现控制台乱码? 当在小说网站上下载小说时,大家可能会遇到一个问题:网站上的文本在网页内正常显示,但是在控制台中却是乱码。如何实现此类操作,从而在不影响用户界面(UI)的情况下保持控制台乱码呢? 答案在于使用自定义字体。网站可以通过在服务器端配置自定义字体,并通过在客户端…

    2025年12月24日
    800
  • SASS 中的 Mixins

    mixin 是 css 预处理器提供的工具,虽然它们不是可以被理解的函数,但它们的主要用途是重用代码。 不止一次,我们需要创建多个类来执行相同的操作,但更改单个值,例如字体大小的多个类。 .fs-10 { font-size: 10px;}.fs-20 { font-size: 20px;}.fs-…

    2025年12月24日
    000
  • 如何在地图上轻松创建气泡信息框?

    地图上气泡信息框的巧妙生成 地图上气泡信息框是一种常用的交互功能,它简便易用,能够为用户提供额外信息。本文将探讨如何借助地图库的功能轻松创建这一功能。 利用地图库的原生功能 大多数地图库,如高德地图,都提供了现成的信息窗体和右键菜单功能。这些功能可以通过以下途径实现: 高德地图 JS API 参考文…

    2025年12月24日
    400
  • 如何使用 scroll-behavior 属性实现元素scrollLeft变化时的平滑动画?

    如何实现元素scrollleft变化时的平滑动画效果? 在许多网页应用中,滚动容器的水平滚动条(scrollleft)需要频繁使用。为了让滚动动作更加自然,你希望给scrollleft的变化添加动画效果。 解决方案:scroll-behavior 属性 要实现scrollleft变化时的平滑动画效果…

    2025年12月24日
    000
  • 如何为滚动元素添加平滑过渡,使滚动条滑动时更自然流畅?

    给滚动元素平滑过渡 如何在滚动条属性(scrollleft)发生改变时为元素添加平滑的过渡效果? 解决方案:scroll-behavior 属性 为滚动容器设置 scroll-behavior 属性可以实现平滑滚动。 html 代码: click the button to slide right!…

    2025年12月24日
    500
  • 如何选择元素个数不固定的指定类名子元素?

    灵活选择元素个数不固定的指定类名子元素 在网页布局中,有时需要选择特定类名的子元素,但这些元素的数量并不固定。例如,下面这段 html 代码中,activebar 和 item 元素的数量均不固定: *n *n 如果需要选择第一个 item元素,可以使用 css 选择器 :nth-child()。该…

    2025年12月24日
    200
  • 使用 SVG 如何实现自定义宽度、间距和半径的虚线边框?

    使用 svg 实现自定义虚线边框 如何实现一个具有自定义宽度、间距和半径的虚线边框是一个常见的前端开发问题。传统的解决方案通常涉及使用 border-image 引入切片图片,但是这种方法存在引入外部资源、性能低下的缺点。 为了避免上述问题,可以使用 svg(可缩放矢量图形)来创建纯代码实现。一种方…

    2025年12月24日
    100
  • 旋转长方形后,如何计算其相对于画布左上角的轴距?

    绘制长方形并旋转,计算旋转后轴距 在拥有 1920×1080 画布中,放置一个宽高为 200×20 的长方形,其坐标位于 (100, 100)。当以任意角度旋转长方形时,如何计算它相对于画布左上角的 x、y 轴距? 以下代码提供了一个计算旋转后长方形轴距的解决方案: const x = 200;co…

    2025年12月24日
    000
  • 旋转长方形后,如何计算它与画布左上角的xy轴距?

    旋转后长方形在画布上的xy轴距计算 在画布中添加一个长方形,并将其旋转任意角度,如何计算旋转后的长方形与画布左上角之间的xy轴距? 问题分解: 要计算旋转后长方形的xy轴距,需要考虑旋转对长方形宽高和位置的影响。首先,旋转会改变长方形的长和宽,其次,旋转会改变长方形的中心点位置。 求解方法: 计算旋…

    2025年12月24日
    000
  • 旋转长方形后如何计算其在画布上的轴距?

    旋转长方形后计算轴距 假设长方形的宽、高分别为 200 和 20,初始坐标为 (100, 100),我们将它旋转一个任意角度。根据旋转矩阵公式,旋转后的新坐标 (x’, y’) 可以通过以下公式计算: x’ = x * cos(θ) – y * sin(θ)y’ = x * …

    2025年12月24日
    000
  • 如何让“元素跟随文本高度,而不是撑高父容器?

    如何让 元素跟随文本高度,而不是撑高父容器 在页面布局中,经常遇到父容器高度被子元素撑开的问题。在图例所示的案例中,父容器被较高的图片撑开,而文本的高度没有被考虑。本问答将提供纯css解决方案,让图片跟随文本高度,确保父容器的高度不会被图片影响。 解决方法 为了解决这个问题,需要将图片从文档流中脱离…

    2025年12月24日
    000
  • 如何计算旋转后长方形在画布上的轴距?

    旋转后长方形与画布轴距计算 在给定的画布中,有一个长方形,在随机旋转一定角度后,如何计算其在画布上的轴距,即距离左上角的距离? 以下提供一种计算长方形相对于画布左上角的新轴距的方法: const x = 200; // 初始 x 坐标const y = 90; // 初始 y 坐标const w =…

    2025年12月24日
    200
  • CSS元素设置em和transition后,为何载入页面无放大效果?

    css元素设置em和transition后,为何载入无放大效果 很多开发者在设置了em和transition后,却发现元素载入页面时无放大效果。本文将解答这一问题。 原问题:在视频演示中,将元素设置如下,载入页面会有放大效果。然而,在个人尝试中,并未出现该效果。这是由于macos和windows系统…

    2025年12月24日
    200
  • 为什么 CSS mask 属性未请求指定图片?

    解决 css mask 属性未请求图片的问题 在使用 css mask 属性时,指定了图片地址,但网络面板显示未请求获取该图片,这可能是由于浏览器兼容性问题造成的。 问题 如下代码所示: 立即学习“前端免费学习笔记(深入)”; icon [data-icon=”cloud”] { –icon-cl…

    2025年12月24日
    200
  • 如何利用 CSS 选中激活标签并影响相邻元素的样式?

    如何利用 css 选中激活标签并影响相邻元素? 为了实现激活标签影响相邻元素的样式需求,可以通过 :has 选择器来实现。以下是如何具体操作: 对于激活标签相邻后的元素,可以在 css 中使用以下代码进行设置: li:has(+li.active) { border-radius: 0 0 10px…

    2025年12月24日
    100
  • 如何模拟Windows 10 设置界面中的鼠标悬浮放大效果?

    win10设置界面的鼠标移动显示周边的样式(探照灯效果)的实现方式 在windows设置界面的鼠标悬浮效果中,光标周围会显示一个放大区域。在前端开发中,可以通过多种方式实现类似的效果。 使用css 使用css的transform和box-shadow属性。通过将transform: scale(1.…

    2025年12月24日
    200
  • 如何计算旋转后的长方形在画布上的 XY 轴距?

    旋转长方形后计算其画布xy轴距 在创建的画布上添加了一个长方形,并提供其宽、高和初始坐标。为了视觉化旋转效果,还提供了一些旋转特定角度后的图片。 问题是如何计算任意角度旋转后,这个长方形的xy轴距。这涉及到使用三角学来计算旋转后的坐标。 以下是一个 javascript 代码示例,用于计算旋转后长方…

    2025年12月24日
    000
  • 为什么我的 Safari 自定义样式表在百度页面上失效了?

    为什么在 Safari 中自定义样式表未能正常工作? 在 Safari 的偏好设置中设置自定义样式表后,您对其进行测试却发现效果不同。在您自己的网页中,样式有效,而在百度页面中却失效。 造成这种情况的原因是,第一个访问的项目使用了文件协议,可以访问本地目录中的图片文件。而第二个访问的百度使用了 ht…

    2025年12月24日
    000
  • 如何用前端实现 Windows 10 设置界面的鼠标移动探照灯效果?

    如何在前端实现 Windows 10 设置界面中的鼠标移动探照灯效果 想要在前端开发中实现 Windows 10 设置界面中类似的鼠标移动探照灯效果,可以通过以下途径: CSS 解决方案 DEMO 1: Windows 10 网格悬停效果:https://codepen.io/tr4553r7/pe…

    2025年12月24日
    000

发表回复

登录后才能评论
关注微信