DEV Community: Asif Uddin

Text over Background Image with Viewport Width (vw)

Asif Uddin — Mon, 12 Apr 2021 16:13:57 +0000

Plan

Many time we show texts over images. We will define three background images and then write text above (top, middle and bottom) it.

Basic Structure

Our site will contain a table with 3 column. Each will contain a background image with text above it.

<style type="text/css">
    table{
        width: 100%;
    }
    tr{
        width: 100%;
        vertical-align: top;
    }
</style>
<table>
    <tr>
        <td>
            <p>Road to Heaven</p>
        </td>
        <td>
            <p>Road to Heaven</p>
        </td>
        <td>
            <p>Road to Heaven</p>
        </td>
    </tr>
</table>

Background image

Let's add the background image first.

td{
        background-image: url("https://images.unsplash.com/photo-1526512340740-9217d0159da9?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1545&q=80");
        background-repeat: no-repeat;
        background-size: 100%;
        text-align: center;
}

Text above image

Also let's design the text a bit.

p{
        font-size: 2vw;
        padding: 20px;
        background-color: #000000b5;
        border: 1px solid #ffffff;
        border-radius: 15px;
        color: white;
        text-shadow: 0px 1px #eff1f4;
}

Position the text

Now we will position 1st text on top, 2nd text in middle and 3rd text on bottom.

td:nth-child(1) p{
      margin-top: 0vw;
      margin-bottom: 40vw;
}
td:nth-child(2) p{
      margin-top: 20vw;
      margin-bottom: 20vw;
}
td:nth-child(3) p{
      margin-top: 40vw;
      margin-bottom: 0vw;
}

Result

Let's see the result in different screen widths.

1200px

800px

400px

Full Code

<style type="text/css">
    table{
        width: 100%;
    }
    tr{
        width: 100%;
        vertical-align: top;
    }
    td{
        background-image: url("https://images.unsplash.com/photo-1526512340740-9217d0159da9?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1545&q=80");
        background-repeat: no-repeat;
        background-size: 100%;
        text-align: center;
    }
    p{
        font-size: 2vw;
        padding: 20px;
        background-color: #000000b5;
        border: 1px solid #ffffff;
        border-radius: 15px;
        color: white;
        text-shadow: 0px 1px #eff1f4;
    }
    td:nth-child(1) p{
      margin-top: 0vw;
      margin-bottom: 40vw;
    }
    td:nth-child(2) p{
      margin-top: 20vw;
      margin-bottom: 20vw;
    }
    td:nth-child(3) p{
      margin-top: 40vw;
      margin-bottom: 0vw;
    }
</style>
<table>
    <tr>
        <td>
            <p>Road to Heaven</p>
        </td>
        <td>
            <p>Road to Heaven</p>
        </td>
        <td>
            <p>Road to Heaven</p>
        </td>
    </tr>
</table>

OWASP Secure Coding Practices

Asif Uddin — Sat, 20 Feb 2021 13:48:16 +0000

Before We Start

This is just a few points cropped from OWASP Secure Coding Practices to refresh everyone's mind about Secure Coding Practices. Reading the main resource is advised and more appreciated. Please find the main resource in this Link.

Secure Coding Practices

These are not something new. These are the industry best practices that many of you already know. But it's better to refresh this knowledge once in a while. So Without any further talking let's go to the point.

Input Validation

Validation must be included both in server and client side.
Data can be classified in trusted and un-trusted section.
Proper character sets (e.g. UTF-8) should be specified for all input.
UTF-8 encoding/decoding can be used for security from malicious character.
Hazardous characters should not be allowed (e.g. <> " ' % ( ) & + \ \' \"*#;--).

Output Encoding

Translate special characters into non-dangerous character for interpreter / server.
All characters should be encoded unless they are known to be safe for the intended interpreter.
All data going for SQL, XML, and LDAP* should be sanitized.

Authentication and Password Management

Passwords should be saved as one-way salted hash (MD5 is easy to break).
Password hashing should be done on server.
Instead showing "Invalid username" or "Invalid password" just use "Invalid username and/or password“.
Authentication for connections to external systems should be implemented.
To transmit authentication credentials use HTTP/HTTPS POST request.
Changing temporary passwords & Strong password policy should be enforced.
Account should be temporarily disabled after a number of invalid login attempt.
Temporary information (e.g. OTP) should have expiration time.
Multi-Factor Authentication can be used.
Third party codes for authentication must be inspected carefully.

Session Management

Sessions should be created on server with well vetted algorithms.
Logout should terminate session and generate new on any re-authentication.
Concurrent logins with the same user ID should be discouraged.
Session identifiers should not be exposed and easy guessable.
It is recommended to consistently utilize HTTPS rather than switching between HTTP.
Cross-Site Request Forgery (CSRF) should be prevented.

Access Control

Authorization decisions should be made from server side.
Access to files or other resources should be authorized.
User role should be implemented in terms of access.
Number of transactions a single user or device can perform in a given period of time should be limited.
Auditing and disabling of unused accounts should be implemented.
Create an Access Control Policy.

Cryptographic Practices

All cryptographic functions should be implemented on Server.
A policy to manage cryptographic keys should be established.

Error Handling and Logging

Sensitive information like stack trace should not be disclosed in error responses.
Try to handle most of the error on client side and custom error pages should be constructed.
Allocated memory should be securely released when error conditions occur.
Logs should contain log event data like validation failures, authentication attempts, apparent tampering events, exceptions, administrative functions failures.
Sensitive informatio should not be logged and log access should be restricted.
Log analysis should be done and non-printable characters should be encoded in log entries.

Data Protection

Users should get only required data that is needed to perform their tasks.
Sensitive data should be identified to establish a policy to control it.
Cached or Temporary copies of sensitive data stored on the server should be protected.
Highly sensitive information should be encrypted.
Server-side source-code should be protected from being downloaded by a user.
Unnecessary application and system documentation should be removed from production server.
Sensitive information should not be in HTTP GET request parameters.

Communication Security

SSL should be enabled with non expired, proper domain certificate.
External systems should also have SSL.
At minimum operations like Login, Registration, Access to personal data , Change of password & Password reminder function should be encrypted.

System Configuration

Servers, frameworks and system should be in latest stable version with security patch.
Directory & directory structure listings should be turned off and unnecessary functionality, files test code or any functionality should not be in production.
Info related to OS, server & app framework should be removed from HTTP response headers.
An asset management system should be implemented (like Git).
Isolate development from production.

Database Security

Databases should be hardened in accordance with CIS benchmarks.
Variables should be strongly verified before sending into queries.
Database should be accessed using secured user with lowest privileged.
Connection strings should not be hard coded and should be encrypted.
DB connection should be closed as soon as possible.
Default passwords should be changed.
Any accounts that are not required should be disabled.

File Management

User supplied data should not be passed to dynamic execution function (ex - Eval).
Authentication is required before providing files.
Execution privileges should be turned off on file upload directories.
Use Secure Upload (check file size, change file name, check extension).
Directory or file paths should not be passed, use index values mapped to pre-defined list.

Memory Management

Double check that buffer size and do not write past the allocated space.
All input strings should be truncated to a reasonable length.
Specifically close resources, don’t rely on garbage collection.
Do not use known vulnerable functions (e.g., printf, strcat, strcpy etc.).
Allocated memory should be securely freed.

General Coding Practices

Tested and approved code should be prioritized over new code.
Verify Integrity of interpreted code, libraries, executables, and configuration files.
Use variables & resources carefully and initialize during declaration or before usage.
Calculation errors should be avoided by understanding how the language handles numbers.
User supplied data should not be passed to dynamic execution function (ex - Eval).
Secondary applications, third party codes and libraries safety should be reviewed.
Encrypted and Secured channels should be used to transfer the code from the host server.
Frameworks should be updated to latest stable version.
Developers should be trained on secure coding practices periodically.

PHP: Few Good Practices

Asif Uddin — Fri, 30 Oct 2020 16:24:23 +0000

What is PHP ?

The full meaning of PHP is PHP Hypertext Preprocessor. It is a Server side scripting language used for web development. Means it processes the client request in the server and returns response. It is free to download and use. There are many server side languages like ASP.NET, JSP, Python etc.

History

The PHP we know was developed in 1994 by Rasmus Lerdorf. He built this language to keep the trace of visitors came in his site. He named it Personal Home Page Tool which in short is PHP Tool. Afterwards Ramos enriched this programming language and in 1995 He made it Open Source. This brought vast fame and enrichment to PHP. Till the date of writing this article, the latest version of PHP is 7 whereas PHP 8 is in testing phase.

How does it work

In general PHP resides with HTML, CSS, JavaScript etc. The files containing PHP codes are given the extension ".php" for example "index.php", "abc.php" etc. PHP codes are written in between "<?php" and "?>". All the codes inside that are processed by PHP Interpreter and returned a result to the client.

Let's see an image of how PHP works:

Popularity

PHP is a popular web development language. Even worlds biggest social networking site Facebook uses PHP. Sites/Tools like Wordpress, Blogging etc. are based on PHP. It can be installed on any type of server available. It also gained fame because of being Free, Open Source and Easy to Learn. Many renowned Framework, CMS: Content Management System & E-Commerce sites are developed in PHP. Among them Codeigniter, CakePhp, Wordpress etc. are worth mentioning.

Security

Security is a buzz word now a days. The security in PHP depends on some factors. As PHP is open source, so the bugs are addressed and resolve frequently but majority of the security depends on server configuration. Most of the security issues are found in server configuration. The security also depends on how the website was developed. Like, a lot of websites has user login facility where users can login and do different things. Defining user roles will limit user activities (What they can do and can not do).

Good Practices

Few good practices can ensure the security of a PHP site. Right configuration can maintain a good security layer. Let's see some good practices that may help you securing your PHP site.

Note that examples are more suited for Linux, Redhat etc. And every-time after changing configuration httpd, Nginx etc. will be needed to restart for enforcing changes.

Always use the latest Stable Version of PHP. Older versions can have bugs or exploits. To see the version of PHP we can write the command in cmd "php -v".
It is very important to determine the Document Root of a site. This is the location where source code of all the web sites are kept. Generally in Linux, Redhat etc. Operating system default document root is "/var/www/html". Other than web site source code nothing else should be kept in this location. This configuration can be found in "httpd.conf" file.
Websites are vulnerable to different types of attacks. Few of them mentioned below:

3.1 XSS: Cross Site Scripting is an attack in which attacker inserts script inside information requested from a user. Like while entering the full name of a user, attacker can embed JS: Java Script inside. As a result when the full name of that user gets printed then the script get executed in the client/user side because JS is client side language. Using this attacker can divert user towards a malicious site, can try to theft data etc. To get rid of this kind of attack, any data getting from users are needed to be verified and filtered properly. Like a input field destined to take number should be validated on both client side and server side that the input given by user is a number.

3.2 SQL Injection is a well known threat to websites. Due to this attack the information stored in Database can be hampered. It is also like XSS but in this case SQL Query is embedded. Think about a site where users search for people by typing phone number like below:

When users types phone number and clicks search button then in the server below query is executed.

SELECT name,phone FROM people WHERE phone=01****;

But in order to inject SQL we can enter "01**** OR 1=1". As a result the SQL Query will look like below:

SELECT name,phone FROM people WHERE phone=01**** OR 1=1;

Which will in return reveal all the user and their phone numbers. It is a security threat. Moreover SQL Injection can be used to destroy database, remove information, reveal database structure etc.

3.3 Allowing users to upload file can also be a medium of attack. If attacker gets to upload any type of file then the attacker may upload malicious file. To get rid of this kind of attack site owners can disable file upload from PHP configuration. OR during file upload user should only be allowed to upload defined types of files (pdf, jpeg, png etc.) and within defined size (5mb, 3mb etc.)

3.4 If Remote Execution is enabled then attacker will be able to run PHP Script in the server from a remote location. eval() can be used to hide PHP codes inside server. These two can be prevented by changing PHP Configuration.

4. PHP has many different Module to accomplish different tasks Like to work with MYSQL php has "mysqli" Module. To see all these modules just type "php -m" in servers cmd. As a result a list of all modules will be printed. The unnecessary modules can be removed from this list. It will increase the efficiency and security of PHP. Module enable/disable can be found in php.ini file.

[PHP Modules]
apc
bcmath
bz2
calendar
Core
ctype
curl
date
dom
........

5. PHP send its version information in HTTP header. It can be disabled from PHP configuration. To do that in php.ini below lines should be mentioned.

expose_php=Off
ServerSignature Off
ServerTokens Prod

6. It is important not to show error details to users. Because in error details there it is mentioned in which line of which file the error occurred as well as the stack trace is printed. This info is of no use to users also can be security risk. It can be disabled from PHP configuration. To do that in php.ini below lines should be mentioned.

display_errors=Off

7. Another important configuration in PHP is determining HTTP Post size. Bigger requests requires more time for server to process. Attacker can take advantage and send bigger requests to keep system resources busy. It can be mentioned in PHP configuration. To do that in php.ini below lines should be mentioned.

post_max_size=1K

Instead of "1K" server administrator can write the desired size.

8. There are many files related activities takes place in server like reading/writing a file etc. But if reading/writing in any file is permitted then it will be a security threat. Because all files in a server is not for the website. There are OS files, Nginx/Httpd, MYSQL etc. So a specific directory for websites should be selected where no other files will be kept. The configuration is given below.

9. Most of us are aware about PHP Session. Session saves some temporary information of user into server. PHP keeps this session data in file. The location where PHP will keep this session can be mentioned in PHP configuration. Keeping these session files in a public location can pose security threat. It can be mentioned in PHP configuration. To do that in php.ini below lines should be mentioned.

10. It is important to define the Directory Permission of Document Root in PHP configuration. Most of the case the user running PHP is apache or www-data. So the Owner and Group of the document root should be those users.

11. OS like Linux has its own security features Like SELinux. It provides safety against faulty configuration and malicious software.

12. OS like Linux has its own Firewall which can monitor server traffic.

13. Another way of ensuring security is SSL certificate. It creates a Secure Channel between user and server. It stops Man in the Middle Attack.

14. Always keep OS and other software updated.