演示架构

OpenTelemetry 演示内容由使用不同编程语言编写的微服务组成， 这些服务通过 gRPC 和 HTTP 相互通信；此外还包括一个使用 Locust 模拟用户流量的负载生成器。

graph TD
subgraph 服务图
accounting(会计服务):::dotnet
ad(广告服务):::java
cache[(缓存<br/>&#40Valkey&#41)]
cart(购物车服务):::dotnet
checkout(结账服务):::golang
currency(货币服务):::cpp
email(电子邮件服务):::ruby
flagd(Flagd 服务):::golang
flagd-ui(Flagd UI 界面):::typescript
fraud-detection(欺诈检测服务):::kotlin
frontend(前端服务):::typescript
frontend-proxy(前端代理<br/>&#40Envoy&#41):::cpp
image-provider(图像提供服务<br/>&#40nginx&#41):::cpp
load-generator([负载生成器]):::python
payment(支付服务):::javascript
product-catalog(产品目录服务):::golang
quote(报价服务):::php
recommendation(推荐服务):::python
shipping(配送服务):::rust
queue[(队列<br/>&#40Kafka&#41)]:::java
react-native-app(React Native 应用):::typescript

ad ---->|gRPC| flagd

checkout -->|gRPC| currency
checkout -->|gRPC| cart
checkout -->|TCP| queue

cart --> cache
cart -->|gRPC| flagd

checkout -->|gRPC| payment
checkout --->|HTTP| email
checkout -->|gRPC| product-catalog
checkout -->|HTTP| shipping

fraud-detection -->|gRPC| flagd

frontend -->|gRPC| ad
frontend -->|gRPC| currency
frontend -->|gRPC| cart
frontend -->|gRPC| checkout
frontend -->|HTTP| shipping
frontend ---->|gRPC| recommendation
frontend -->|gRPC| product-catalog

frontend-proxy -->|gRPC| flagd
frontend-proxy -->|HTTP| frontend
frontend-proxy -->|HTTP| flagd-ui
frontend-proxy -->|HTTP| image-provider

payment -->|gRPC| flagd

queue -->|TCP| accounting
queue -->|TCP| fraud-detection

recommendation -->|gRPC| flagd
recommendation -->|gRPC| product-catalog

shipping -->|HTTP| quote

Internet -->|HTTP| frontend-proxy
load-generator -->|HTTP| frontend-proxy
react-native-app -->|HTTP| frontend-proxy
end

classDef dotnet fill:#178600,color:white;
classDef cpp fill:#f34b7d,color:white;
classDef golang fill:#00add8,color:black;
classDef java fill:#b07219,color:white;
classDef javascript fill:#f1e05a,color:black;
classDef kotlin fill:#560ba1,color:white;
classDef php fill:#4f5d95,color:white;
classDef python fill:#3572A5,color:white;
classDef ruby fill:#701516,color:white;
classDef rust fill:#dea584,color:black;
classDef typescript fill:#e98516,color:black;

graph TD
subgraph 服务图例
  dotnetsvc(.NET):::dotnet
  cppsvc(C++):::cpp
  golangsvc(Go):::golang
  javasvc(Java):::java
  javascriptsvc(JavaScript):::javascript
  kotlinsvc(Kotlin):::kotlin
  phpsvc(PHP):::php
  pythonsvc(Python):::python
  rubysvc(Ruby):::ruby
  rustsvc(Rust):::rust
  typescriptsvc(TypeScript):::typescript
end

classDef dotnet fill:#178600,color:white;
classDef cpp fill:#f34b7d,color:white;
classDef golang fill:#00add8,color:black;
classDef java fill:#b07219,color:white;
classDef javascript fill:#f1e05a,color:black;
classDef kotlin fill:#560ba1,color:white;
classDef php fill:#4f5d95,color:white;
classDef python fill:#3572A5,color:white;
classDef ruby fill:#701516,color:white;
classDef rust fill:#dea584,color:black;
classDef typescript fill:#e98516,color:black;

点击以下链接可查看演示应用中目前的指标和链路监控覆盖情况。

Collector 的配置文件位于 otelcol-config.yml， 也可以在此配置不同的导出器（Exporter）。

graph TB
subgraph tdf[遥测数据流]
    subgraph subgraph_padding [ ]
        style subgraph_padding fill:none,stroke:none;
        %% 为了避免标题重叠进行填充
        subgraph od[OpenTelemetry 演示]
        ms(微服务)
        end

        ms -.->|"OTLP<br/>gRPC"| oc-grpc
        ms -.->|"OTLP<br/>HTTP POST"| oc-http

        subgraph oc[OTel Collector（收集器）]
            style oc fill:#97aef3,color:black;
            oc-grpc[/"OTLP 接收器<br/>监听地址<br/>grpc://localhost:4317"/]
            oc-http[/"OTLP 接收器<br/>监听地址<br/>localhost:4318<br/>"/]
            oc-proc(处理器)
            oc-prom[/"OTLP HTTP 导出器"/]
            oc-otlp[/"OTLP 导出器"/]

            oc-grpc --> oc-proc
            oc-http --> oc-proc

            oc-proc --> oc-prom
            oc-proc --> oc-otlp
        end

        oc-prom -->|"localhost:9090/api/v1/otlp"| pr-sc
        oc-otlp -->|gRPC| ja-col

        subgraph pr[Prometheus（指标系统）]
            style pr fill:#e75128,color:black;
            pr-sc[/"Prometheus OTLP<br/>写入接收器"/]
            pr-tsdb[(Prometheus 时序数据库)]
            pr-http[/"Prometheus HTTP<br/>监听地址<br/>localhost:9090"/]

            pr-sc --> pr-tsdb
            pr-tsdb --> pr-http
        end

        pr-b{{"浏览器<br/>Prometheus UI"}}
        pr-http ---->|"localhost:9090/graph"| pr-b

        subgraph ja[Jaeger（追踪系统）]
            style ja fill:#60d0e4,color:black;
            ja-col[/"Jaeger Collector<br/>监听地址<br/>grpc://jaeger:4317"/]
            ja-db[(Jaeger 数据库)]
            ja-http[/"Jaeger HTTP<br/>监听地址<br/>localhost:16686"/]

            ja-col --> ja-db
            ja-db --> ja-http
        end

        subgraph gr[Grafana（可视化）]
            style gr fill:#f8b91e,color:black;
            gr-srv["Grafana 服务器"]
            gr-http[/"Grafana HTTP<br/>监听地址<br/>localhost:3000"/]

            gr-srv --> gr-http
        end

        pr-http --> |"localhost:9090/api"| gr-srv
        ja-http --> |"localhost:16686/api"| gr-srv

        ja-b{{"浏览器<br/>Jaeger UI"}}
        ja-http ---->|"localhost:16686/search"| ja-b

        gr-b{{"浏览器<br/>Grafana UI"}}
        gr-http -->|"localhost:3000/dashboard"| gr-b
    end
end

你可以在 /pb/ 目录中找到协议缓冲定义 。