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

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

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

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

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

Ajax

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

Q&A

0回答

510閲覧

自作サイトでスマホからログインできない問題

otftrough

総合スコア476

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

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

Ajax

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

0グッド

0クリップ

投稿2018/07/05 06:54

編集2022/01/12 10:55

WEBサービスというほどのものではありませんが、自分がちょっとメモを残す用とPHPの勉強用に作っているものがあります。
メモ ← こちらです。
人に見られたくない内容を書いたり、複数のメモを残すことができるように、アカウントを作ってアカウント1つにメモ1つという風にしています。

PCでは普通に動くんですが、スマホ(iPhone)だとログインができません。

ログインボタンは、タグのonclick属性でjavascriptの関数(function login())に飛んで、その中でajaxでログイン用のphpファイルにアカウント名とパスワードをPOSTで送っています。
なぜかというと、アカウント作成用のフォームの中に、作成ボタン(type=submit)とログインボタン(type=button)を置いてあって、テキストボックスを共用しているからです。
下記のコードを見るとわかりますが、ログインボタンは自分自身(index.php)にpostでデータを送った後でlocation.reload();でindex.phpをリロードしています。
ログイン処理は、具体的には、データベースにアカウント名とIPアドレス+端末情報を保存しているだけで、ページをリロードすることでそのアカウント名に紐づいたメモを表示するという内容です。
スマホでログインしようとすると、ただリロードされるだけでログイン処理がされません。
なぜでしょうか?
解決方法は何となく検討ついていますが、原因がわからないので考えてほしいです。

index.php

php

1<!DOCTYPE html> 2<html> 3<head> 4 <title>メモ</title> 5 <meta charset="utf-8"> 6 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script> 7 <script type="text/javascript"> 8 function login(){ 9 10 $(function(){ 11 12 $.ajax({ 13 14 type: "post", 15 url: ".", 16 data: "id=" + newLine(document.getElementById("id").value, " ", "+") + "&pw=" + newLine(document.getElementById("pw").value, " ", "+"), 17 done: location.reload() 18 }); 19 }); 20 } 21 22 function logout(info){ 23 24 $(function(){ 25 26 $.ajax({ 27 28 type: "post", 29 url: "logout.php", 30 data: "info=" + newLine(info, " ", "+"), 31 done: location.reload() 32 }); 33 }); 34 } 35 36 function save(){ 37 38 $(function(){ 39 40 $.ajax({ 41 42 type: "post", 43 url: "write.php", 44 data: "text=" + newLine(newLine(newLine(document.getElementById("div").innerText, " ", "+"), "\n", "<br>"), "'", "''") + "&username=" + newLine(document.getElementById("username").innerText, " ", "+"), 45 success: alert("success!") 46 }); 47 }); 48 } 49 50 function newLine(text, a, b){ 51 52 var cl = a.length; 53 if(text.indexOf(a) < 0) return text; 54 while(text.indexOf(a) >= 0){ 55 56 text = text.substring(0, text.indexOf(a)) + b + text.substring(text.indexOf(a) + cl); 57 } 58 return text; 59 } 60 </script> 61 <style type="text/css"> 62 body{ 63 position: relative; 64 } 65 #login{ 66 position: relative; 67 text-align: right; 68 } 69 </style> 70</head> 71<body> 72<div id="login"> 73<?php 74 $user = $_SERVER['REMOTE_ADDR'] . $_SERVER['HTTP_USER_AGENT']; 75 $sqllogin = file_get_contents('../info/mysql/mysql.php'); 76 $sqllogin = substr($sqllogin, 6, mb_strlen($sqllogin) - 9); 77 $sqltxt = explode(",", $sqllogin); 78 $link = new mysqli($sqltxt[0], $sqltxt[1], $sqltxt[2], $sqltxt[3]); 79 $login = ""; 80 //password(username, password), info(username, userinfo) 81 if($link -> connect_error) echo "接続失敗"; 82 else{ 83 //ログイン 84 $id = $_POST['id']; 85 $password = $_POST['pw']; 86 if($id != "" && $password != ""){ 87 88 if($result = $link -> query("select password.password from password where password.username = '" . $id . "'")){ 89 if($row = $result -> fetch_assoc()){ 90 91 if($row['password'] == $password){ 92 93 if($result = $link -> query("delete from info where info.userinfo = '" . $user . "'")){ 94 95 if($result = $link -> query("insert into info (username, userinfo) values('" . $id . "', '" . $user . "')")){ 96 97 echo $id . "でログイン中<input type=\"button\" value=\"ログアウト\" onclick=\"logout('" . $user . "')\">"; 98 $login = $id; 99 } else echo "ng"; 100 } else echo "ng"; 101 } else echo "ng"; 102 } else echo "ng"; 103 } 104 } 105 //ユーザーの検索 106 else if($result = $link -> query("select info.username, info.userinfo from info where info.userinfo = '" . $user . "'")){ 107 if($row = $result -> fetch_assoc()){ 108 109 echo $row['username'] . "でログイン中<input type=\"button\" value=\"ログアウト\" onclick=\"logout('" . $user . "')\">"; 110 $login = $row['username']; 111 } else { 112 113 echo "メモを使うには、新しいアカウントを作成してください。<br><form action=\"newaccount.php\" method=post name=form><input type=text placeholder=アカウント名 name=id id=id><input type=text placeholder=PassWord name=password id=pw><input type=submit value=作成><input type=button value=\"ログイン\" onclick=\"login()\"></form>"; 114 } 115 } 116 } 117 $link -> close(); 118?> 119</div> 120<span style="display: none;" id="username"><?php echo $login; ?></span> 121<div style="position: fixed; left: 0px;"> 122 <input type="button" onclick="save()" value="保存" style="font-size: 3em;"> 123</div> 124<div style="border: solid 1px black; margin-top: 5em" contenteditable="true" id="div"> 125<?php 126if($login != ""){ 127 $sqllogin = file_get_contents('../info/mysql/mysql.php'); 128 $sqllogin = substr($sqllogin, 6, mb_strlen($sqllogin) - 9); 129 $sqltxt = explode(",", $sqllogin); 130 $link = new mysqli($sqltxt[0], $sqltxt[1], $sqltxt[2], $sqltxt[3]); 131 if($result = $link -> query("select memo.memo from memo where memo.username = '" . $login . "'")){ 132 133 if($row = $result -> fetch_assoc()){ 134 135 echo $row['memo']; 136 } 137 } 138} 139?> 140</div> 141</body> 142</html>

追記

参考にしたサイトや書籍はありません。
知りたいことだけをひとつづつ調べて自分で適当に設計しました。
セキュリティについては今のところ気にしていません。
今年中に有料の良いサーバーを借りてもちろんSSLも入れるつもりです。
今は無料のレンタルサーバーで練習用に色々な方法を試しているだけなのでそこは気にしないでください。
データのバックアップですが、今のところ重要な文章を保存していないし消えても大丈夫です。
デバッグですが、どうやって何を使ってするのでしょうか?
僕はテキストエディタで書いたものをアップロードして実際の環境で試して、Chromeのコンソールでエラーの確認をしています。
iPhoneのsafari及びLINEアプリのブラウザで確認をした時にログインできなかったのですが、これらはどうやって処理の内容を追うのでしょうか?
初歩的な質問ですみません。

追記2

location.reload()をdone:に書きました。PCでの動作は改善しましたが、スマホでは変化なし
MySQLのログイン情報は、txtファイルに書いていたのをやめてphpファイルに書きました。
さらに、ファイルをパスワード制限のかかったフォルダに移動しました。
Chromeのデバイス切り替えの機能について調べました。
こんな便利な機能があったんですね。同じようにログインができなくなりました。
上記のソースコードは現在最新のものに書き換えてあります。

追記3

すみません、確かにdone()は適当でした。
ajaxは始めたばかりでほとんどなにも知りません。勉強します。
確かに最初から作り直したほうが楽だとは思います。
それと、わざわざindex.phpで処理をせず、formで別のphpファイルを呼んでそっちで押されたボタンのvalueを取得して処理したほうが確実だとはわかっていますが、なんか興味本位でやってるだけです。
この質問は、「解決方法はわかってるけど今なぜこうなっているのかが知りたい」です。
スマホがWi-Fiの時と4Gの時で動作は変わりませんでした。

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

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

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

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

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

退会済みユーザー

退会済みユーザー

2018/07/05 07:03 編集

何か参考にしたサイト、および書籍がある場合、出展を記述してください。 ぱっと見で脆弱性だらけのプログラムで危険です。
m.ts10806

2018/07/05 06:59

デバッグしてみては?携帯とPCで通っているところが同じかどうか。ログファイルを自身で出力してみると良いです。念のためChromeのdevice切り替えでも確認してみてください。
papinianus

2018/07/05 07:50

とりあえず、今すぐデータバックアップしたほうがいいと思う
m.ts10806

2018/07/05 07:52

ajaxで認証する場合、HTMLが既にある自画面への送信はやめたほうがいいです。location.reload();についても、ajaxには.done()や.fail()など実行結果を受け取る機能があるので、その結果を持って実行すべきでは?非同期なので実行順は保証されません。
gallu

2018/07/05 13:22

MySQLのログイン情報が丸見えなので、こちらもどうにかした方がよいように思われます。全体的に、一度「基礎を丁寧に見直した方が」安全なように見受けられました。
m.ts10806

2018/07/05 21:19 編集

>done() ちゃんと調べて書いてください。お作法丸々無視じゃないですか。動かないものを量産しているだけですよ。既に指摘があるように基礎から見直された方が良いかと。もう最初から作り直した方が楽なレベルです。
sysjojo

2018/07/06 01:16

参考までに、スマホの接続がWi-Fiではなく、3GやLTEの場合、透過プロキシが動作している場合があり、それが原因でキャリアAではOKなのにキャリアBではNG、といったことがあります。私が経験したのは3年くらい前の話ですが、MVNO等ではカウントフリーオプション等を提供しているところもあるので、採用しているキャリアは増えているのではないかと思います。そういったものの可能性があるので、Wi-Fiで試した時と基地局に繋いだときとで動作が変わらないか、等も追記されるとよいかもしれません。
razuma

2018/07/25 03:23 編集

問題解決の方法として、どこまで動いているのか、どの部分が動いていないのかを特定していくと良いと思います。今回の例でいくとどこの処理に入らないからログイン処理が走らないのか?DBに接続はできているのか、postパラメータは受け取れているのか、DBに値は保存されているのか、どのクエリーで値が取れていないのかなどなど。そこで動いていない箇所が特定できてなぜそこが動かないかを考えると言う風になると思います。全体ソースがあれば私がデバッグすることもできますが、上記情報だけだと足りない部分を補って正常ではない状態を作り出さなければならないため少々時間がかかりそうなので一旦はご参考までにコメントとして残しておきます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問