監視やばい - Speaker Deck

監視やばい

by syossan27

Slide 1

Slide 1 text

©MIXI 監視　やばい株式会社MIXI 井上翔太

Slide 2

Slide 2 text

©MIXI 自己紹介名前：しょっさん  X（旧: Twitter）/ mixi2：@syossan27  所属：MIXI  活動：  ● SRE Kaigi ● SRE Magazine ● ゆるSRE勉強会

Slide 3

Slide 3 text

©MIXI やばい

Slide 4

Slide 4 text

©MIXI 監視が

Slide 5

Slide 5 text

©MIXI ２０２４年未だに地道な監視しかできていないことに焦っていた・・・

Slide 6

Slide 6 text

©MIXI 地道にやっている例承知！なんか最近サービスが遅いな〜って感じるので、どの辺が原因なのか調査してくれない？

Slide 7

Slide 7 text

©MIXI 地道にやっている例フロントエンドとバックエンド、それぞれのログで遅くなっているところがないかチェックして、見つかったらそのアクセスでリクエストされたログを全てチェックして・・・

Slide 8

Slide 8 text

©MIXI 地道にやっている例フロントエンドとバックエンド、それぞれのログで遅くなっているところがないかチェックして、見つかったらそのアクセスでリクエストされたログを全てチェックして・・・やばい！

Slide 9

Slide 9 text

©MIXI んじゃ楽するために行動しましょ

Slide 10

Slide 10 text

©MIXI OTel × Cloud Traceを導入するぞ！！！！！ ● フロントエンド/バックエンドの一貫したTraceを収集することで、１リクエストに対する全体の処理時間やボトルネックの特定を容易にする ● リクエスト全体の総処理時間ごとの可視化 ● SpanとLogがつながっていることで、Spanごとの詳細な動きがすぐに追える ● Traceに属性を追加することによる拡張性メリット

Slide 11

Slide 11 text

Slide 12

Slide 12 text

©MIXI 実装するぞ！！！！！

Slide 13

Slide 13 text

©MIXI 実装: フロントエンド Next.jsで組まれたフロントエンドに手動計装 Point Default Spanを無効化 ● 不要なSpanがあったりなので、無効化した ● Samplerを用いて、 next.span_type を含むSpan を除外 class CustomSampler implements Sampler { shouldSample( _context: Context, _traceId: string, _spanName: string, _spanKind: SpanKind, attributes: Attributes ): SamplingResult { // next.span_typeが存在する場合は、 NextJSのDefault Spanなのでサンプリングしない if ("next.span_type" in attributes) { return { decision: SamplingDecision.NOT_RECORD, }; } return { decision: SamplingDecision.RECORD_AND_SAMPLED, }; } }

Slide 14

Slide 14 text

©MIXI 実装: フロントエンド Next.jsで組まれたフロントエンドに手動計装 Point Default Spanを無効化 ● 不要なSpanがあったりなので、無効化した ● Samplerを用いて、 next.span_type を含むSpan を除外 Point CloudPropagatorでCloud Traceへ伝搬 ● フロントエンドとバックエンドでTraceを繋げる必要があるため、 opentelemetry-cloud-trace-propagator の CloudPropagatorで用いてTrace IDを送る // Cloud Traceで利用するために、 CloudPropagatorを使って X-Cloud-Trace-Contextの形式でTraceを伝搬させる const propagator = new CompositePropagator({ propagators: [new CloudPropagator()], }); propagation.setGlobalPropagator(propagator);

Slide 15

Slide 15 text

©MIXI 実装: バックエンド Railsで組まれたバックエンドに自動計装 Point GraphQLに対応 ● graphql-rubyを利用しているので、 ActiveSupport::Notifications を用いてGraphQL でのtraceも取得する # graphql-rubyで発生するActiveSupport::Notificationsを利用する # ref: https://graphql-ruby.org/queries/tracing#activesupportnotifications trace_with(GraphQL::Tracing::ActiveSupportNotificationsTrace) notifications = [ 'lex.graphql', 'parse.graphql', 'validate.graphql', 'analyze_multiplex.graphql', 'analyze_query.graphql', 'execute_query.graphql', 'execute_query_lazy.graphql', 'execute_field_lazy.graphql', 'authorized_lazy.graphql', 'resolve_type.graphql', ] # デフォルトのNotificationsと上記のNotificationsをマージして設定 config.google_cloud.trace.notifications = Google::Cloud::Trace::Railtie::DEFAULT_NOTIFICATIONS + notifications

Slide 16

Slide 16 text

©MIXI 実装: バックエンド Railsで組まれたバックエンドに自動計装 Point GraphQLに対応 ● graphql-rubyを利用しているので、 ActiveSupport::Notifications を用いてGraphQL でのtraceも取得する # ログとTraceを紐付けるためのフィールド 'logging.googleapis.com/trace': "projects/[project-name]/traces/#{trace_id || ''}" , Point 構造化ログにtraceに関するフィールドを追加 ● 構造化ログに logging.googleapis.com/trace を付け足すことで、Cloud Traceに該当するTrace ID にSpanを追加すると同時にログとの紐づけを行う

Slide 17

Slide 17 text

Slide 18

Slide 18 text

©MIXI 実装: その他 Point バックエンド側のNGINXでヘッダー編集 ● X-Cloud-Trace-Contextからtrace_idを抽出し、 X-Request-Idヘッダーへ設定することで、バックエンド側でtrace_idを扱えるようにする # X-Cloud-Trace-Contextからtrace_idを抽出 map $http_x_cloud_trace_context $trace_id { ~^([0-9a-f]+)\/ $1; default $request_id; } log_format json escape=json '{' '"request_id":"$trace_id"' '}' Point opentelemetry-collectorの構築 ● フロントエンドからCloud Traceへtraceを送出するためにSidecarとして構築