HTML 5 как интерфейс локального сценария с Node.js

Node.js может получать данные из формы и передавать их в качестве параметров в PHP-скрипт, на локальном компьютере.

Это открывает возможности для использования HTML 5 в качестве интерфейса локальных приложений. Обратите внимание, что данные форм передаются не в PHP-сценарий в переменной $ _ POST (или $ _ GET), а в качестве параметров командной строки, что имеет тот же эффект .

Фактически они передаются как таковые в сценарий сервера JavaScript. Но настоящая демонстрация сделана для добавления графических интерфейсов к своим PHP-скриптам, которые ты обычно используешь в командной строке (их на этом сайте много) без необходимости менять код скрипта.

Вот общий код PHP-скрипта (phpback.php), получающего параметры командной строки:

<?php
echo "phpback.php here...\n";
echo $argc-1, " infos received from HTML interface:\n\n";
for($i = 1; $i < $argc; $i++)
{
  $p = $argv[$i];
  list($k, $v) = explode('=', $p);
  echo $k, "=", $v, "\n";
}

echo "\nReady to use them, add your code to the source...";
?>

Кроме эхо-отображения полученных данных, которые есть только для демонстрации, этот код является общим для любого PHP-скрипта, получающего настройки.

Этому скрипту мы хотим дать графический интерфейс. Она выглядит так:

Node.js interface graphique

Вводимые пользователем данные, а именно логин и пароль (это просто пример, возможны все другие данные), будут передаваться в качестве параметров командной строки в PHP-программу, что благодаря Node.js.

Для запуска интерфейса сервер запускается командой:

node htmlinterface.js

Это можно поместить в пакетный файл и связать со значком на рабочем столе.

А для запуска PHP-скрипта в URL-строке браузера вводится название интерфейса:

http://127.0.0.1:1000/phpfront.php

Это тоже можно автоматизировать, разместив в букмарке.

При нажатии на кнопку «Run script» Ты должен видеть в браузере результат PHP скрипта:

Конечно, отображение можно было бы более проработать с помощью HTML тегов, но для этого учебника хочется оставаться простым.

Как это работает?

Если ты уже прочитал два наших предыдущих учебника, Как сделать сервер страниц или приложений с Node.js и Локально запустить PHP-программу из браузера, что рекомендуется, ты уже имеешь представление о коде, на самом деле это синтез этих двух предыдущих статей.

  1. Когда сервер JavaScript получает URL-адрес интерфейса, он отображает соответствующую страницу, для этого использует принцип, изложенный в первой статье.
  2. Пользователь вводит данные и нажимает кнопку «Выполнить сценарий». Данные форм отправляются и принимаются сервером JavaScript.
  3. Затем он формирует командную строку, преобразуя эти данные в параметры, и запускает PHP-скрипт, как показано во второй статье.
  4. Результаты сценария PHP отображаются вместо интерфейса. Встроить их в интерфейс было бы лучше, но это будет предметом следующей статьи.

Когда пользователь запрашивает интерфейс в браузере, сервер получает команду GET. Он присваивает переменной код со значением 0, в результате чего функция runphp вызывает метод fs.readFile, отображающий HTML-страницу.

Затем, когда пользователь отправляет данные формы, сервер получает метод POST, он присваивает код с переменной 1, а функция runphp вызывает метод exec для выполнения сценария PHP в бэкенде. Результаты отправляются в браузер функцией sendData.

Однако данные форм должны быть истолкованы. Это выполняется со следующим кодом:

if(request.method == 'POST')
{
  var data;
  var formData;
  var phpvar="";
  request.on('data', function(chunk) { data = chunk.toString(); });
  request.on('end', function()
  {
    formData = qs.parse(data);
    code = 1;
    for(var key in formData)
    {
      phpvar =  phpvar + key + "=" + '"' + formData[key] + '" ';
    }
    });
} 
Необходим модуль querystring, метод парсинга которого преобразует данные форм в ассоциативный массив с именами переменных в ключи и их значениями, назначенными ключам.
Тогда еще предстоит превратить эту таблицу в параметры командной строки. Это достигается циклом, который превращает formData в phpvar.

Полный исходный код

http = require("http"),
path = require("path"),
url = require("url"),
qs = require('querystring'),
runner = require("child_process");
fs = require("fs");

function sendError(errCode, errString, response)
{
  response.writeHead(errCode, {"Content-Type": "text/plain;charset=utf-8"});
  response.write("Error: " + errString + "\n");
  response.end();
  return false;
}

function sendData(err, stdout, stderr, response)
{
  if (err) return sendError(500, stderr, response);
  response.writeHead(200,{"Content-Type": "text/plain;charset=utf-8"});
  response.write(stdout);
  response.end();
}

function sendFile(err, file, response)
{
  if(err) return sendError(500, err, response);
  response.writeHead(200);
  response.write(file, "binary");
  response.end();
}

function runPHP(exists, code, localpath, param, response)
{
  if(!exists) return sendError(404, 'File not found', response);
  console.log("php " + localpath + " " + param);
  if(code==1)
  {
    runner.exec("php " + localpath + " " + param,
      function(err, stdout, stderr) { sendData(err, stdout, stderr, response); });
    return;
  }
  fs.readFile(localpath, "binary",
    function(err, localpath){ sendFile(err, localpath, response);});
}

function php(request, response)
{
  var urlpath = url.parse(request.url).pathname;
  code = 0;
  if(request.method == 'POST')
  {
    var data;
    var formData;
    var phpvar="";
    request.on('data', function(chunk) { data = chunk.toString(); });
    request.on('end', function()
    {
      formData = qs.parse(data);
      code = 1;
      for(var key in formData)
      {
        phpvar =  phpvar + key + "=" + '"' + formData[key] + '" ';
      }
     });
    }
    var param = url.parse(request.url).query;
    var localpath = path.join(process.cwd(), urlpath);
    fs.exists(localpath, function(result) { runPHP(result, code, localpath, phpvar, response)});
}

var server = http.createServer(php);
server.listen(1000);
console.log("Server ready to get the HTML interface on port 1000."); 

Файлы, соответствующие этому учебнику:

А с Node.js на местном посту еще много-много дел. В следующей статье мы посмотрим, как создать взаимодействие HTML-интерфейса и PHP-скрипта.