Title: EASY-JS-WPAPI Client HANDLE for the WordPress REST-API Author: Oluwasegun Somefun Published: 2017 年 8 月 22 日 Last modified: 2017 年 9 月 20 日 --- 搜尋外掛 ![](https://ps.w.org/node-wpapi-auth/assets/banner-772x250.png?rev=1732826) 這個外掛**並未在最新的 3 個 WordPress 主要版本上進行測試**。開發者可能不再對這個 外掛進行維護或提供技術支援，並可能會與更新版本的 WordPress 產生使用上的相容性問題。 ![](https://ps.w.org/node-wpapi-auth/assets/icon-256x256.png?rev=1732846) # EASY-JS-WPAPI Client HANDLE for the WordPress REST-API 由 [Oluwasegun Somefun](https://profiles.wordpress.org/oluwasegun27/) 開發 [下載](https://downloads.wordpress.org/plugin/node-wpapi-auth.2.0.zip) * [詳細資料](https://tw.wordpress.org/plugins/node-wpapi-auth/#description) * [使用者評論](https://tw.wordpress.org/plugins/node-wpapi-auth/#reviews) * [安裝方式](https://tw.wordpress.org/plugins/node-wpapi-auth/#installation) * [開發資訊](https://tw.wordpress.org/plugins/node-wpapi-auth/#developers) [技術支援](https://wordpress.org/support/plugin/node-wpapi-auth/) ## 外掛說明 ### Short Description * Easily talk with the WordPress REST-API to access and display your WordPress ( model) data without rest-authentication errors when creating Javascript Themes for consistent views by all users/clients accessing your WordPress site. ### Description and Features * We chose the bundled node-wpapi isomorphic Javascript client, because it is the simplest way to get up and running quickly to display live website data in your installed WordPress website, using a Javascript-controlled Theme or Plugin * The WEB Landscape is changing. Today, we can use Javascript to build WordPress Themes. WordPress becomes our Model, which we can theme with Javascript using the WordPress REST-API. * This plugin was developed to make life easy for web developers who which to create full-fledged Javascript WordPress Themes OR Javascript-PHP WordPress Themes using a Javascript Framework/Library like: jQuery, React, OpenUI5, et.c. for use in a WordPress installation with the wpapi.js rest-client. * It relies on the node-wpapi isomorphic javascript client to access the WP REST- API. The problem with accessing the REST-API using javascript-clients is the headache of authentication issues and private data access, which can hamper fluid display of the web-page, leading to rest-errors when using Javascript to display the data. This plugin works under the hood and makes the javascript-client object,‘ wp’ that interfaces with the WP REST-API globally accessible for direct and easy use in a javascript(.js) file under the scope of a WordPress installation. * It handles three authentication use cases: admin user, non-admin user and for a client from inside a WP installation. Say your WordPress website url is e. g: http://talker-test.com or http://localhost:8080 WordPress switches to Cookie WP Authentication for switched to when an administrator is currently logged in to the WordPress installation. Basic WP-Authentication is switched to when a Client accesses your WordPress website When an authenticated non-admin user, like an Author or Subscriber is currently logged in to your website, it displays data using Basic WP-Authentication. * We then make the WPAPI global as a globally scoped javascript object, wp, for use in a WordPress Installation to talk with the WP REST-API on the go. * So, with added ease, you can start building your next Javascript Themes for WordPress, or accessing the WP REST-API So start coding and talking with the WordPress REST-API and display consistent, unhindered data, as you permit to all your clients, and users. * See Demo WP Installation that shows how this plugin is used to display live website data from the WordPress REST-API In it we created a sample JS-controlled WordPress theme using jQuery and the ‘wp’ object provided by our bundled javascript client, which our plugin has made globally scoped and authenticated. * For more info. and examples, you can check out the documentation of the node- wpapi javascript client at wp-api.org/node-wpapi ### Testing * Go to https://somefunagba.github.io/easyjs-wpapi-rest-client-handle/ * Click on the Demo link: Download a sample zipped Javascript Theme and a .xml import file. * Copy the theme to your Local WordPress Themes directory and Activate it. * If your WP installation has no posts or a single post. Import the downloaded . xml posts * Go to your site-url homepage e.g: http://localhost:8080/ * You should see a demo Blog/News themed website.[Demo Website Image] * Inside the Theme folder, You can play with this theme’s index.js and footer.js files. ## 螢幕擷圖 [⌊STEP4_01: Basic WP-Authentication Settings: No Input⌉⌊STEP4_01: Basic WP-Authentication Settings: No Input⌉[ STEP4_01: Basic WP-Authentication Settings: No Input [⌊STEP4_02: Basic WP-Authentication Settings: Incorrect User or Incorrect Admin User Details⌉⌊STEP4_02: Basic WP-Authentication Settings: Incorrect User or Incorrect Admin User Details⌉[ STEP4_02: Basic WP-Authentication Settings: Incorrect User or Incorrect Admin User Details [⌊STEP4_03: Basic WP-Authentication Settings: Correct Dummy Admin User Details⌉⌊ STEP4_03: Basic WP-Authentication Settings: Correct Dummy Admin User Details⌉[ STEP4_03: Basic WP-Authentication Settings: Correct Dummy Admin User Details [⌊STEP6_01: Console display when an admin is logged in and views the website⌉⌊STEP6_01: Console display when an admin is logged in and views the website⌉[ STEP6_01: Console display when an admin is logged in and views the website [⌊STEP6_02: Console display when other users are logged in and view the website⌉⌊ STEP6_02: Console display when other users are logged in and view the website⌉[ STEP6_02: Console display when other users are logged in and view the website [⌊STEP6_03: Console display when a client views the website⌉⌊STEP6_03: Console display when a client views the website⌉[ STEP6_03: Console display when a client views the website ## 安裝方式 1. Download or Copy the plugin into your WordPress installation’s plugins directory on your Local development machine 2. Go to Plugins Dashboard. Activate the ‘EASY-JS-WPAPI Client HANDLE for the WordPress REST-API’ 3. Now, Go to Users menu on the WordPress dashboard. Add new User. Create a dummy Administrator profile, complete with username, password and full name. e.g: username:‘ matt’, password: ‘agba2700’ 4. The Plugin is now activated, under it are the links: Settings | Deactivate | Edit Now, Click on this Settings link OR on the WordPress Dashboard, Click on the “Basic WP-Authentication” sub-menu of the Settings menu. 5. Enter the newly created dummy administrator username and its password. Click on the Save button This username and password will be checked by the plugin to determine if it is a valid user, and if it is a valid administrator user. If the details you enter is correct, it displays the green unlock icon. But if it is not, it displays the red lock icon, this tells you that you need to change it to a valid admin username and password. When the helper icon, displays a green unlock icon. You have finished setting up this plugin. 6. Go to your live production or development site. e.g: http://talker-test.org or http://localhost:8080 7. Check your browser console: If your administrator’s name is Matt, then you should see a console output: “Hi! I am all set to talk with the WP REST-API.\n Best luck! on your WordPress Projects.” N.B: – Mozilla Browser Console: Tools > Web Developer > Web Console – Chrome Browser Console: More Tools > Developer Tools > Console 1. Open any .js script in your WordPress theme and start accessing the WP REST-API via the node-wpapi client Example: // In a index.js controlling a index.php or index.html in a WordPress Theme wp.posts().embed().get().then(function( response){ console.log( response ); //do something with returned data/response }); * Beginner Theme Developers should remember that all .js scripts in a WordPress Theme must be enqueued in the Theme’s functions.php * See http://wp-api.org/node-wpapi/ for more info. ## 常見問題集 Installation Instructions 1. Download or Copy the plugin into your WordPress installation’s plugins directory on your Local development machine 2. Go to Plugins Dashboard. Activate the ‘EASY-JS-WPAPI Client HANDLE for the WordPress REST-API’ 3. Now, Go to Users menu on the WordPress dashboard. Add new User. Create a dummy Administrator profile, complete with username, password and full name. e.g: username:‘ matt’, password: ‘agba2700’ 4. The Plugin is now activated, under it are the links: Settings | Deactivate | Edit Now, Click on this Settings link OR on the WordPress Dashboard, Click on the “Basic WP-Authentication” sub-menu of the Settings menu. 5. Enter the newly created dummy administrator username and its password. Click on the Save button This username and password will be checked by the plugin to determine if it is a valid user, and if it is a valid administrator user. If the details you enter is correct, it displays the green unlock icon. But if it is not, it displays the red lock icon, this tells you that you need to change it to a valid admin username and password. When the helper icon, displays a green unlock icon. You have finished setting up this plugin. 6. Go to your live production or development site. e.g: http://talker-test.org or http://localhost:8080 7. Check your browser console: If your administrator’s name is Matt, then you should see a console output: “Hi! I am all set to talk with the WP REST-API.\n Best luck! on your WordPress Projects.” N.B: – Mozilla Browser Console: Tools > Web Developer > Web Console – Chrome Browser Console: More Tools > Developer Tools > Console 1. Open any .js script in your WordPress theme and start accessing the WP REST-API via the node-wpapi client Example: // In a index.js controlling a index.php or index.html in a WordPress Theme wp.posts().embed().get().then(function( response){ console.log( response ); //do something with returned data/response }); * Beginner Theme Developers should remember that all .js scripts in a WordPress Theme must be enqueued in the Theme’s functions.php * See http://wp-api.org/node-wpapi/ for more info. What is the WP REST-API? * Check : https://developer.wordpress.org/rest-api/ Why should I use node-wpapi.js client? * It is simple to use and understand. * Check : http://wp-api.org/node-wpapi/ ## 使用者評論 ![](https://secure.gravatar.com/avatar/afe53cde379a0aeb049591252a26b8232eb8131aaa9dd23a9f895fa2a8bab148? s=60&d=retro&r=g) ### 󠀁[Great Plugin](https://wordpress.org/support/topic/great-plugin-15076/)󠁿 [Oluwasegun Somefun](https://profiles.wordpress.org/oluwasegun27/) 2017 年 9 月 7 日 Makes working with the WP REST-API a breeze! [ 閱讀全部 1 則使用者評論 ](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/) ## 參與者及開發者 以下人員參與了開源軟體〈EASY-JS-WPAPI Client HANDLE for the WordPress REST-API〉 的開發相關工作。 參與者 * [ Oluwasegun Somefun ](https://profiles.wordpress.org/oluwasegun27/) [將〈EASY-JS-WPAPI Client HANDLE for the WordPress REST-API〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/node-wpapi-auth) ### 對開發相關資訊感興趣？ 任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/node-wpapi-auth/)、 查看 [SVN 存放庫](https://plugins.svn.wordpress.org/node-wpapi-auth/)，或透過 [RSS](https://plugins.trac.wordpress.org/log/node-wpapi-auth/?limit=100&mode=stop_on_copy&format=rss) 訂閱[開發記錄](https://plugins.trac.wordpress.org/log/node-wpapi-auth/)。 ## 變更記錄 #### 2.0 Second Release: * Modified Authentication handlers for user cases to ensure seamless display of website data on a web-page. #### 1.0 First Release : * Installs the node-wpapi.js CLIENT. * Serves as a Cookie and Basic Authentication handler for the WP REST-API. * Access the WP REST-API in any javascript file using the WPAPI’s ‘wp’ global object directly. ## 中繼資料 * 版本 **2.0** * 最後更新 **9 年前** * 啟用安裝數 **10+** * WordPress 版本需求 ** 4.8 或更新版本 ** * 已測試相容的 WordPress 版本 **4.8.30** * 語言 * [English (US)](https://wordpress.org/plugins/node-wpapi-auth/) * 標籤: * [basic authentication](https://tw.wordpress.org/plugins/tags/basic-authentication/) * [進階檢視](https://tw.wordpress.org/plugins/node-wpapi-auth/advanced/) ## 評分 5 星，滿分為 5 星 * [ 1 個 5 星使用者評論 ](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/?filter=5) * [ 0 個 4 星使用者評論 ](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/?filter=4) * [ 0 個 3 星使用者評論 ](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/?filter=3) * [ 0 個 2 星使用者評論 ](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/?filter=2) * [ 0 個 1 星使用者評論 ](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/?filter=1) [撰寫評分](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/#new-post) [查看全部使用者評論](https://wordpress.org/support/plugin/node-wpapi-auth/reviews/) ## 參與者 * [ Oluwasegun Somefun ](https://profiles.wordpress.org/oluwasegun27/) ## 技術支援 使用者可在技術支援論壇提出意見反應或使用問題。 [檢視技術支援論壇](https://wordpress.org/support/plugin/node-wpapi-auth/)