質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Fluentd

Fluentdは、オープンソースのログ収集ツールです。ログの収集方法、ログの記録先などのログデータ処理を柔軟にカスタマイズでき、インプットおよびアウトプットが全てプラグインとして実装されています。

Q&A

解決済

2回答

421閲覧

jQueryのajaxを使い、fluentdにログを吐き出す

yukkenoottuna

総合スコア51

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Fluentd

Fluentdは、オープンソースのログ収集ツールです。ログの収集方法、ログの記録先などのログデータ処理を柔軟にカスタマイズでき、インプットおよびアウトプットが全てプラグインとして実装されています。

0グッド

1クリップ

投稿2018/04/18 08:15

編集2018/04/18 11:54

WEBアプリケーションにて、フロント側からajaxを用いて非同期でfluentdにログを吐きたいのですが、うまくjson形式でデータを送れていないのか、400が返ってきてしまいfluentdに格納できていない状態です。
curlコマンドではうまく格納できているためfluentdの設定がおかしいわけではないと思っています。
どのように修正すればよいでしょうか。

fluentdの設定(td-agen3)

<match access.*> @type copy <store> @type stdout </store> <store> @type elasticsearch host hogehoge.com port 9200 index_name access type_name log </store> </match> <source> @type http port 8888 body_size_limit 32m keepalive_timeout 10s add_remote_addr true format json cors_allow_origins ["http://hogehoge.com"] </source>

curlコマンド
→ fluentdにきちんとはいる(curl時はcors_allow_origins未設定)

curl http://hogehoge.com:8888/access.log -d '{"type":"foo", "timestamp":"2013-11-19 00:51:34"}'

フロントでのjQueryコード(jQuery 3.1.1)
POST http://hogehoge.com:8888/access.log 400 (Bad Request)と出る

<script type="text/javascript"> $(function () { $.ajax({ type : "POST", url : "http://hogehoge.com:8888/access.log", contentType : "application/x-www-form-urlencoded", dataType : 'JSON', data : { "type" : "foo", "timestamp" : "2013-11-19 00:51:34" } }); }); </script>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

自己解決

下記の設定とコードに変更したところうまくいきました。
ありがとうございました。

fluentdの設定(td-agen3)

<match access.*> @type copy <store> @type stdout </store> <store> @type elasticsearch host hogehoge.com port 9200 index_name access type_name log </store> </match> <source> @type http port 8888 body_size_limit 32m keepalive_timeout 10s add_remote_addr true cors_allow_origins ["http://hogehoge.com"] </source>

フロントでのjQueryコード(jQuery 3.1.1)

<script type="text/javascript"> $(function () { var data = { "type" : "foo", "timestamp" : "2013-11-19 00:51:34" }; $.ajax({ type : "POST", url : "http://hoge.com:8888/access.log", dataType : 'json', scriptCharset : 'utf-8', data : "json=" + escape(JSON.stringify(data)) }); }); </script>

投稿2018/04/18 11:57

yukkenoottuna

総合スコア51

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

jQuery自体の動作確認はしていません。
目に見えている範囲で、アドバイスします、

まず書式で誤りもありました

json

1data : { 2 "type" : "foo", 3 "timestamp" : "2013-11-19 00:51:34", 4}

正しくは、「,」を省いて

json

1data : { 2 "type" : "foo", 3 "timestamp" : "2013-11-19 00:51:34" 4}

たぶん前準備、キャッシュの操作なども必要かもしれません。

参考
$.ajax();の覚え書きーapplication/jsonで送る時のテンプレート
ttps://qiita.com/hrdaya/items/e074b9816ab2da078bdd

投稿2018/04/18 09:03

kawakawa2018

総合スコア1195

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問