标签 Rest API 下的所有文章

WordPress前端,自制拖放区域上传文件的轮子

上个月写过一篇WordPress通过Rest API自定义附件上传接口,那篇文章主要介绍了如何打通前后端,利用Rest API保存“抓取”已知URL的文件。不过在更多的情况下,我们还是需要通过自己的表单上传文件。正好这个月有个项目,有个表单需要拖放文件到指定区域里,提交表单的时候上传文件。如果我用Gravity Forms给的文件上传域,它只有原生的点击选取本地的文件组件,并没有拖放选取文件的组件,所以这里就需要造一个轮子了。

先说结果,最后实现出来是这样子的:
WordPress前端,自制拖放区域上传文件的轮子

文件拖到区域上方,区域会变色;拖入后区域内显示文件名,判断文件格式和尺寸是否合规;点击清除,会重置区域。


查看详细 »

WordPress通过Rest API自定义附件上传接口

有没有想过用WordPress来建立自己的文件存储空间,当作自己的网盘使用?这个业务实现的主要逻辑其实就是自己写一个Rest API接口上传文件到WP的媒体库中。

首先我们需要安装一个插件,这个插件很小,只是给网站后台登录提供Basic认证,并不是用来拓展业务接口的。开通了Basic认证方式,我们才有途径获得使用Rest API更新网站内容的权限,否则Rest API只提供读取权限。插件名称叫做JSON Basic Authentication,官方下载地址:https://github.com/WP-API/Basic-Auth

要做接口,就先创建endpoint。这次我创建两个,一个是用来转存网上的文件的,一个是用来自己上传文件的。

add_action( 'rest_api_init', function () {
	//转存
	register_rest_route( 'brain1981/v1', '/catch/', array(
		'methods' => 'POST',
		'callback' => 'brain1981_api_post_catch',
	) );
	//上传
	register_rest_route( 'brain1981/v1', '/stream/', array(
		'methods' => 'POST',
		'callback' => 'brain1981_api_post_stream',
	) );
});

查看详细 »

WordPress AJAX玩法,通过自带的AJAX钩子和通过Rest API两种方法对比

更新于2020年5月2日:本文第一版有一些概念错误,现已修正

基于WordPress项目的开发中,经常会需要用到AJAX请求。相较于原生的前后端实现,WordPress其实提供了两种方法可以更便捷的实现AJAX。

WordPress自带的AJAX钩子实现AJAX

这个方法是现在用的比较多的。原理是前端向“/wp-admin/admin-ajax.php”这个接口发送请求,这个接口会根据请求的action值来处理数据。而根据不同的action值,利用钩子“wp_ajax_nopriv_[action]”和“wp_ajax_[action]”去编写自己的程序处理和返回数据。
如果是要写数据,先在页面生成nonce:

1
$xprofile_nonce = wp_create_nonce ('xprofile_nonce');

查看详细 »

WordPress Rest API 学习笔记(一)

接到一个需求,要把公司的一个酒店行业的WordPress网站里的几百家酒店数据导出为CSV文件,以便其他开发人员把它转成需要的格式开发APP。觉得这是一个比较笨的需求,WP是一套十分便捷的CMS,用WP后台管理这些酒店数据很容易,但对方是要拿静态的CSV文件,转格式后,就要导入另一套不如WP好用的后台。同一套数据两边分别管理,实在是浪费人力。我们为什么不能直接通过WordPress后台同时管理网站和APP数据呢?

由这个切入点,让我想起了WP REST API,从最近发布的WP的4.7版开始,已经官方支持REST API,不需要安装任何插件了。这也是现在的技术趋势,使得WordPress不再局限于PHP语言,能够导出JSON数据被任何其他开发语言和平台所使用。

REST API的基本概念就是直接把网站数据通过类似
http://yourdomain.com/wp-json/wp/v2/posts/
http://yourdomain.com/wp-json/wp/v2/pages/
这样的URL转成JSON
这个URL可以再定义得细一些,比如 查看详细 »