JavaScriptの変数の値をPHPへ渡す

php
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta charset="utf-8">
5    <title>位置取得</title>
6 <!DOCTYPE html>
7<html>
8<head>
9    <meta charset="utf-8" />
10    <title>Geolocation Sample</title>
11</head>
12<body>
13<script type="text/javascript">
14    if (navigator.geolocation) {
15        // 現在の位置情報取得を実施
16        navigator.geolocation.getCurrentPosition(
17        // 位置情報取得成功時
18        function (pos) { 
19                var location1 = pos.coords.latitude;
20                var location2 = pos.coords.longitude;
21        },
22        // 位置情報取得失敗時
23        function (pos) { 
24                var location ="<li>位置情報が取得できませんでした。</li>";
25                document.getElementById("location").innerHTML = location;
26        });
27    } else {
28        window.alert("本ブラウザではGeolocationが使えません");
29    }
30</script>
31    <ul id="location">
32    </ul>
33
34      <?php
35        //  ログ・ファイルに追記下記モードでオープン
36        $file = @fopen('5-37.log', 'ab') or die('ファイルを開けませんでした!');
37        //  ファイルのロック
38        flock($file, LOCK_EX);
39        //  ファイルの書き込み
40        fwrite($file, implode("\t", $url) ."\n");
41        //  ロックの解除
42        flock($file, LOCK_UN);
43        //  ファイルを閉じる
44        fclose($file);
45        print 'アクセスログを記録しました。';
46      ?>
47  </body>

//////////////////////////////////
追記
//////////////////////////////////
色々調べた結果、index.php(内のJavascript）でlocation1とlocation2の値を取得し、send.phpで受け取ったlocation1とlocation2を表示＆ファイル書き込みを行いたいです。表示＆書き込みのやり方は分かるんですが、データの渡し方がわかりません。

index.phpのlocation1とlocation2をsend.phpへ渡す方法を教えて下さい。

index.php

php
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta charset="utf-8">
5    <title>位置取得</title>
6 <!DOCTYPE html>
7<html>
8<head>
9    <meta charset="utf-8" />
10    <title>Geolocation Sample</title>
11</head>
12<body>
13  <?php
14    $data[0];
15  ?>
16<script type="text/javascript">
17  
18    if (navigator.geolocation) {
19        // 現在の位置情報取得を実施
20        navigator.geolocation.getCurrentPosition(
21        // 位置情報取得成功時
22        function (pos) { 
23                var location ="<li>"+"緯度：" + pos.coords.latitude + "</li>";
24                location += "<li>"+"経度：" + pos.coords.longitude + "</li>";
25                document.getElementById("location").innerHTML = location;
26                
27        },
28        // 位置情報取得失敗時
29        function (pos) { 
30                var location ="<li>位置情報が取得できませんでした。</li>";
31                document.getElementById("location").innerHTML = location;
32        });
33    } else {
34        window.alert("本ブラウザではGeolocationが使えません");
35    }
36</script>
37    <ul id="location">
38    </ul>
39
40  </body>

send.php

php
1<?php
2
3        $num = isset($_POST['hidden_input']) ? $_POST['hidden_input'] : null;
4
5    //  ログ・ファイルに追記下記モードでオープン
6        $file = @fopen('5-37.log', 'ab') or die('ファイルを開けませんでした!');
7        //  ファイルのロック
8        flock($file, LOCK_EX);
9        //  ファイルの書き込み
10        fwrite($file, implode("\t", $url) ."\n");
11        //  ロックの解除
12        flock($file, LOCK_UN);
13        //  ファイルを閉じる
14        fclose($file);
15        print 'アクセスログを記録しました。';
16?>

行動規範の内容に同意します

回答2件

ベストアンサー

調べられているようでご存知かもしれませんが、
Ajaxってめんどくさいので、jQueryなんて使ってみては如何でしょうか？

とりあえず、index.phpの、ヘッダに

html
1<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

を追記し、
送信処理を行いたいJavaScriptのところに、

html
1// send.phpにおくりたいデータをjSON形式で書く
2var $map = {"location1": localtion1, "location2": location2};
3
4//ajaxで読み出し
5$.ajax({
6	type: 'POST',
7	url: './send.php',
8	data: $map,
9}).done(function(data){
10	// ここに処理が完了したときのアクションを書く
11	alert("送信完了！\nレスポンスデータ：" + data);
12});

をかけばできそうな気もします。（コードみてませんが）

投稿2016/12/07 14:42

nnahito

総合スコア2006

ryo-dev

2016/12/07 15:01

できる希望を持てた回答だったので、選ばせてもらいました。 JavaScriptの勉強も必要ですね

nnahito

2016/12/07 19:06

ありがとうございます。完成することを祈っております

行動規範の内容に同意します

処理の順番について理解しましょう。

ユーザーがURLにアクセスする。
↓
WEBサーバがPHPを処理してHTMLをブラウザに返す。
↓
HTML内のJavaScriptをブラウザが解釈し実行する

通常このような処理の流れになりますから、JavaScript から PHP に値を渡すことはできません。
そのような処理をしたい場合は ajax （非同期通信処理）を行うことになります。

ユーザーがURLにアクセスする。
↓
WEBサーバがPHPを処理してHTMLをブラウザに返す。
↓
HTML内のJavaScriptをブラウザが解釈し実行する
↓
JavaScript 内の ajax 処理を走らせ、非同期で PHP にアクセスする
↓
PHPが処理し、結果をブラウザに返す
↓
レスポンスをJavaScriptが受けて、結果に応じて処理する

という流れになります。

投稿2016/12/06 16:16

退会済みユーザー

総合スコア0

ryo-dev

2016/12/06 16:19

ネットで調べたんですが、やっぱり非同期しか方法はないですか、方法を調べたんですが、やりかたが複雑で理解できませんでした。

退会済みユーザー

2016/12/06 16:22

いきなり難しいことをやろうとしているだけのことですから、地道に学習を続けましょう。

ryo-dev

2016/12/06 16:22

結果としては、現在は URLにアクセスする　　↓ JavaScriptが処理をして、表示なんですが、表示と共にPHPで.logファイルに書き出しをしたいんです。

退会済みユーザー

2016/12/06 16:26

やりたいことは理解してますよ。改めて繰り返す必要はありませんよ。

ryo-dev

2016/12/06 16:28

理解してもらえて嬉しいです。他の質問サイトで、散々な事を言われて来たばかりだったのでｗ

ryo-dev

2016/12/06 17:08

index.phpで値を取得し、値をsemd.phpへ渡し、send.phpで表示＆ファイルへ書き込みを行えばいいですか？

退会済みユーザー

2016/12/06 17:26

具体的に書いてもらわないと困ります。「index.phpで値を取得」なんの値？「send.phpで表示」何を表示？「値をsemd.phpへ渡し」どんな方法で渡す？

ryo-dev

2016/12/06 17:41

追記の箇所を訂正させていただきました。

退会済みユーザー

2016/12/06 17:45

この辺りが参考になるのでは？ http://qiita.com/katsunory/items/9bf9ee49ee5c08bf2b3d

ryo-dev

2016/12/06 17:52

文字を入力し、それを送信ボタンで送信したいわけじゃないんですよねデータを取得したら自動で送信ってなると、今まだ見つからない状況です。

退会済みユーザー

2016/12/07 05:28 編集

ええと、質問を繰り返しても、そのものズバリの回答は決して書くつもりはありませんよ。 50点のソースを100点にして返すのでは、お金にもならないのに仕事をするようなものですから。あくまで、あなたが理解することが前提ですから、今のソースコードが50点だとしたら、せめて65点とか70点のソースコードにするところまでは頑張ってください。その時には80点、90点まで持っていけるぐらいの回答は致します。「データを取得したら」どういうタイミングでプログラムを実行するのかは、「イベント」という概念を理解しなければなりません。「JavaScript イベント」というようなキーワードで検索してみてください。

ryo-dev

2016/12/07 05:47

わかりました。ググってみます

ryo-dev

2016/12/07 06:31

「onLoad」というものを使えばいいですかね？ http://phpjavascriptroom.com/?t=js&p=event#a_onload

退会済みユーザー

2016/12/07 06:36

試してみて、意図通り動く場合はOK.動かない場合はNG.

ryo-dev

2016/12/07 06:39

教えてもらったサイトのAjaxが理解できていないので、飛ばすことすらできません。もう少し時間が掛かりそうです。