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

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

ただいまの
回答率

88.06%

LaravelのAuth::userにjavascriptからデータを保存するには

解決済

回答 1

投稿

  • 評価
  • クリップ 0
  • VIEW 394

score 4

前提・実現したいこと

※マーク私は初めてポートフォリオを制作している独学プログラミング初心者です。🔰

Laravelで学習ゲームができるサイトを作っています。
ログインユーザーの最高得点をDBに保存し、さらにそれを上回る点数を随時更新していく機能を実装したいと考えています。
しかし、ゲームの主な機能(正誤判定、点数計算など)をjavascriptで書いてしまっていて、phpと連携してデータを受け渡しする必要があります。

[php側でする事]
LaravelのAuth::userでuserの最高得点を取得←OK
[javascript側]
phpから最高得点をもらい、実際にプレイしたゲームの点数と比較、超えた場合は新しい最高得点を更新するためにphpに点数を送る(もしくはjavascriptでデータベースにアクセスして保存)

phpで取得した最高得点をjavascriptに送ることはjsonを使ってできました。
その後のデータベースへの保存のやり方がわかりません。

教えていただきたい事

上の機能実装するためにはどんな手法を取るのが簡単で推奨されるのかを教えて頂きたいです。
具体的には、javascript側で計算された点数を、(phpからjsonで渡ってきた)過去最高得点と比較し、最高得点を更新した場合にデータベースを更新する機能の実装方法が知りたいです。
 

試したこと

phpからjsonでjavascriptに最高得点を渡す

//データベースからのユーザー情報取得
$recordScore = $user->recordScore;

//jsonでjavascriptに渡す
<script>
const recordScore = json($recordScore);
</script>

javascriptでcookieに最高得点を保存

if(recordScore < ゲームで記録した点数){
      let recordScore = ゲームで記録した点数;

      //cookieに保存
      document.cookie = "brain_calculate_recordScore=" + recordScore;
    }

phpでcookieからデータベースに保存

@if(isset($request->cookie['brain_calculate_recordScore']))
  @php
    //2回目のプレイのため、jsonで渡す値を更新する役割
    $recordScore = $request->cookie['brain_calculate_recordScore'];
  @endphp
@endif

上記のやり方は、phpがcookieにアクセスするためににページをリロードする必要があるため、うまくいきませんでした。

補足情報(FW/ツールのバージョンなど)

他にも、調べたところAjaxを使ったやり方やjavascriptから直接アクセスする方法もあるっぽいことが分かったのですが、内容がよくわからなかったのと、自分の状況にあっているかが知りたかったため、質問させていただくに至りました。

初心者ですので至らない質問かもしれません。お優しくご回答いただけるとありがたいです。よろしくお願いします。

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

+4

具体的には、javascript側で計算された点数を、(phpからjsonで渡ってきた)過去最高得点と比較し、最高得点を更新した場合にデータベースを更新する機能の実装方法が知りたいです。

一般的にはAjaxのような非同期通信で保存を行います。
ただ、初心者ということであればまずはフォームでデータを送信して保存するところからをお勧めします。

  1. formタグでフォームを作成する
  2. formタグ内にinput設置する
  3. JSでinputタグのvalueに得点をセットする
  4. とりあえず「最高得点を送信してランキングに参加しますか?」のような表示をしておき
  5. フォームが送信されたらPHPで保存する

ような感じでまずは一旦実装し
その後、余力があるようでしたらそ1~4をajaxを使う形に書き換えるようなステップで学習していくのが良いかと思います。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/08/01 00:11

    一般的にはAjaxのような非同期通信で保存を行います。>>>

    一般的にはAjaxを使うのですね。
    AjaxとLaravelの連携は一般的ですか?


    ただ、初心者ということであればまずはフォームでデータを送信して保存するところからをお勧めします。>>>

    なるほど!
    「ランキングに参加しますか?」のアイデアは気付きませんでした。
    formの実装も試みましたが、submitボタンなしに送る方法を探しているところでした。。
    とりあえず参加しますかボタンで記録する方法をとってみます。

    キャンセル

  • 2020/08/01 14:33

    > AjaxとLaravelの連携は一般的ですか?

    比較的一般的ですが、これが必須であありません
    私の思考として基礎を固めていく事をお勧めしたいです。
    ajaxでのハマりどころの1/3ぐらいはフォームで送信でハマる事だと思います。
    フォーム未経験でajaxでハマった場合、それはajax固有の問題なのか調べるすべがなくなるので
    まずはより簡単なフォームでの送信を行ってから、ajaxを使用し、ajaxでハマった場合はフォームと比較しつつ進めることで自力で突破する能力がつくと思います。

    キャンセル

  • 2020/08/01 15:48

    なるほど、よくわかりました。

    ajaxはまだ早そうなのでformのみでの実装を試みます。
    ご回答ありがとうございました。

    キャンセル

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

  • ただいまの回答率 88.06%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る