PHP & Web Development Blogs

In his talk, “Writing Viruses for Fun, Not Profit,”Ben Dechrai (after making the viewer take a pledge to only use this knowledge for good and not evil) walks through how many viruses operate, and just how easy it is to build your own self-replicating virus in PHP.

The danger of many of these viruses according to Ben is that the most dangerous viruses often escape detection by not looking like a virus. Instead they encrypt their code to hide their true intent, while also constantly adapting and evolving.

Perhaps even more dangerously, they act like they’re benign and don’t actually do anything - often times laying dormant until called upon by the malicious actor.

Creating the Virus

What’s scary is just how simple it was for Ben to create such a virus, one that mutated ever so slightly as it infected every other file on the server. Opening up unlimited possibilities from scraping customer data, to DDOS attacks, to simply hijacking your domain.



But those attacks are just the start as Ben demonstrated how easy it is to write new files, delete files, eval() and execute foreign code - which could even be extended to accessing the underlying server itself if shell_exec() is enabled.

To add to the problem, Ben shares how challenging it can be to identify malicious code on your server as many of these attacks are far more sophisticated than the the virus he created in a matter of minutes - hiding themselves and often appearing as if they are part of the original source code.

Deploying the Virus

To drive his point home, Ben demonstrates how even seemingly secure systems can be vulnerable - as all it takes is one tiny misstep within your application.

He highlights this by building what should be a secure photo gallery - one that checks the extension and mime-type of the image - and even stores it outside of the public directory. He goes even farther by adding additional sanity checks with a PHP script that then renders the image.

After walking through the code and it’s security features, he then downloads a simple image from the internet. Opening his editor he quickly injects the virus (written in PHP) into the image and uploads it, passing all of the server checks.

Surely, since it passed these checks the system is secure, right? Ben loads the gallery to proudly show off the image - which is just that… an image, with nothing special or out of the ordinary.
Except that when he opens the image gallery files, each has been infected with the malicious code.

The culprit that allowed for Ben to hijack an entire system and execute foreign code, create new files, and even hijack the entire site? When displaying the image the file was included using PHP’s include() function, instead of pulling in the data using file_get_contents() and echoing it out.

Such a simple mistake provided Ben, if he was a malicious hacker, complete access to all of the files on the system.

Protecting Yourself

Security always exists in layers - and this could have been prevented by including a few more layers, such as using an open source library to rewrite the image, reviewing the image source before pulling it in, or again not giving it executable access by using the PHP include() function.

But what’s terrifying is how simple it is to hijack a site, how easy it is to get access to your system and private data, and how easy it is to overlook security vulnerabilities - especially with open source tooling and those that take plugins.

As Ben explains, sometimes the core code itself is really secure, but then you get two different plugins that when used together accidentally create a security vulnerability. That by itself is one of the most challenging as you can audit each plugin individually, and still not know you’re opening up your system to malicious actors.

This is why it's not just important to stay up to date on the latest security measures and best practices, but to be constantly thinking like a hacker and testing your code for vulnerabilities.

Learn More

You can watch thefull video to learn more how viruses operate, how to quickly build your own PHP virus (but you must promise to use it for good), and what to watch for in order to protect yourself, your customers, and your architecture.

Ever wanted to publish your own extension for PHP but stopped by the lack of C language background? Well, maybe it's time for another take. Zephir language is targeted at people like you.

If you follow this link, you will find these words that say a lot about this project:

Zephir, an open source, high-level language designed to ease the creation and

maintainability of extensions for PHP with a focus on type and memory safety.

Its syntax highly resembles that of PHP, only there's no dollars scattered around your code. Dollar signs, I mean, the PHP $variables. You only can create object oriented extensions, and all the classes written in Zephir must be namespaced. A different and stricter type system exists in Zephir, which allows for transpiling the code you write, into a real C extension.

Why would you need it? This question is largely answered here: Why Zephir. I can only add that, from experience, if you expect a crazy performance boost, you probably won't get it. First, most of the time the bottleneck is not PHP but the IO: database interactions, network and filesystem interactions etc. You won't gain anything by switching to different programming language, in that regards. However, some CPU-intensive calculations may run a lot faster, and if you worry about someone stealing you intellectual property - it also might be worth checking out, because then you can ship your software in form of a binary.

Zephir is the language in which the fastest modern PHP framework is written - Phalcon. Whether or not to use it - decide for yourself, it obviously has its pros and cons. But it's certainly interesting to know that you have the ability to approach some of your tasks completely differently!

See you around, and feel free to comment!

Hey Friends,

I am sharing a very interesting blog on how to create a chat system in php without using ajax. As we all know ajax based chat system in php is not a good solution
because itincreases the server load and redundant xhr calls on our server.

Instead, I am going to use sockets for incoming messages from and send messages to another user. So lets try them out using the following steps:

Step 1: Cross check in php.ini that sockets extension is enabled

;extension=sockets
extension=sockets

Step 2: Create server.php file

This file will handle the incoming and outgoing messages on sockets, Add following variables in top of the file:

$host = 'localhost';
$port = '9000';
$null = NULL; 

Step 3: After it add helper methods

The following code for handshake with new incoming connections and encrypt and decrypt messages incoming and outgoing over sockets:

function send_message($msg)
{
global $clients;
foreach($clients as $changed_socket)
{
@socket_write($changed_socket,$msg,strlen($msg));
}
return true;
}
function unmask($text) {
$length = ord($text[1]) & 127;
if($length == 126) {
$masks = substr($text, 4, 4);
$data = substr($text, 8);
}
elseif($length == 127) {
$masks = substr($text, 10, 4);
$data = substr($text, 14);
}
else {
$masks = substr($text, 2, 4);
$data = substr($text, 6);
}
$text = "";
for ($i = 0; $i < strlen($data); ++$i) {
$text .= $data[$i] ^ $masks[$i%4];
}
return $text;
}
function mask($text)
{
$b1 = 0x80 | (0x1 & 0x0f);
$length = strlen($text);

if($length <= 125)
$header = pack('CC', $b1, $length);
elseif($length > 125 && $length < 65536)
$header = pack('CCn', $b1, 126, $length);
elseif($length >= 65536)
$header = pack('CCNN', $b1, 127, $length);
return $header.$text;
}
function perform_handshaking($receved_header,$client_conn, $host, $port)
{
$headers = array();
$lines = preg_split("/

/", $receved_header);
foreach($lines as $line)
{
$line = chop($line);
if(preg_match('/\A(\S+): (.*)\z/', $line, $matches))
{
$headers[$matches[1]] = $matches[2];
}
}
$secKey = $headers['Sec-WebSocket-Key'];
$secAccept = base64_encode(pack('H*', sha1($secKey . '258EAFA5-E914-47DA-95CA-C5AB0DC85B11')));
$upgrade = "HTTP/1.1 101 Web Socket Protocol Handshake

" .
"Upgrade: websocket

" .
"Connection: Upgrade

" .
"WebSocket-Origin: $host

" .
"WebSocket-Location: ws://$host:$port/php-ws/chat-daemon.php

".
"Sec-WebSocket-Accept:$secAccept



";
socket_write($client_conn,$upgrade,strlen($upgrade));
}

Step 4: Now add following code to create bind and listen tcp/ip sockets:

$socket = socket_create(AF_INET, SOCK_STREAM, SOL_TCP);
socket_set_option($socket, SOL_SOCKET, SO_REUSEADDR, 1);
socket_bind($socket, 0, $port);
socket_listen($socket);
$clients = array($socket);

Ok now a endless loop that will use for handeling incominga nd send messages:

while (true) {
$changed = $clients;
socket_select($changed, $null, $null, 0, 10);

if (in_array($socket, $changed)) {
$socket_new = socket_accept($socket);	$clients[] = $socket_new; 
$header = socket_read($socket_new, 1024);	perform_handshaking($header, $socket_new, $host, $port); 
socket_getpeername($socket_new, $ip);	$response = mask(json_encode(array('type'=>'system', 'message'=>$ip.' connected')));	send_message($response); 
$found_socket = array_search($socket, $changed);
unset($changed[$found_socket]);
}

foreach ($changed as $changed_socket) {

while(socket_recv($changed_socket, $buf, 1024, 0) >= 1)
{
$received_text = unmask($buf);	$tst_msg = json_decode($received_text, true);	$user_name = $tst_msg['name'];	$user_message = $tst_msg['message'];	$user_color = $tst_msg['color']; 
$response_text = mask(json_encode(array('type'=>'usermsg', 'name'=>$user_name, 'message'=>$user_message, 'color'=>$user_color)));
send_message($response_text);	break 2;	}

$buf = @socket_read($changed_socket, 1024, PHP_NORMAL_READ);
if ($buf === false) {	$found_socket = array_search($changed_socket, $clients);
socket_getpeername($changed_socket, $ip);
unset($clients[$found_socket]);

$response = mask(json_encode(array('type'=>'system', 'message'=>$ip.' disconnected')));
send_message($response);
}
}
}
socket_close($socket);

So you are ready with server side socket program, Now its time to move on front side where we will implement w3c provided client side Web Socket Apis,

Step 5: create a file named index.php for frontend usage with following initial code

$host = 'localhost';
$port = '9000';
$subfolder = "php_ws/";
$colors = array('#007AFF','#FF7000','#FF7000','#15E25F','#CFC700','#CFC700','#CF1100','#CF00BE','#F00');
$color_pick = array_rand($colors);
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="chat-wrapper">
<div id="message-box"></div>
<div class="user-panel">
<input type="text" name="name" id="name" placeholder="Your Name" maxlength="15" />
<input type="text" name="message" id="message" placeholder="Type your message here..." maxlength="100" />
<button id="send-message">Send</button>
</div>
</div>
</body>
</html>

Now add some basic styling in the head section using following code:

<style type="text/css">
.chat-wrapper {
font: bold 11px/normal 'lucida grande', tahoma, verdana, arial, sans-serif;
 background: #00a6bb;
 padding: 20px;
 margin: 20px auto;
 box-shadow: 2px 2px 2px 0px #00000017;
max-width:700px;
min-width:500px;
}
#message-box {
 width: 97%;
 display: inline-block;
 height: 300px;
 background: #fff;
 box-shadow: inset 0px 0px 2px #00000017;
 overflow: auto;
 padding: 10px;
}
.user-panel{
 margin-top: 10px;
}
input[type=text]{
 border: none;
 padding: 5px 5px;
 box-shadow: 2px 2px 2px #0000001c;
}
input[type=text]#name{
 width:20%;
}
input[type=text]#message{
 width:60%;
}
button#send-message {
 border: none;
 padding: 5px 15px;
 background: #11e0fb;
 box-shadow: 2px 2px 2px #0000001c;
}
</style>

Ok Style is all set now need to add a jquery script and create web socket object and handle all events on it as following code need to add before closing of bosy tag:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script language="javascript" type="text/javascript"> 
var msgBox = $('#message-box');
var wsUri = "ws://".$host.":".$port."/php-ws/server.php"; 
websocket = new WebSocket(wsUri); 

websocket.onopen = function(ev) {	msgBox.append('<div class="system_msg" style="color:#bbbbbb">Welcome to my "Chat box"!</div>');	}
websocket.onmessage = function(ev) {
var response	= JSON.parse(ev.data); 
var res_type	= response.type;	var user_message	= response.message;	var user_name	= response.name;	var user_color	= response.color;	switch(res_type){
case 'usermsg':
msgBox.append('<div><span class="user_name" style="color:' + user_color + '">' + user_name + '</span> : <span class="user_message">' + user_message + '</span></div>');
break;
case 'system':
msgBox.append('<div style="color:#bbbbbb">' + user_message + '</div>');
break;
}
msgBox[0].scrollTop = msgBox[0].scrollHeight;	};

websocket.onerror	= function(ev){ msgBox.append('<div class="system_error">Error Occurred - ' + ev.data + '</div>'); }; 
websocket.onclose	= function(ev){ msgBox.append('<div class="system_msg">Connection Closed</div>'); }; 
$('#send-message').click(function(){
send_message();
});

$( "#message" ).on( "keydown", function( event ) {
 if(event.which==13){
 send_message();
 }
});

function send_message(){
var message_input = $('#message');	var name_input = $('#name'); 
if(message_input.val() == ""){	alert("Enter your Name please!");
return;
}
if(message_input.val() == ""){	alert("Enter Some message Please!");
return;
}
var msg = {
message: message_input.val(),
name: name_input.val(),
color : '<?php echo $colors[$color_pick]; ?>'
};
websocket.send(JSON.stringify(msg));
message_input.val('');	}
</script>

Ok All set, Now need to run the server.php file using following php-cli utility,make sure you have php cli utility installed in your system:


php -q c:\xampp\htdocs\php-ws\server.php

Now you may access the front index.php file via the browser url like following and see a chatbox and connection status, you may use the same url or different browser to check the chat system is working or not.

Welcome back! If you’re new to this series have a look at Part 1 here

Today’s focus is on templating, the aesthetic that will make or break your web application.

Having a clean design with well defined CSS that’s responsive and user friendly goes a long way.

Developers often stick to their lane but delving into templating will bode in your favor, you can indeed
create a functional and launch-worthy application all on your own!

Let’s jump into it!

Structured structure

Everything you tackle should be found with ease down the line. Therefore careful planning is fundamental to the success and sustainability of your project. You’ll also find that clearly defining your work lends itself to more productivity overall as you spend less that explaining your work during a handover / looking for a specific piece of code or resource. You’ll probably end up spending more time on actual work.
Finding your own unique pattern with file structure and CSS identifiers will also work in your favor as something unique to your process will most likely be easier to remember and form a tactile relationship with.

Our project’s current structure looks like this:



>If you need to backtrack, Part 1 is a great place to start!

In part 1, we created our index.php which displays info from our database.

Let’s take this a step further and create a header and a footer for our index.php

Create a file called header.php and save this to your includes folder.

Next, create a file called footer.php and save this to your includes folder.

Your file structure should now look like this.

A header above all the rest

The header file will be a file we reuse throughout your web application. This file will contain important information that’s vital to the functionality and aesthetic of your website.
The type of info you’ll expect to see in a header.php file:
Script includes
Such as JQuery and important libraries
CSS includes
CSS files loaded from internal or external sources
Meta information
Contains important information that’s readable by search engines.
The basic structure of the beginning of your app, including your menu, and your logo.
For now, how header is going to have a basic layout.

Let’s get our HTML on!

<html>
<head>
<title>My Awesome CMS – Page Title</title>
</head>
<body>

A footer that sets the bar

Create a file called footer.php and save it to your includes folder (yourcms/includes/footer.php).

Add this code to your new file.

</body>
</html>

Next, let’s focus on the gravy… The CSS

CSS, when written beautifully, can truly set you apart.

You can tell your web application to load various styles to specific elements by defining unique identifiers.
Styles that are only used once are denoted with a # (a CSS “ID”) whereas styles that are reused multiple times are denoted with a . (a CSS “class”)

The best way to delve into the realm of CSS is to learn by experience.

Let’s create!

First, we need to create and load our CSS file. Remember our nifty new pal header.php? This created a convenient way to load our CSS file!

Add the following code to your header.php just above the </head> tag.

<link href=”../assets/css/style.css” type=”text/css” rel=”stylesheet”/> 

The ../ in the link to our stylesheet means we have to leave the current directory (the directory that header.php is in) and look for the assets/css/ directories.

Go ahead and create the css folder under your assets folder.

Next we’re going to create some simple CSS to test things out.

It’s time to add some style!

We are going to create two divs.
A div is a divider / section in HTML.
Add this to your index.php (located in your CMS’ root folder) above the <?php tag.

<div id="myfirstid"></div>
<div class="myfirstclass"></div>
<div class="myfirstclass"></div>
<div class="myfirstclass"></div>
<div class="myfirstclass"></div>
<div class="myfirstclass"></div>

Then, create a CSS file

Add this:

#myfirstid{
Background:lightblue;
Font-family:Arial;
Font-size:44px; 
Font-weight: Bold; 
}
.myfirstclass{
Font-size:15px;
Color: darkblue;
}

Save your newly created CSS to assets/css/ as style.css.

Pulling it all together, let’s see what we can do!

Let’s apply what we just learned to our index.php. But first, we should add our header.php and footer.php files.

Including everyone

Add this to the top of your index.php file:

include(‘includes/header.php’);

Remove the <divs> we used for practice earlier, we have something better in store!

Add this to the bottom of your index.php:

include(‘includes/footer.php’);

Next, let’s modify our code so we can add some style to the data we retrieve from our database.

Modify the following line:

foreach($getmydata as $mydata){ echo "Title: "; echo $mydata['title']; echo "<br/>"; echo "Content: "; echo $mydata['content']; echo "<br/>"; echo "Author: "; echo $mydata['author']; echo "<br/>"; echo "<br/>";

as follows:

?>

<div id=”myfirstid”>
<?php
foreach($getmydata as $mydata){
echo "<div class=”myfirstclass”>Title: "; 
echo $mydata['title']; 
echo "<br/>"; 
echo "Content: "; 
echo $mydata['content']; 
echo "<br/>"; 
echo "Author: "; 
echo $mydata['author']; 
echo "</div><br/><br/>";
}?>
</div>
<?php 

Your full index.php should now look like this:

<?php
include('includes/header.php');
include('includes/conn.php');

if ($letsconnect -> connect_errno) { echo "Error " . $letsconnect -> connect_error;

}else{

$getmydata=$letsconnect -> query("SELECT * FROM content");

?>
<div id="myfirstid">
<?php
foreach($getmydata as $mydata){
echo "<div class=”myfirstclass”>Title: "; 
echo $mydata['title']; 
echo "<br/>"; 
echo "Content: "; 
echo $mydata['content']; 
echo "<br/>"; 
echo "Author: "; 
echo $mydata['author']; 
echo "</div><br/><br/>";
}
?>
</div>
<?php 
}

$letsconnect -> close();
include('includes/footer.php');
?>

Go ahead, test it out!

There’s a lot to unpack and I will break things down a little more during our next tutorial!

Challenge

Study the final index.php and try to form a few theories about why closing a php tag is necessary before adding raw html.

Next Up: #CodeWithMe Part 4: Building A Good Base

Hi Guys,
I am sharing you the simple steps by which you can broadcast the web push notifications to your subscriber. In this tutorial we are making a subscriber form and saving information using Ajax and PHP and then through a server side code returning response to current logged in user and showing notification to that user.
Following are the steps to build this system

1. Create a database, I am creating db with name 'web_notifications'

Creating subscribers and notifications tables using following sql statements

CREATE TABLE IF NOT EXISTS <code>subscribers</code> (
 <code>id</code> int(11) NOT NULL,
 <code>name</code> varchar(255) NOT NULL,
 <code>email</code> varchar(255) NOT NULL,
 <code>createdAt</code> timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

ALTER TABLE <code>subscribers</code> ADD PRIMARY KEY (<code>id</code>);

ALTER TABLE <code>subscribers</code> MODIFY <code>id</code> int(11) NOT NULL AUTO_INCREMENT;



CREATE TABLE IF NOT EXISTS <code>notifications</code> (
 <code>id</code> int(11) NOT NULL,
 <code>to_user</code> int(11) NOT NULL,
 <code>title</code> varchar(255) NOT NULL,
 <code>body</code> varchar(255) NOT NULL,
 <code>url</code> varchar(255) NOT NULL,
 <code>is_sent</code> int(11) NOT NULL DEFAULT '0',
 <code>createdAt</code> timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

ALTER TABLE <code>notifications</code> ADD PRIMARY KEY (<code>id</code>);

ALTER TABLE <code>notifications</code> MODIFY <code>id</code> int(11) NOT NULL AUTO_INCREMENT;

2. Now create a db_connect.php file with following code

<?php 
session_start();
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "web_notifications";

$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
 die("Connection failed: " . $conn->connect_error);
} 
?>

3. Create a cookies.js file to read and write browser cookies

function WriteCookie(key,content) {
 var now = new Date();
 now.setMonth( now.getMonth() + 1 ); 
 document.cookie = key+"=" + escape(content) + ";";
 document.cookie = "expires=" + now.toUTCString() + ";"
}

function ReadCookie(key) {
 var allcookies = document.cookie;
 cookiearray = allcookies.split(';');
 var CookieData=Array();
 for(var i=0; i<cookiearray.length; i++) {
 k = cookiearray[i].split('=')[0];
 v = cookiearray[i].split('=')[1];
 CookieData[k]=v;
 }
 return CookieData[key];
}

4. Create a ajax file to read and mark is_sent if any notification foun to be sent in database for that user. create file with name 'fetch_notifications.php' with following content

<?php require 'db_connect.php';

$sql = "SELECT id,title,body,url FROM notifications where to_user='".@$_GET['user_id']."' and is_sent='0' ";
$result = $conn->query($sql);

$data=array();
if ($result->num_rows > 0) {
 while($row = $result->fetch_assoc()) {
 $data[]=$row;

 $upd = "update notifications set is_sent='1' where id='".$row['id']."' ";
 $conn->query($upd);

 }
}

if(count($data)>0)
{
 $response=array("status"=>1,"notification"=>$data);
}
else
{
 $response=array("status"=>0,"error"=>"No new notification!");
}

echo json_encode($response);

$conn->close(); 
?>

5. Now code index.php to show subscriber form and on submit insert record into the subscriber table

<?php require 'db_connect.php'; ?>
<!DOCTYPE html>
<html>
<head>
 <title>Web Push Notification Demo</title>
 <script src="./cookies.js" type="text/javascript"></script>
 <link href="
<script src="
<script src="
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
<?php 
if(isset($_POST['subscribe_form']))
{
 $_SESSION['is_login']=0;
 $username=$conn->real_escape_string($_POST['username']);
 $useremail=$conn->real_escape_string($_POST['useremail']);


 $sql = "INSERT INTO subscribers set name='".$username."',email='".$useremail."' ";
 if ($conn->query($sql) === TRUE) {
 $_SESSION['is_login']=1;
 $_SESSION['Uid']= $conn->insert_id;
 $_SESSION['Uname']= $username;
 ?>
 <script type="text/javascript">
 WriteCookie("Uid","<?php echo $_SESSION['Uid']; ?>");
 </script> 
 <?php
 $msg="<p style='color:green'>You have subscribe for push notification succesfully :)</p>";
 } else {
 $msg="<p style='color:red'>Error in subscribing for notifications</p>";
 }


}

?>
<div class="container">
<?php 
if(isset($msg) && $msg!='')
{
 ?>
 <br>
 <div class="alert alert-info">
 <?php echo $msg; ?>
 </div>
 <?php
}

if(isset($_SESSION['is_login']) && $_SESSION['is_login']==1)
{
 ?>
 <h2>Welcome <?php echo $_SESSION['Uname']; ?></h2>
 <script type="text/javascript"> 

setInterval(function(){ 
 check_notification(); 
}, 10000);

function check_notification()
{ 
 var Uid=ReadCookie("Uid");
 if(Uid!==undefined)
 {
 $.ajax({url: "fetch_notifications.php?user_id="+Uid, success: function(result){ 
 var response=JSON.parse(result);
 if(response.status==1)
 {
 
 response=response.notifications;
 for (var i = response.length - 1; i >= 0; i--) {
 var url = response[i]['url'];
 var noti = new Notification(response[i]['title'], {
 icon: 'logo.png', body: response[i]['body'],
 });
 noti.onclick = function () {
 window.open(url); 
 noti.close(); 
 };
 
 };

 }
 else{
 console.log(response.error);

 }
 
 }

 }); 
 }
}

 
 </script>
 <?php
}
else
{
 ?>
 <h2 class="text-center">Subscribe for Notifications</h2>
 <div class="row justify-content-center">
 <div class="col-12 col-md-8 col-lg-6 pb-5">

 <div class="card border-primary rounded-0">
 <div class="card-header p-0">
 <div class="bg-info text-white text-center py-2">
 <h3><i class="fa fa-envelope"></i> Information</h3>
 <p class="m-0">provide your information</p>
 </div>
 </div>
 <div class="card-body p-3">
 <form method="post">
 <!--Body-->
 <div class="form-group">
 <div class="input-group mb-2">
 <div class="input-group-prepend">
 <div class="input-group-text"><i class="fa fa-user text-info"></i></div>
 </div>
 <input type="text" class="form-control" id="username" name="username" placeholder="Input Your Name Here" required>
 </div>
 </div>
 <div class="form-group">
 <div class="input-group mb-2">
 <div class="input-group-prepend">
 <div class="input-group-text"><i class="fa fa-envelope text-info"></i></div>
 </div>
 <input type="text" class="form-control" id="useremail" name="useremail" pattern="[^@\s]+@[^@\s]+\.[^@\s]+" title="Invalid email address" placeholder="[email protected]" required>
 </div>
 </div>

 <div class="text-center">
 <input type="submit" value="Subscribe" name="subscribe_form" class="btn btn-info btn-block rounded-0 py-2">
 </div>
 </form>
 </div>

 </div>
 


 </div>
 </div>
<?php }?>
</div>



</head>
<body>

</body>
</html>
<?php 
$conn->close(); 
?>

The frontend of your subscription page (index.php) should look like this:




Now we are ready to receive notification in frontend, but we still need to create an admin page from where we can send notification to subscriber(s).

6. Create a table for admin user

CREATE TABLE IF NOT EXISTS <code>admin</code> (
 <code>id</code> int(11) NOT NULL,
 <code>username</code> varchar(255) NOT NULL,
 <code>password</code> varchar(255) NOT NULL,
 <code>createdAt</code> timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

ALTER TABLE <code>admin</code> ADD PRIMARY KEY (<code>id</code>);

ALTER TABLE <code>admin</code> MODIFY <code>id</code> int(11) NOT NULL AUTO_INCREMENT;

INSERT INTO <code>web_notifications</code>.<code>admin</code> (<code>id</code>, <code>username</code>, <code>password</code>, <code>createdAt</code>) VALUES (NULL, 'admin', MD5('123456'), CURRENT_TIMESTAMP);

Following is the code for admin.php to add the notifications to subscriber(s) account also i have inserted following login credentials for admin in admin table:
username:admin
password:123456

7. Now put following code in admin.php

<?php require 'db_connect.php'; ?>
<!DOCTYPE html>
<html>
<head>
 <title>ADMIN PAGE</title> 
 <link href="
<script src="
<script src="
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
<?php 
if(isset($_POST['login']))
{
 $_SESSION['admin_login']=0;
 $username=$conn->real_escape_string($_POST['username']);
 $password=$conn->real_escape_string($_POST['password']);
 $sql = "SELECT * FROM admin where username='".$username."' and password='".md5($password)."' ";
 $result = $conn->query($sql);
 if ($result->num_rows > 0) {
 $_SESSION['admin_login']=1;
 $msg="<p style='color:green'>Admin Logged-in Successfully :)</p>";
 }
 else {
 $msg="<p style='color:red'>INVALID CREDENTIALS FOR ADMIN</p>";
 } 


}
if(isset($_POST['add_notification']))
{ 
 $title=$conn->real_escape_string($_POST['title']);
 $body=$conn->real_escape_string($_POST['body']);
 $url=$conn->real_escape_string($_POST['url']);
 $users=$_POST['users'];

 foreach ($users as $user_id) {
 $ins = "insert into notifications set to_user='".$user_id."' , title='".$title."', url='".$url."', body='".$body."' ";
 $conn->query($ins);
 }
 $msg="<p style='color:green'>Notification(s) added to subscribers account.</p>";
 
}

?>
<div class="container">
<?php 
if(isset($msg) && $msg!='')
{
 ?>
 <br>
 <div class="alert alert-info">
 <?php echo $msg; ?>
 </div>
 <?php
}

if(isset($_SESSION['admin_login']) && $_SESSION['admin_login']==1)
{
 ?>
 <h2>Welcome Admin, Send notification to Subscriber(s)</h2>

<form method="post">
 
 

<div class="form-group">
 <label for="sel1">Select Subscriber(s):</label>
 <select multiple="multiple" required="required" class="form-control" id="users" name="users[]">
 <?php
$sql = "SELECT id,name FROM subscribers";
$result = $conn->query($sql);

$data=array();
if ($result->num_rows > 0) {
 while($row = $result->fetch_assoc()) {
 echo "<option value='".$row['id']."'>".$row['name']."</option>";
 }
}
?>
 </select>
</div>

 <div class="form-group">
 <label for="email">Title</label>
 <input type="text" required class="form-control" placeholder="notification title here" name="title" id="title">
 </div>
 
 <div class="form-group">
 <label for="email">Message</label>
 <textarea required class="form-control" placeholder="notification message here" name="body" id="body"></textarea> 
 </div>

 <div class="form-group">
 <label for="email">Url</label>
 <input type="url" required class="form-control" placeholder="notification landing/click url here" name="url" id="url">
 </div>
 
 <input type="submit" class="btn btn-primary btn-block" name="add_notification" value="Submit" />

</form>


 <?php
}
else
{
 ?>
 <h2 class="text-center">ADMINISTRATOR</h2>
 <div class="row justify-content-center">
 <div class="col-12 col-md-8 col-lg-6 pb-5">

 <div class="card border-primary rounded-0">
 <div class="card-header p-0">
 <div class="bg-info text-white text-center py-2">
 <h3><i class="fa fa-envelope"></i> LOGIN</h3>
 <p class="m-0">provide admin login credentials</p>
 </div>
 </div>
 <div class="card-body p-3">
 <form method="post">
 <!--Body-->
 <div class="form-group">
 <div class="input-group mb-2">
 <div class="input-group-prepend">
 <div class="input-group-text"><i class="fa fa-user text-info"></i></div>
 </div>
 <input type="text" class="form-control" id="username" name="username" placeholder="Input username here" required>
 </div>
 </div>
 <div class="form-group">
 <div class="input-group mb-2">
 <div class="input-group-prepend">
 <div class="input-group-text"><i class="fa fa-key text-info"></i></div>
 </div>
 <input type="password" class="form-control" id="password" name="password" placeholder="your password here" required>
 </div>
 </div>

 <div class="text-center">
 <input type="submit" value="Login" name="login" class="btn btn-info btn-block rounded-0 py-2">
 </div>
 </form>
 </div>

 </div>
 


 </div>
 </div>
<?php }?>
</div>



</head>
<body>

</body>
</html>
<?php 
$conn->close(); 
?>

The admin page will ask login credentials first then it will look like following screenshot:



Now in your project if you open index.php you have a frontend where user will register themselves to receive notifications, and admin.php is your backend where you can send notifications to users or subscribers


If you face any problem in setup this small project please just let me know in the comments below, or by messaging me.