20. راه‌اندازی اپلیکیشن کلاینت/سرور بر روی یک سرویس میزبانی

در اینجا استقرار برنامهٔ کلاینت/سرور را که بر روی سروری با شناسهٔ OVH [https://www.ovh.com/fr/] توسعه داده‌ایم، تشریح می‌کنیم. استقرار بر روی سایر ارائه‌دهندگان میزبانی نباید تفاوت زیادی داشته باشد. ما صرفاً می‌خواهیم نشان دهیم که برنامهٔ ما برای این نوع استقرار بسیار مناسب است.

20.1. راه‌اندازی سرور

سرویس میزبانی هدف، OVH، یک بسته میزبانی پایه است:

1. محیط PHP 7.3؛
2. یک SGBD MySQL;
3. سرور [Redis] وجود ندارد؛

نقطه سوم ما را ملزم می‌کند تا نسخه ۱۴ سرور محاسبه مالیات خود را اصلاح کنیم.

ما باید اصلاح کنیم:

• فایل‌های پیکربندی [1];
• کنترل‌کننده‌های [AdminDataController] و [CalculerImpotController] را برای در نظر گرفتن این واقعیت که سرور [Redis] وجود ندارد؛

فایل [config.json] به شرح زیر به‌روزرسانی می‌شود:

{
    "databaseFilename": "Config/database.json",
    "corsAllowed": false,
    "redisAvailable":false,
    "rootDirectory": "/.../www/apps/impot/serveur-php7",
    "relativeDependencies": [

        "/Entities/BaseEntity.php",
        ...
        "/Controllers/AdminDataController.php"
    ],
    "absoluteDependencies": [
        "/.../vendor/autoload.php",
        "/.../vendor/predis/predis/autoload.php"
    ],
    "users": [
        {
            "login": "admin",
            "passwd": "admin"
        }
    ],
    ...
}

توضیحات

• خط ۴: یک متغیر بولی [redisAvailable] برای نشان دادن اینکه آیا دسترسی به سرور [Redis] وجود دارد یا خیر، معرفی شده است؛
• خطوط ۵، ۱۳ و ۱۴: مسیرهای مطلق تغییر خواهند کرد؛

فایل [database.json] به شرح زیر تغییر می‌کند:

{
    "dsn": "mysql:host=...;dbname=...",
    "id": "...",
    "pwd": "...",
    "tableTranches": "dbimpots_tbtranches",
    "colLimites": "limites",
    "colCoeffR": "coeffr",
    "colCoeffN": "coeffn",
    "tableConstantes": "dbimpots_tbconstantes",
    "colPlafondQfDemiPart": "plafondQfDemiPart",
    ...
}

توضیحات

• خطوط ۲–۴: نام پایگاه داده و اعتبارنامه‌های مالک آن تغییر خواهند کرد؛

کنترل‌کننده [AdminDataController] به شرح زیر تغییر خواهد کرد:

<?php

namespace Application;

//وابستگی‌های Symfony
use \Symfony\Component\HttpFoundation\Response;
use \Symfony\Component\HttpFoundation\Request;
use \Symfony\Component\HttpFoundation\Session\Session;
//نام مستعار برای لایه [dao]
use \Application\ServerDaoWithSession as ServerDaoWithRedis;

class AdminDataController implements InterfaceController {

  //$config پیکربندی برنامه است
  // پردازش یک درخواست
  //از Session استفاده می‌کند و می‌تواند آن را تغییر دهد
  // $infos جزئیات اضافی مختص هر کنترل‌کننده هستند
  //یک آرایه را بازمی‌گرداند [$statusCode, $état, $content, $headers]
  public function execute(
    array $config,
    Request $request,
    Session $session,
    array $infos = NULL): array {

    //باید یک پارامتر واحد GET وجود داشته باشد
    $method = strtolower($request->getMethod());
    ...

    // امکان کار وجود دارد
    // ردیس
    if ($config["redisAvailable"]) {
      \Predis\Autoloader::register();
      ...
    } else {
      try {
        // ما داده‌های مالیات را از پایگاه داده بازیابی می‌کنیم
        $dao = new ServerDaoWithRedis($config["databaseFilename"], NULL);
        //taxAdminData
        $taxAdminData = $dao->getTaxAdminData();
      } catch (\Throwable $ex) {
        // خراب شد
        //نتیجه با خطا به کنترلر اصلی بازگردانده شد
        $état = 1051;
        return [Response::HTTP_INTERNAL_SERVER_ERROR, $état,
          ["réponse" => utf8_encode($ex->getMessage())], []];
      }
    }

    //نتیجه بازگردانده شده به کنترلر اصلی
    $état = 1000;
    return [Response::HTTP_OK, $état, ["réponse" => $taxAdminData], []];
  }

}

توضیحات

• خط ۳۱: اکنون بررسی می‌کنیم که آیا سرور با نام [Redis] وجود دارد یا خیر؛
• خطوط ۳۲–۳۴: اگر چنین باشد، کد قبلی به‌طور کامل گنجانده می‌شود؛
• خطوط ۳۵–۴۶: در غیر این صورت، داده‌های مرجع مالیاتی از پایگاه داده بازیابی می‌شود؛

کنترلر [CalculerImpotController] که آن نیز به داده‌های سازمان‌های مالیاتی نیاز دارد، دقیقاً به همان روش به‌روزرسانی می‌شود.

این کار انجام شده است. استقرار روی سرور OVH شامل ایجاد FTP بود. موارد زیر به OVH بارگذاری شدند:

• نسخه [vuejs-14-without-redis];
• پوشه [vendor]، که حاوی تمام وابستگی‌های سرور [vuejs-14-without-redis] است؛

پس از اتمام انتقال FTP، ما جداول مورد نیاز سرور را با استفاده از اسکریپت زیر SQL ایجاد کردیم:

--phpMyAdmin SQL Dump
--نسخهٔ ۴.۸.۵
-- https://www.phpmyadmin.net/
--
-- میزبان: localhost:3306
--زمان تولید: ۱۲ اکتبر ۲۰۱۹ در ساعت ۰۷:۴۵ AM
-- نسخهٔ سرور: 5.7.24
-- PHP نسخه: 7.2.11

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET AUTOCOMMIT = 0;
START TRANSACTION;
SET time_zone = "+00:00";


/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;

--
--ساختار جدول برای جدول `dbimpots_tbconstantes`
--

CREATE TABLE `dbimpots_tbconstantes` (
  `id` int(11) NOT NULL,
  `plafondQfDemiPart` decimal(10,2) NOT NULL,
  `plafondRevenusCelibatairePourReduction` decimal(10,2) NOT NULL,
  `plafondRevenusCouplePourReduction` decimal(10,2) NOT NULL,
  `valeurReducDemiPart` decimal(10,2) NOT NULL,
  `plafondDecoteCelibataire` decimal(10,2) NOT NULL,
  `plafondDecoteCouple` decimal(10,2) NOT NULL,
  `plafondImpotCelibatairePourDecote` decimal(10,2) NOT NULL,
  `plafondImpotCouplePourDecote` decimal(10,2) NOT NULL,
  `abattementDixPourcentMax` decimal(10,2) NOT NULL,
  `abattementDixPourcentMin` decimal(10,2) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

--
-- خروجی‌گیری داده‌ها برای جدول `dbimpots_tbconstantes`
--

INSERT INTO `dbimpots_tbconstantes` (`id`, `plafondQfDemiPart`, `plafondRevenusCelibatairePourReduction`, `plafondRevenusCouplePourReduction`, `valeurReducDemiPart`, `plafondDecoteCelibataire`, `plafondDecoteCouple`, `plafondImpotCelibatairePourDecote`, `plafondImpotCouplePourDecote`, `abattementDixPourcentMax`, `abattementDixPourcentMin`) VALUES
(8, '1551.00', '21037.00', '42074.00', '3797.00', '1196.00', '1970.00', '1595.00', '2627.00', '12502.00', '437.00');

-- --------------------------------------------------------

--
--ساختار جدول برای جدول `dbimpots_tbtranches`
--

CREATE TABLE `dbimpots_tbtranches` (
  `id` int(11) NOT NULL,
  `limites` decimal(10,2) NOT NULL,
  `coeffR` decimal(10,2) NOT NULL,
  `coeffN` decimal(10,2) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

--
-- خروجی‌گیری داده‌ها برای جدول `dbimpots_tbtranches`
--

INSERT INTO `dbimpots_tbtranches` (`id`, `limites`, `coeffR`, `coeffN`) VALUES
(36, '9964.00', '0.00', '0.00'),
(37, '27519.00', '0.14', '1394.96'),
(38, '73779.00', '0.30', '5798.00'),
(39, '156244.00', '0.41', '13913.69'),
(40, '0.00', '0.45', '20163.45');

--
-- نمایه برای جداول تخلیه‌شده
--

--
-- شاخص‌ها برای جدول `dbimpots_tbconstantes`
--
ALTER TABLE `dbimpots_tbconstantes`
  ADD PRIMARY KEY (`id`);

--
-- شاخص‌ها برای جدول `dbimpots_tbtranches`
--
ALTER TABLE `dbimpots_tbtranches`
  ADD PRIMARY KEY (`id`);

--
-- AUTO_INCREMENT برای جداول تخلیه شده
--

--
-- AUTO_INCREMENT برای جدول `dbimpots_tbconstantes`
--
ALTER TABLE `dbimpots_tbconstantes`
  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=9;

--
--AUTO_INCREMENT برای جدول `dbimpots_tbtranches`
--
ALTER TABLE `dbimpots_tbtranches`
  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=41;
COMMIT;

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

پس از تکمیل همه این مراحل، فایل‌های [config.json, database.json] برای محیط جدید خود تطبیق داده شدند.

20.2. استقرار کلاینت [Vue.js]

تصمیم گرفته شد که کلاینت [Vue.js] روی URL و [http://machine/apps/impot/client-vuejs/] مستقر شود. این امر منجر به تغییرات زیر شد:

در ریشهٔ [workspace]، فایل زیر از [VSCode] ایجاد شد:

فایل [vue.config.js] به شرح زیر است:

//vue.config.js
module.exports = {
  //سرویس مشتری URL سرور محاسبه مالیات [vuejs]
  publicPath: '/apps/impot/client-vuejs/'
}

فایل [router.js] [3] نیز تغییر یافته است:

// واردات‌ها
import Vue from 'vue'
import VueRouter from 'vue-router'
...

//افزونه مسیریابی
Vue.use(VueRouter)

//مسیرهای برنامه
const routes = [
  ...
]

// روتر
const router = new VueRouter({
  //مسیرها
  routes,
  // URL حالت نمایش
  mode: 'history',
  // پایهٔ برنامه URL
  base: '/apps/impot/client-vuejs/'
})

//تأیید مسیر
router.beforeEach((to, from, next) => {
  ...
})

// خروجی روتر
export default router

توضیحات

• خط ۲۱: پایه URL اصلاح شده است؛

فایل [config.js] به شرح زیر اصلاح شده است:

// استفاده از کتابخانه [axios]
const axios = require('axios');
// تایم‌اوت درخواست HTTP
axios.defaults.timeout = 5000;
// پایگاه دادهٔ سرور محاسبه مالیات URL
// اسکیمای [https] در فایرفاکس مشکل ایجاد می‌کند زیرا سرور محاسبه مالیات
// یک گواهی خودامضا ارسال می‌کند. با کروم و اج به خوبی کار می‌کند. با سافاری آزمایش نشده است.
// با فایرفاکس، این کار با درخواست مستقیم URL زیر و اطلاع دادن به فایرفاکس امکان‌پذیر است
// که شما ریسک گواهی‌نامه بدون امضا را می‌پذیرید. کلاینت [vuejs] سپس کار خواهد کرد.
axios.defaults.baseURL = 'http://.../apps/impot/php7-server';
// ما از کوکی‌ها استفاده خواهیم کرد
axios.defaults.withCredentials = true;

// صادرات پیکربندی
export default {
  // شیء [axios]
  axios: axios,
  // حداکثر زمان انقضای عدم فعالیت جلسه: ۵ دقیقه = ۳۰۰ ثانیه = ۳۰۰٬۰۰۰ میلی‌ثانیه
  duréeSession: 300000
}

توضیحات

• خط ۱۰: از فایل URL از سرور محاسبه مالیات استفاده می‌شود؛

نسخه تولیدی پروژه با استفاده از دستور [build] از فایل‌های زیر تولید شد: [package.json] [5]:

{
  "name": "vuejs",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve vuejs-22/main.js",
    "build": "vue-cli-service build vuejs-22-ovh-withBootstrapVue/main.js",
    "lint": "vue-cli-service lint"
  },
  ...
}

پس از انجام این کار، پوشه [dist] که حاوی نسخه تولیدشده بود، «بارگذاری» شد به سرور OVH در پوشه [/.../apps/impot] و سپس به [client-vuejs] تغییر نام داده شد تا کد کلاینت طبق برنامه در پوشه [/.../apps/impot/client-vuejs/] قرار گیرد. سپس فایل زیر، [.htaccess]، را در آن پوشه دانلود کردیم:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /apps/impot/client-vuejs/
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /apps/impot/client-vuejs/index.html [L]
</IfModule>

این به این دلیل است که وب‌سرور مورد استفاده در اینجا، OVH، یک سرور آپاچی است. برای انواع دیگر سرورها، لطفاً به مستندات |https://cli.vuejs.org/guide/deployment.html| مراجعه کنید.

اپلیکیشن سرور PHP 7 را می‌توان |اینجا| آزمایش کرد.

کلاینت [Vue.js] را می‌توان |اینجا| آزمایش کرد.

20.3. Conclusion

نسخه [vuejs-21] ضروری نبود. ما مشاهده کرده بودیم که نسخه [vuejs-20] ورودی‌های کاربر URL را به درستی مدیریت می‌کرد. با این حال، نسخه جدید راحتی بیشتری برای کاربر فراهم می‌کند. کاربران می‌توانند با وارد کردن URL به ناوبری بپردازند. سپس برنامه نمایی را نمایش می‌دهد که بیشترین تناسب را با وضعیت فعلی برنامه (جلسه) دارد. علاوه بر این، نسخه [vuejs-22] بهبودهایی را در نمایش برنامه بر روی دستگاه‌های همراه ارائه می‌دهد.