Home > BLOG > UserFrosting:User Registry System

UserFrosting:User Registry System

2019-12-10 07:15 AM
Linux Ubuntu Software SIP

In the case of offering the application service on the web like the Flexisip introduced previously which is required the user registry, shoud be prepared the web frontend to register users, edit user informations and so on. To refer the sample php codes for it, it's an easy way, but no critical functions as an email certification system for password, users management by an admin user and so on. 

This time I wish to expand the sign-in system to the other web applications and use these for the commercial applications, adopted the UserFrosting Sign-in system framework. 

 

UserFrosting

UserFrosting Github:https://github.com/userfrosting/UserFrosting

Main characteristics for UserFrosting are followings.

  • User Registry, approved it by the email.
  • Grouped Registry Users, Apply the Permissions for Each User.
  • Reset Users Password.
  • Edit Users Informations.
  • WEB Frontend for User Registry, User Dashboard and Main App.
  • Localization
  • On MVC(Model-View-Controller) Design System, Easy to Customize and Expand the Funnctions.
  • 100% Free Open Source under MIT Licence.

Well documented in Documents page. Please also refer it. After installation, enable to override the customized contens by allocating the customized folder including some coding files under the "Sprinkles" directory.

 

Admin User: Dashboard

 

Install Environment

In the case of not using the Docker Containers

Please install Nginx,PHP-FPM, MariaDB, phpMyAdmin, Git, Composer, Node.js, and npm repositries directly to your PC.

(Ubuntu,Debian:use "apt-get install" command)

 

In the case of using Docker Containers

Write down the official Docker images: Nginx,PHP, MariaDB, and phpMyAdmin on the docker-compose file.

Assign the Tag you like on the each image.

 

  1. Nginx: image: nginx:alpine

  2. MariaDB: image: mariadb

  3. PHP-FPM: image: php:7.2-fpm-alpine

  4. phpMyAdmin: image: phpmyadmin/phpmyadmin:fpm-alpine

 

Sample file for the Docker-Compose（Nginx+PHP-FPM+phpMyAdmin）

Offered the following Docker-Compose file from official git, selected the each docker image by referring it.

https://github.com/userfrosting/UserFrosting/tree/master/docker

 

The followings is the configuration for SSL connection of NGINX and LetsEncrypt.

Please also refer to the following contents about Nginx-Proxy+Let'sEncrypt containers(sorry Japanese only)

https://ficus-forum.myvnc.com/t/topic/317/3

https://ficus-forum.myvnc.com/t/topic/337/3

version: '3'

services:
  mariadb:
    container_name: mariadb
    image: mariadb
    restart: always
    volumes:
      - ./db:/var/lib/mysql
    environment:
      - MYSQL_ROOT_PASSWORD=root_passowrd
      - MYSQL_DATABASE=your_database
      - MYSQL_USER=your_user
      - MYSQL_PASSWORD=user_password
    networks:
      proxy-tier:
        ipv4_address: 172.18.0.4

  # nginx, additional install $ docker exec nginx apk add bash nano
  nginx:
    container_name: nginx
    image: nginx:alpine
    tty: true
    environment:
      - VIRTUAL_HOST=test-site.com
      - VIRTUAL_ROOT=/var/www/html
      - VIRTUAL_PORT=80
      # - VIRTUAL_PROTO=fastcgi
      - LETSENCRYPT_HOST=test-site.com
      - LETSENCRYPT_EMAIL=your_id@gmail.com
    volumes:
      # shared nginx default.conf between host and container
      - ./nginx_default.conf:/etc/nginx/conf.d/default.conf
      # shared the directory /var/www/html in php-fpm container
      - ./html:/var/www/html/register
      # shared the directory /var/www/html in phpmysql-fpm container
      - ./phpmyadmin_data:/var/www/html/phpmyadmin
    restart: always
    networks:
      proxy-tier:
        ipv4_address: 172.18.0.6

  # php-fpm, additional install $ docker exec php-fpm apk add bash nano
  # php extension mysqli should be installed, $ docker exec php-fpm docker-php-ext-install mysqli
  php-fpm:
    container_name: php-fpm
    image: php:7.2-fpm-alpine
    tty: true
    expose: 
      - "9000"
    volumes:
      - ./html:/var/www/html/register
    depends_on:
      - mariadb
    restart: always
    networks:
      proxy-tier:
        ipv4_address: 172.18.0.7

  # phpmyadmin-fpm, additional install $ docker exec phpmyadmin-fpm apk add bash nano 
  # php extension mysqli should be installed, $ docker exec phpmyadmin-fpm docker-php-ext-install mysqli
  phpmyadmin:
    container_name: phpmyadmin-fpm
    image: phpmyadmin/phpmyadmin:fpm-alpine
    tty: true
    expose: 
      - "9000"
    environment:
      - PMA_HOST=mariadb
      - PMA_PORT=3306
      - PMA_ABSOLUTE_URI=http://localhost/phpmyadmin
    volumes:
      - ./phpmyadmin_data:/var/www/html
      - /sessions
    depends_on:
      - mariadb
    restart: always
    networks:
      proxy-tier:
        ipv4_address: 172.18.0.8

networks:
  proxy-tier:
    external:
      name: nginx-proxy

volumes:
  shared:
    external: true

Each container will be run by the above docker-compose file.

$ docker-compose up -d

Above item No.3 PHP-FPM addtional repositories should be installed: composer, node.js, npm, nano, bash（Alpine-Linux:apk add command）

$ docker exec php-fpm apk add composer nodejs npm nano bash

Move into php-fpm container with bash command and install the following packages and php extensions which are required on Userfrosting.

$ docker exec -ti php-fpm bash

# apk add libpng-dev freetype-dev libjpeg-turbo-dev zip
# docker-php-ext-configure gd --with-freetype-dir=/usr/include/ --with-jpeg-dir=/usr/include/
# docker-php-ext-install -j$(nproc) gd
# docker-php-ext-install -j$(nproc) pdo pdo_mysql
# docker-php-ext-install -j$(nproc) zip

Exit php-fpm container and restart it.

# exit
$ docker container restart php-fpm

 

Download and Copy UserFrosting

Download Userfrosting by "git clone" command from outside the containers(on your PC).

（Or add "git" repository in the PHP-FPM container, and download UserFrosting.）

$ git clone https://github.com/userfrosting/UserFrosting.git userfrosting

Copy the contents in the UserFrosting folder to /var/www/html directry in the PHP-FPM container.

$ docker cp userfrosting/. php-fpm:/var/www/html

Implement the "composer install" command in the /var/www/html directry in the PHP-FPM container and download the php libraries and third party's php frameworks and so on.

$ docker exec php-fpm composer install

Or implement the "composer install" command in PHP-FPM container directly, after entering into the container by bash. Don't forget to implement the install command under the directry /var/www/html.

$ docker exec -it php-fpm bash

# pwd
/var/www/html
# composer install

 

Configuration for NGINX Container

Set the NGINX configuration for PHP-FPM and phpMyAdmin containers. Under the condition of already having been worked Nginx-proxy and Let'sencrypt containers(SSL Connection). 

$ docker exec nginx apk add nano

$ docker exec nginx nano /etc/nginx/conf.d/default.conf

/etc/nginx/conf.d/default.conf

resolver 127.0.0.11 valid=15s;

server {
  listen 80;
  root /var/www/html;
  server_name "";
      
  location / {
    add_header X-Frame-Options SAMEORIGIN;
    add_header X-Content-Type-Options nosniff;

    root /var/www/html/public;
    index index.php;
    try_files $uri /index.php?$query_string;

    location = /index.php {
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_keep_conn on;
        fastcgi_param  HTTPS 'on';
        fastcgi_pass   php-fpm:9000;
        fastcgi_index  index.php;
        include        fastcgi_params;
        fastcgi_param  SCRIPT_FILENAME $document_root$fastcgi_script_name;
    }
    location ~* \.(png|gif|jpg|jpeg|ico|css|js|woff|ttf|otf|woff2|eot)$ {
        include /etc/nginx/mime.types;
        expires max;
        try_files $uri /index.php?$query_string;
    }
    client_max_body_size 100M;
  }
  # subdirectory for phpmyadmin pages

  location ^~ /phpmyadmin {

    alias /var/www/html/phpmyadmin;
    try_files $uri $uri/ @phpmyadmin;

    location ~ \.php$ {
      fastcgi_split_path_info ^\/phpmyadmin\/(.+\.php)(.*)$;
      fastcgi_param  HTTPS 'on';
      fastcgi_pass phpmyadmin-fpm:9000;
      include fastcgi_params;
      fastcgi_param SCRIPT_FILENAME $fastcgi_script_name;
    }
  }

  location @phpmyadmin {
     rewrite /phpmyadmin/(.*)$ /phpmyadmin/index.php?/$1 last;
  }

}

 

Reload the configuration of NGINX.

$ docker exec nginx nginx -s reload

 

Create the Database by phpMyAdmin

Already has been set the user and the password for MariaDB in the composer file, access to the MariaDB database in the following site.

https://test-site.com/phpmyadmin

Create the test-database（arbitrary name）.

 

Install by Bakery CLI

Enter the PHP-FPM container, implement the following command to install UserFrosting.

$ docker exec -it php-fpm bash

You need the above database, user and password for Mariadb and SMTP server(for use it for email certification). 

# php bakery bake

 _   _              ______             _   _
| | | |             |  ___|           | | (_)
| | | |___  ___ _ __| |_ _ __ ___  ___| |_ _ _ __   __ _
| | | / __|/ _ \ '__|  _| '__/ _ \/ __| __| | '_ \ / _` |
| |_| \__ \  __/ |  | | | | | (_) \__ \ |_| | | | | (_| |
 \___/|___/\___|_|  \_| |_|  \___/|___/\__|_|_| |_|\__, |
                                                    __/ |
                                                   |___/

UserFrosting's Database Setup Wizard
====================================

 ! [NOTE] Database credentials will be saved in `/var/www/html/app/.env` 
  [0] MySQL / MariaDB
  [1] ProgreSQL
  [2] SQL Server
  [3] SQLite
 > 0

 Hostname [localhost]:
 > mariadb

 Port [3306]:
 > 

 Database name [userfrosting]:
 > test-database

 Username [userfrosting]:
 > your_user

 Password:
 > 


 [OK] Database connection successful


Saving data
-----------


 [OK] Database config successfully saved in `/var/www/html/app/.env`


UserFrosting's SMTP Setup Wizard
================================

 ! [NOTE] SMTP credentials will be saved in `/var/www/html/app/.env`

In order to send registration emails, UserFrosting requires an outgoing mail server. 
 Select setup method [SMTP Server]:
  [0] SMTP Server
  [1] Gmail
  [2] No email support
 > 1

 Your full Gmail (e.g. example@gmail.com):
 > your_address@gmail.com

 Your Gmail password:
 > 

Saving data
-----------

 [OK] SMTP credentials saved to `/var/www/html/app/.env`    

UserFrosting
============

UserFrosing version : 4.3.3
OS Name : Linux
Project Root : /var/www/html
Environment mode : 
PHP Version : 7.2.24
Node Version : v10.16.3
NPM Version : 6.9.0

 

Check It Works

Please access the following address to confirm that it works correctly. Will be displayed the default main view for App. Clicked the "Sign-In" at the upper right position, changed to the view for Log-In. Please enter the user name and the passsword which have been set when you installed UserFrosting.

Displayed  the text of "UserFrosting" and contents stay default. need to change them as you like later. 

I will follow about the expand the user table data and the page customization in the next blog or forum.

https://test-site.com/

UserFrosting Main View for APP

 

User Registration

 

User Log-In

 

User Account Configuration

 

Registry User Management