Создание пользовательских панелей мониторинга с функциями MongoDB, Azure и без сервера

 'use strict'; var wp = require( './wp' ); var cache = require( './content-cache' ); var _ = require( 'lodash' ); var RSVP = require( 'rsvp' ); /** * Recursively fetch all pages of a paged collection * * @param {Promise} request A promise to a WP API request's response * @returns {Array} A promise to an array of all matching records */ function all( request ) { return request.then(function( response ) { if ( ! response._paging || ! response._paging.next ) { return response; } // Request the next page and return both responses as one collection return RSVP.all([ response, all( response._paging.next ) ]).then(function( responses ) { return _.flatten( responses ); }); }); } function siteInfo( prop ) { var siteInfoPromise = cache.get( 'site-info' ); if ( ! siteInfoPromise ) { // Instantiate, request and cache the promise siteInfoPromise = wp.root( '/' ).then(function( info ) { return info; }); cache.set( 'site-info', siteInfoPromise ); } // Return the requested property return siteInfoPromise.then(function( info ) { return prop ? info[ prop ] : info; }); } /** * Get an alphabetized list of categories * * All archive routes display a sorted list of categories in their sidebar. * We generate that list here to ensure the sorting logic isn't duplicated * across routes. * * @method sortedCategories * @return {Array} An array of category objects */ function sortedCategories() { return all( wp.categories() ).then(function( categories ) { return _.chain( categories ) .sortBy( 'slug' ) .value(); }); } function sortedCategoriesCached() { var categoriesPromise = cache.get( 'sorted-categories' ); if ( ! categoriesPromise ) { categoriesPromise = sortedCategories(); cache.set( 'sorted-categories', categoriesPromise ); } return categoriesPromise; } /** * Get a specific category (specified by slug) from the content cache * * The WP API doesn't currently support filtering taxonomy term collections, * so we have to request all categories and filter them down if we want to get * an individual term. * * To make this request more efficient, it uses sortedCategoriesCached. * * @method categoryCached * @param {String} slug The slug of a category * @return {Promise} A promise to the category with the provided slug */ function categoryCached( slug ) { return sortedCategoriesCached().then(function( categories ) { return _.findWhere( categories, { slug: slug }); }); } /** * Get a specific tag (specified by slug) from the content cache * * The WP API doesn't currently support filtering taxonomy term collections, * so we have to request all tags and filter them down if we want to get an * individual term. * * To make this request more efficient, it uses the cached sortedTags promise. * * @method tagCached * @param {String} slug The slug of a tag * @return {Promise} A promise to the tag with the provided slug */ function tagCached( slug ) { return sortedTagsCached().then(function( tags ) { return _.findWhere( tags, { slug: slug }); }); } /** * Get an alphabetized list of tags * * @method sortedTags * @return {Array} An array of tag objects */ function sortedTags() { return all( wp.tags() ).then(function( tags ) { return _.chain( tags ) .sortBy( 'slug' ) .value(); }); } function sortedTagsCached() { var tagsPromise = cache.get( 'sorted-tags' ); if ( ! tagsPromise ) { tagsPromise = sortedTags(); cache.set( 'sorted-tags', tagsPromise ); } return tagsPromise; } function getSidebarContent() { return RSVP.hash({ categories: sortedCategoriesCached(), tags: sortedTagsCached() }); } module.exports = { // Recursively page through a collection to retrieve all matching items all: all, // Get (and cache) the top-level information about a site, returning the // value corresponding to the provided key siteInfo: siteInfo, sortedCategories: sortedCategories, sortedCategoriesCached: sortedCategoriesCached, categoryCached: categoryCached, tagCached: tagCached, sortedTags: sortedTags, sortedTagsCached: sortedTagsCached, getSidebarContent: getSidebarContent }; 

Посмотреть код на Gist .

Пользовательские маршруты и данные о продажах

Наконец, я приготовил несколько пользовательских маршрутов, из которых я могу получить любые данные, связанные с продажами. Для конкретной архитектуры, которую я использую, я снова использую утилиту RSVP.hash для удобства и параллелизма. Отлично работает.

 var WPAPI = require( 'wpapi' ); var RSVP = require('rsvp'); // Using the RSVP.hash utility for convenience and parallelism RSVP.hash({ categories: wp.categories().slug( 'it-services' ), tags1: wp.tags().slug('hotel-name'), tags2: wp.tags().slug('march-events') }).then(function( results ) { // Combine & map .slug() results into arrays of IDs by taxonomy var tagIDs = results.tags1.concat( results.tags2 ) .map(function( tag ) { return tag.id; }); var categoryIDs = results.categories .map(function( cat ) { return cat.id; }); return wp.posts() .tags( tags ) .categories( categories ); }).then(function( posts ) { // These posts are all fiction, either magical realism or historical: console.log( posts ); }); 

Посмотреть код на Gist .

Получив эти данные, я отправляю их на Paddle.com для обработки вместе с заказанным заказом на покупку, чтобы их можно было добавить к нашему экземпляру MongoDB с помощью бессерверных функций Azure.

 // Registering custom routes. site.itSales = site.registerRoute( 'sales/v1', '/resource/(?P<some_part>\\d+)' ); site.itSales().somePart( 7 ); // => myplugin/v1/resource/7 // Query Parameters & Filtering Custom Routes. site.handler = site.registerRoute( 'sales/v1', 'receipts/(?P<id>)', { // Listing any of these parameters will assign the built-in // chaining method that handles the parameter: params: [ 'before', 'after', 'author', 'parent', 'post' ] }); // Yields from the custom data of buyers. site.handler().post( 8 ).author( 92 ).before( dateObj )... // Sent to paddle. 

Посмотреть код на Gist .

Некоторым это может показаться странным, но WordPress позволяет вам настраивать пользовательские типы записей и настраиваемые таксономии, что я и использую здесь, приведенный выше код, однако, не является точной реализацией, а аналогичным подходом к тому, что я использовал через категории и теги.

Эти данные отправляются Paddle, и они сильно кэшируются, поэтому наши экземпляры WordPress не получают никакой нагрузки, пока мы экспериментируем с пользовательской панелью мониторинга. Я также готовил в небольшом модуле data-refresh который выбирает данные по запросу из выбранного экземпляра WordPress.

Microsoft Azure и функции Azure

При создании этой настраиваемой панели управления WordPress я хотел убедиться, что каждый модуль этой панели мониторинга представлен в виде безсерверного приложения с несколькими функциями без сервера. Это решение было основано на сохранении стоимости этой панели как можно более экономичной.

Options три варианта

Присутствуют три основных поставщика облачных услуг. Это Microsoft Azure , Google Cloud Platform и Amazon Web Services . Каждая из них имеет доступные функции без сервера, соответственно называемые функциями Azure, GCP Cloud Functions и AWS Lambdas.

Az Выбор Лазурного

Azure обладает одной из крупнейших облачных архитектур и глобальным присутствием. В 50 регионах Azure, больше, чем у любого облачного провайдера, и после тестирования каждого из этих трех я обнаружил, что функции Azure имеют лучшее время отклика в ОАЭ (поскольку бизнес моего клиента основан на ОАЭ).

Кроме того, тот факт, что мы используем Azure ML Studio, AI Cognitive Services и виртуальные машины для размещения частей этого проекта, означает, что имеет смысл использовать функции Azure для безсерверной архитектуры.

Начало работы с функциями Azure

Давайте начнем с функций Azure. Я собираюсь провести вас через процесс создания простой бессерверной функции Azure, которая будет запускаться через HTTP-запросы, и внутри нее мы будем обрабатывать информацию о продажах, отправленную нам с Paddle.com.

Что мы строим ?!

1. Я создаю бессерверную функцию Azure, которая основана на JavaScript и, в частности, на коде Node.js.
2. Эта функция Azure будет вызвана простым GET HTTP-запросом от нашего стороннего платежного решения, т.е. Paddle.com.
3. Как только на Paddle.com появится продажа, он запустит веб-крючок, который содержит информацию, касающуюся нашей продажи, количества, товара, дохода и некоторых связанных с участниками данных, которые WordPress отправил в Paddle.
4. Используя WordPress REST API, я добавил некоторые пользовательские данные, связанные с пользователем, который приобрел продукт, например, идентификатор пользователя в БД WordPress, сайт продажи WordPress и метаинформацию этого пользователя.
5. Когда функция Azure получает этот GET запрос, она обрабатывает информацию, извлекает то, что мне нужно сохранить в MongoDB Atlas Cluster, и формирует объект JavaScript, готовый для сохранения в БД.
6. Затем функция Azure подключается к экземпляру MongoDB Atlas через пакет npm под названием mongoose , где после подключения базы данных я создаю модель / схему БД, а затем эти данные сохраняются в кластере MongoDB Atlas.
7. После чего функция Azure находится там, ожидая следующей продажи, когда мой клиент оплачивает только время выполнения и количество выполнений для функций Azure. ( 1 миллион из которых бесплатны каждый месяц ).

Теперь, это только краткое изложение происходящего, я пропустил много шагов, таких как аутентификация, которая выходит за рамки этой статьи. Вы должны всегда настраивать аутентификацию и проверку, чтобы сохранить целостность и избежать переизбытка.

 { "disabled": false, "bindings": [ { "authLevel": "anonymous", "type": "httpTrigger", "direction": "in", "name": "req" }, { "type": "http", "direction": "out", "name": "res" } ] } 

 module.exports = function (context, req) { context.log('JavaScript HTTP trigger function processed a request.'); if (req.query.name || (req.body && req.body.name)) { context.res = { // status: 200, /* Defaults to 200 */ body: "Hello " + (req.query.name || req.body.name) }; } else { context.res = { status: 400, body: "Please pass a name on the query string or in the request body" }; } context.done(); }; 

 /** * Model: Sale */ const mongoose = require('mongoose'); mongoose.Promise = global.Promise; // Sale Schema. const saleSchema = new mongoose.Schema({ sale_gross: Number, earnings: Number, currency: String, memberSince: Date, customerEmail: String, event_time: { type: Date, default: Date.now }, }); // Export the model. module.exports = mongoose.model('Sale', saleSchema); 

 /** * Azure Function: Sale. * * Gets data from Paddle.com (which in turn gets data * from WordPress) and processes the data, creates a * finalData object and saves it in MongoDB Atlas. * * @param context To pass data between function to / from runtime. * @param req HTTP Request sent to the Azure function by Paddle. */ module.exports = async function (context, req) { // Let's call it log. const log = context.log; // Log the entire request just for the demo. log('[RAN] RequestUri=%s', req.originalUrl); /** * Azure function Response. * * Processes the `req` request from Paddle.com * and saves the data to MongoDB Atlas while * responding the `res` response. */ // Database interaction. const mongoose = require('mongoose'); const DATABASE = process.env.MongodbAtlas; // Connect to our Database and handle any bad connections mongoose.connect(DATABASE); mongoose.Promise = global.Promise; // Tell Mongoose to use ES6 promises mongoose.connection.on('error', (err) => { context.log(`ERROR→ ${err.message}`); }); // Sale Schema. require('./modelSale'); const Sale = mongoose.model('Sale'); // Create a Response. if (req.query.customFieldName) { // Simple authentication for the purpose of demo. // Build the data we need. const sale_gross = req.query.p_sale_gross || '0'; const earnings = JSON.parse(req.query.p_earnings)['16413'] || '0' const currency = req.query.p_currency || 'USD'; const memberSince = req.query.memberSince || new Date(); const customerEmail = req.query.customerEmail || ''; const event_time = new Date(); log('[OUTPUT]—— sale_gross: ' + sale_gross); log('[OUTPUT]—— earnings: ' + earnings); log('[OUTPUT]—— currency: ' + currency); const finalData = { sale_gross: sale_gross, earnings: earnings, currency: currency, memberSince: memberSince, customerEmail: customerEmail, event_time: event_time, } // Save to db. const sale = await (new Sale(finalData)).save(); log("[OUTPUT]—— SALE SAVED: ", sale); // Respond with 200. context.res = { status: 200, body: "Thank You for the payment! " + (req.query.customFieldName || req.body.customFieldName) }; } else { context.res = { status: 400, body: "Please pass a name on the query string or in the request body" }; } // Informs the runtime that your code has finished. You must call context.done, or else the runtime never knows that your function is complete, and the execution will time out. // @link: https://docs.microsoft.com/en-us/azure/azure-functions/functions-reference-node#contextdone-method context.done(); }; 

 /** * Get Image Alt Recognition with Computer Vision * using Azure Cognitive Services. */ var WPAPI = require('wpapi'); var wp = new WPAPI({ endpoint: 'http://src.wordpress-develop.dev/wp-json' }); /** * Handle Image Alt Generation. */ function processImage() { // ********************************************** // *** Update or verify the following values. *** // ********************************************** // Replace <Subscription Key> with your valid subscription key. var subscriptionKey = "<Subscription Key>"; // You must use the same region in your REST call as you used to get your // subscription keys. For example, if you got your subscription keys from // westus, replace "westcentralus" in the URI below with "westus". // // Free trial subscription keys are generated in the westcentralus region. // If you use a free trial subscription key, you shouldn't need to change // this region. var uriBase = "https://westcentralus.api.cognitive.microsoft.com/vision/v2.0/analyze"; // Request parameters. var params = { "visualFeatures": "Categories,Description,Color", "details": "", "language": "en", }; // Display the image. var sourceImageUrl = document.getElementById("inputImage").value; document.querySelector("#sourceImage").src = sourceImageUrl; // Make the REST API call. $.ajax({ url: uriBase + "?" + $.param(params), // Request headers. beforeSend: function (xhrObj) { xhrObj.setRequestHeader("Content-Type", "application/json"); xhrObj.setRequestHeader( "Ocp-Apim-Subscription-Key", subscriptionKey); }, type: "POST", // Request body. data: '{"url": ' + '"' + sourceImageUrl + '"}', }) .done(function (data) { // Show formatted JSON on webpage. $("#responseTextArea").val(JSON.stringify(data, null, 2)); // Extract and display the caption and confidence from the first caption in the description object. if (data.description && data.description.captions) { var caption = data.description.captions[0]; if (caption.text && caption.confidence >= 0.5) { const imgDescription = caption.text; //  Upload to WordPress. wp.media() // Specify a path to the file you want to upload, or a Buffer .file(sourceImageUrl) .create({ title: imgDescription, alt_text: imgDescription, caption: imgDescription, description: imgDescription }) .then(function (response) { // Your media is now uploaded: let's associate it with a post var newImageId = response.id; return wp.media().id(newImageId).update({ post: associatedPostId }); }) .then(function (response) { console.log('Media ID #' + response.id); console.log('is now associated with Post ID #' + response.post); }); } } }) .fail(function (jqXHR, textStatus, errorThrown) { // Display error message. var errorString = (errorThrown === "") ? "Error. " : errorThrown + " (" + jqXHR.status + "): "; errorString += (jqXHR.responseText === "") ? "" : jQuery.parseJSON(jqXHR.responseText).message; alert(errorString); }); };