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

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

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

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

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

JavaScript

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

Ajax

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

受付中

WordPressでJavascriptの変数をPHP(singel.php)で使う方法が知りたいです。

mumu1354
mumu1354

総合スコア0

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

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

JavaScript

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

Ajax

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

2回答

0評価

0クリップ

439閲覧

投稿2022/01/14 05:41

編集2022/01/21 10:58

WordPressでJavascriptの変数をPHPに受け渡し、その値をsingle.phpで使うにはどうしたらいいのでしょうか?

【状況】

  1. A(Javascriptから渡ったデータ)をsingle.phpで使う方法がわからない。

php

<?php //WordPressでXMLHttpRequestでPOST通信するための記述(function.phpに記載) function my_ajax() { wp_enqueue_script( 'ajax-script', get_template_directory_uri().'/js/test.js', null, '1.0.0', false ); wp_localize_script('ajax-script','my_ajax_date',array( 'ajax_url' => esc_url(admin_url( 'admin-ajax.php')), 'nonce' => wp_create_nonce( 'my-ajax-nonce' ), 'action' => 'my-ajax-nonce', )); } add_action( 'wp_enqueue_scripts', 'my_ajax', 1 );?>

javascript

const data ={ ajaxurl: my_ajax_date.ajax_url, action: my_ajax_date.action, _nonce: my_ajax_date.nonce, }; if(window.fetch){ let params = new URLSearchParams(); params.append("action", data.action); params.append("msg", "A(phpに渡したいデータ)"); params.append("_nonce", data._nonce); fetch(data.ajaxurl,{ method:'POST', credentials:"same-origin", body:params }).then(function(response){ if (response.ok) { response.text().then(function(text){ console.log(text);//A(phpに渡したいデータ)が問題なく表示される }); }, function(error){ }); } else { alert('ご使用のブラウザはサポートしていません。Chrome, firefox, Edge等の最新版のブラウザをご使用下さい'); }

php

<?php //(function.phpに記載) function test() { if(check_ajax_referer('my-ajax-nonce', '_nonce', false)){ //これ以降が処理されない $msg = filter_input( INPUT_POST , 'msg' ); echo($msg);//$msgをsingle.phpで使う方法を知りたい。 die(); } } add_action('wp_ajax_my-ajax-nonce', 'test'); add_action('wp_ajax_nopriv_my-ajax-nonce', 'test'); ?>

つぎの記事を参考にしました。
filter_inputを参考 【Javascript】Ajaxを使ってサーバ(PHP)にデータを渡す方法
wp_create_nonceの使い方を参考:WordPressでAJAX通信する方法
fetchの使い方を参考:WordPress の Ajax 処理で fetch を試してみる
ajax用のアクションフックの使い方を参照 wordpressで使ってみるajaxの基本
check_ajax_referer()の使い方を参照WordPressのAjaxにNonceを追加
check_ajax_referer()の使い方を参照WordPress, セキュア処理で使うnonce関数のちがい(CSRF対策)

[2022/1/17 追記]
もし現状のやり方で不可能なら、CSSのdisplayの変更で行う予定です。

良い質問の評価を上げる

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

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

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

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

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

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

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

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

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

tabuu

2022/01/14 06:22

出力されたHTMLは順番にスクリプトを処理していますか? 先:var ajaxurl = '...'; 後:const url = ajaxurl; params.append("nonce", "<?php echo wp_create_nonce( 'xxx' ); ?>"); このコードはHTMLとしてどのように出力されていますか?
mumu1354

2022/01/17 07:48

javascript上で確認したところ 先:var ajaxurl = '...'; 後:const url = ajaxurl; の順番にスクリプト処理できていました。 <?php echo wp_create_nonce( 'xxx' ); ?>はwp_localize_scriptで出力をするよう変更いたしました。
tabuu

2022/01/20 08:10

//これ以降が処理されない $msg = filter_input( INPUT_POST , 'msg' ); echo($msg); ではないですか? ajaxで500エラー等でていないですか?
mumu1354

2022/01/20 13:53 編集

申し訳ありません。記入ミスです。 修正しました。ご指摘ありがとうございます。 ajaxで500エラー もなく statusはすべて200です。 このecho($msg); で、single.php(投稿ページ)に$msgは表示はされないものなのでしょうか?
tabuu

2022/01/21 00:18

>このecho($msg); >で、single.php(投稿ページ)に$msgは表示はされないものなのでしょうか? >console.log(text);//A(phpに渡したいデータ)が問題なく表示される とあるのでalert関数等で表示することは可能と思います。 single.php(投稿ページ)に$msgは表示、とはどのような挙動を想定していますか?
mumu1354

2022/01/21 01:26

具体的には$msgの値によってphpの変数の値を変更したいです。 例 <?php $friedEgg = null; if($msg === 'soysauce'){ $friedEgg = '醤油'; }elseif($msg === 'salt'){ $friedEgg = '塩'; }else{ $friedEgg = 'なにもかけない'; } echo $friedEgg; ?>
tabuu

2022/01/21 01:58

JavaScriptはクライアントで動くのでサーバで動くPHPに影響を与えることはできません。 該当の処理をJavaScriptで実行してください。

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

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

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

ただいまの回答率
87.20%

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

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

質問する

関連した質問

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

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

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

JavaScript

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

Ajax

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