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

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

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

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

7592閲覧

サーバでクリックログを取る方法

kyle

総合スコア11

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2017/06/26 11:42

編集2017/06/26 12:45

画像をクリックした時、遷移先サイトのサーバや画像があるサーバではないサーバでクリックしたことをチェックしたいです。今考えているのは以下のような形式です(クリックするとsample2.comに遷移するけれども、sample.comでもクリックを把握できるようにしたいです)。

html

1<div onclick="notifyServer('http://sample.com/click')"> 2 <a href="http://sample2.com/"> 3 <img src="省略"> 4 </a> 5</div>

notifySeverをどのような関数にすれば、sample.comが情報を取得できるでしょうか?また、もし他に良い方法があれば教えてください。

なお、上記のようなシステムを作ることが目的なので、webサービスなどを利用することは考えていません。

よろしくお願いします。

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

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

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

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

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

h_daido

2017/06/26 12:24 編集

こちら目的は何になりますか?アクセス(クリック数)解析とか?というのも、単純なアクセス解析でよければ簡単で便利なサービスがごまんとあります。
kyle

2017/06/26 12:43

コメントありがとうございます。作ることが目的なので、サービスを使うことは考えていません。
guest

回答1

0

ベストアンサー

基本的には以下ステップになります。

1.jsでイベントを補足(これはnotifyServer?を行なっている箇所)。Ajaxリクエストをsample.comに対して発行する
2.sample.com側でリクエストを受けて処理を行う。

1はここで書くよりいいブログ記事がたくさんあるので、そちらにおまかせします。生のjavascriptで書くと大変なので、jQuery(というライブラリがあります)を使用したほうがいいでしょう。

あえてサンプルをしめすならば、

html

1<head> 2<!-- headタグ内に以下スクリプトを書いてjQueryを読み込む --> 3<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 4</head> 5

javascript

1function notifyServer(){ 2 // 引き渡すデータを作成 サンプル 3 var formData = {sample: 'aaa', hogehoge: 'fugafuga'}; 4 // Ajax開始 5 $.ajax({ 6 url: 'http://sample.com/hogehoge.json', // ここは2.sample.com側で処理を行う対象のURL 7 type: 'GET', 8 dataType: 'json', // jsonじゃなくてもいいけど、jsonにすることが多い 9 data: formData, 10 timeout: 5000, 11 success: function(data){ 12 // 通信成功時の処理を記述 13 }, 14 error: function(){ 15 // 通信失敗時の処理を記述 16 } 17 }) 18} 19

というかんじです。

2.sample.com側でリクエストを受けて処理を行う。
はそれこそsample.comのフレームワークやスキーム次第でさまざまですね。

投稿2017/06/26 13:03

h_daido

総合スコア824

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問