LoginSignup
@osan0823

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

JavascriptでMySQLのデータベースから情報を取得したい【質問初心者】

Q&A

Closed

PHPJavaScript

JavascriptでMySQLのデータベースから情報を取得したいです。

ブラウザ上で家計簿を作りたくて、Visual Studio Codeで、下記の記事を参考にJavascriptでカレンダーを作りました。
https://nyanblog2222.com/programming/javascript/2749/

各日付の下にphpで作ったデータベースマネージャーにある、その日に使った合計金額を取得する関数を利用してJavascriptに戻そうとしたのですが、undefinedと出てきてうまくいきません。
スクリーンショット 2022-08-30 11.15.07.png

発生している問題・エラー

Uncaught ReferenceError: require is not defined

該当するソースコード　Javascript

// データベース接続
const mysql = require('mysql');
const connection = mysql.createConnection({
host: 'localhost',
user: 'root',
password: 'root',
database: 'kakeibo'
});
connection.connect((err) => {
if(err) throw err;
console.log('Connected');
});

自分で試したこと

jQuery.Ajaxを使って日付情報をphpのデータベースマネージャーに渡し、合計金額を返そうとしました。
Javascriptでデータベースに直接接続する方法も試してみましたが、いずれも上手くいきませんでした。
require関数を利用するにはNode.jsを使用すると書いてありましたが、visual studio codeで検索したものはインストールしました。
他にも「git」、「jQuery」等をインストールするとあったりしたのですが、インストールした後どこに保存されていて、どう呼び出せばいいのかもわかりません。

プログラミング初心者で、人と関わりながら作成するのも初めてなので、質問の仕方等でもご指摘部分があれば改善いたしますので何卒よろしくお願いします。

0 likes

2Answer

STSynthe
@STSynthe

JavascriptでMySQLのデータベースから情報を取得したいです。

それは、サーバー側でNode.JSを利用し、JSONなどの形式にしてフロントのjQueryで受け取ると言うことですか？

各日付の下にphpで作った

PHPで作ってるなら帰ってきた生データをconsole.logなとで確認しましたか？

相当するフロントのJavaScriptとphpのコードも掲載してください。
提示された該当するソースコードはnodejsのコードです。接続までのコードも書かれても何のデータも返してないのでそのコードには意味がありません。

一応PHPやら「require関数を利用するには」とあるので念のために申し上げておきますが、Node.JSとECMA Script(JavaScript)は別物になります。

1Like

Comments

  1. @osan0823

    Questioner

    コメントありがとうございます。
    Node.JSとJavaScriptが別物という認識がなかったので、require関数を使用すればPHPの関数を利用できるものだと思い込んでおりました。
    使用している関数が、日付を入れればデータベースから合計金額を返えすことができるのは確認できているのですが、Javascript側で抽出した日付データがPHP側に送れていなかったので、質問した次第でした。
    自分なりに再度いじっていたら元の形がわからなくなってしまったので、現状を送ります。
    〜Javascript〜

    var theDate = createDate(year, month + 1, count);　// 日付を取得できることは確認済み
    fetch('dbmanager.php',{
    　　　　method: 'POST',
    headers: {'Conect-Type': 'application/json'},
    body: JSON.stringify(theDate)
    })
    .then(response => response.json())
    .then(res => {
    　　　　calendar += "<td class='today'>"
    + count
    + "<br>"
    + res
    + "</td>";
    });

    〜dbmanager.php〜
    $raw = file_get_contents('php://input');
    $data = json_decode($raw);
    $sumYen = $dbm->day_sum_rireki($raw);
    echo json_encode($sumYen);

    〜エラー内容〜
    Uncaught (in promise) SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

    先ほどいただいたアドバイスからすると、これもJavascript環境にNode.jsのものを記載してしまっている状態という認識でおります。

    一度、Node.jsを学んで環境から作り替えてみようかなと思っております。



PondVillege
@PondVillege

require関数を利用するにはNode.jsを使用すると書いてありましたが、visual studio codeで検索したものはインストールしました。他にも「git」、「jQuery」等をインストールするとあったりしたのですが、インストールした後どこに保存されていて、どう呼び出せばいいのかもわかりません。

これ，もう少し具体的に説明いただけますでしょうか？
VSCodeで検索，というのは拡張機能の検索になってしまっていませんか？

0Like

Comments

  1. @osan0823

    Questioner

    コメントありがとうございます。
    おっしゃる通り、拡張機能の欄で検索をかけておりました。
    Node.js Modules Intellisenseと出てきたので、これをインストールすれば使えるようになるものだと認識しておりました。

Your answer might help someone💌

LoginSign Up