javascript - 使用直接在我的 wordpress 页面中嵌入 javascript 的 ajax(和 jquery)从远程服务器 php 文件获取一个简单的 JSONP 对象

Question

我在静态 wordpress 页面上编写了一些 php(使用 include-php-in-pages-and-posts 插件)，它从远程服务器获取 JSON 对象。这当然只在页面加载时起作用一次，然后再也不会起作用(因为它不是 ajax)。

但是由于调用是通过自己的 php 和 API url 调用发送到服务器的，所以我确定不需要我的 php 并且必须有一些简单的 ajax(可能使用 jquery)我可以直接在我的 html wordpress 页面上编写，从远程服务器获取 JSON 对象，所有这些都只需要我直接在我的页面上使用的 javascript。

(我想它会使用来自远程服务器的 JSONP 格式)- 类似于:

$.get( "my_url.php_with_API-KEY_etc", data, success, "jsonp" );

或

$.getJSONP("my_url.php_with_API-KEY_etc"

如您所见，我有点迷路了。这个论坛的问题太“初学者”了吗？或者有人可以帮忙吗？

如果太入门了，有教程推荐吗？ (我已经尝试了谷歌上出现的前 3 页中的所有内容)。我觉得这是一个如此简单的请求，不应该这么难。

PHP 代码(当我通过“included-php-on-pages-and-posts”插件使用它时，它仅适用于页面加载)是:

[php]
ob_start();
$curl_handle=curl_init();
curl_setopt($curl_handle, CURLOPT_URL,'http://us01.proxy.teleduino.org/api/1.0/328.php?k={MY-API-KEY-HERE}&r=getAnalogInput&pin=14');
curl_setopt($curl_handle, CURLOPT_CONNECTTIMEOUT, 2);
curl_setopt($curl_handle, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($curl_handle, CURLOPT_USERAGENT, 'Your application name');
$results = curl_exec($curl_handle);
curl_close($curl_handle);
$data = json_decode($results, true);
$mess = $data['message'];
$stat = $data['status'];
$moisture = $data['response']['values'][0];
$time = $data['response']['time'];
[/php]

挣扎了很多天，阅读了数百个其他相关答案，但似乎没有答案可以简单地解释我如何使用 ajax/jquery 和 js 单独为 wordpress 做到这一点。提前谢谢你。

Answer 1

我会创建一个 Shortcode 插件来解决这个特定情况。像 include-php-in-pages-and-posts 这样的插件所做的是简码。而且您尝试的内容太复杂而无法与 HTML 内容放在一起(并且在 WP 可视化/文本编辑器中可能会发生各种代码修改)。

How to Use AJAX in a WordPress Shortcode? 上有一个完整的插件示例

• 根据您的喜好重命名短代码，例如，add_shortcode( 'teleduino', array( $this, 'shortcode') );。

• 您的实际 PHP 代码必须适应方法 shortcode() 和 get_random_posts()。此 get_random_posts() 将是您的 get_teleduino_response()，专门负责获取响应并返回数据或错误消息。然后在 shortcode() 中处理结果并进行实际输出。

• Shortcode 还输出一个按钮，触发 Ajax 调用，在 query_rand_post() 中再次执行 get_random_posts()。

• 总而言之，您必须使这三个方法(类中的函数)适应您的逻辑。

• 我认为您可以删除 ob_start 并使用 wp_send_json_success( $results ); 将响应发送回 jQuery，或者对结果并仅返回相关信息

• 也许您可以使用 wp_remote_get() 而不是 cUrl