Working with Apache Web Server

In this article, I will examine what apache is how to setup apache for ubuntu or debian and how to view error logs for apache and how to understand what the logs contain which will be useful for web development. What is Apache? Apache is the most popular web server on the internet. It is used to serve more than half of all active websites. It is fast, reliable, and secure. It can be highly customized to meet the needs of many different environments by using extensions and modules. Installing Apache on Ubuntu and Debian If you do not already have Apache installed, you can do so now by issuing the following commands: sudo apt-get update sudo apt-get install apache2 If you visit your VPS's IP address in a web browser, you will get the default Apache index page. We get the following output. your_domain_name_or_ip_address It works! This is the default web page for this server. The web server software is running but no content has been added, yet. Looking into apache error.log files In order to effectively manage a web server, it is necessary to get feedback about the activity and performance of the server as well as any problems that may be occuring. The Apache HTTP Server provides very comprehensive and flexible logging capabilities. Error.log file The server error log, whose name and location is set by the ErrorLog directive, is the most important log file. This is the place where Apache httpd will send diagnostic information and record any errors that it encounters in processing requests. It is the first place to look when a problem occurs with starting the server or with the operation of the server, since it will often contain details of what went wrong and how to fix it. Explanation of log message There is certain information that is contained in most error log entries. For example, here is a typical message. [Sat Aug 20 08:09:38.958885 2016] [:error] [pid 1489] [client 127.0.0.1:40810] PHP Notice: Constant MIN_PASSWORD_LENGTH already defined in /var/www/html/test/engelsystem/config/config.php on line 30, referer: http://localhost/ [Sat Aug 20 08:09:38.958885 2016] The first item in the log entry is the date and time of the message. [:error] The second entry lists the severity of the error being reported. [pid 1489] Indicates process Id [client 127.0.0.1:40810] The fourth entry gives the IP address of the client that generated the error. Fifth one is error message explaining the error. Constant MIN_PASSWORD_LENGTH already defined. File and line number /var/www/html/test/engelsystem/config/config.php on line 30 Error logs are easy to understand. Using error logs we can easily figure out the problem in your server or your code and fix it. For more information about the log files and configuration please visit Apache website Apache provides excellent documentation. Apache log files were useful for me during web development project Engelsystem. We are developing new features. Interested developers can work with us. Development: https://github.com/fossasia/engelsystem Issues/Bugs:https://github.com/fossasia/engelsystem/issues

Continue ReadingWorking with Apache Web Server

Configuring Document Root Apache2 Ubuntu

In this post I will explain how to setup document root for apache server. Initially the document root is set to /var/www/html by default. We need to change it when we have web applications in /var/www/html/folder. I will show an example how to configure document root for our project engelsystem. Engelsystem is downloaded to /var/www/html/ . We must make sure to point our apache2 document root to the Engelsystem directory to prevent any user from accessing anything other than the public/ directory for security reasons. Changing apache2 document root The default document root is set in the 000-default.conf file that is under /etc/apache2/sites-available folder. $ cd /etc/apache2/sites-available $ sudo nano 000-default.conf While the file is opened change DocumentRoot /var/www/ with your new folder e.g DocumentRoot /var/www/html/engelsystem/public where your index.php file resides Set the right Apache configuration The configuration of the /var/www folder is under /etc/apache2/apache2.conf. Edit this file to add the configuration of your new document root. $ sudo nano/etc/apache2/apache2.conf Copy the following: <Directory /var/www/> Options Indexes FollowSymLinks AllowOverride None Require all granted </Directory> and change the directory path: <Directory /var/www/html/engelsystem/public> Options Indexes FollowSymLinks AllowOverride None Require all granted </Directory> Restart Apache Now we can view the engelsystem at localhost/ or http://[i.p.address]/ $ sudoservice apache2 restart

Continue ReadingConfiguring Document Root Apache2 Ubuntu

Allowing web-user on apache server to run scripts as root

Allowing web-user on apache server to run scripts as root If you are new to this, you might be wondering, what the hell is a web user anyways? So let’s say that you need a server which hosts a simple web page and does a particular task based on data entered into that web-page. The normal way of doing this is to navigate to /var/www/html and place the web page you want to host here. You also need to put your php script in this folder so that it is accessible from the website. This php script will take in the data from your web-page and run the necessary commands that you need to be executed on the server.( I am assuming you are not using “The Real Dev Language” for now. :p ) I will be using a simple web page and script that I have made for this post. <html> <head> <title>Apk Generator</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> <link href='https://fonts.googleapis.com/css?family=Roboto:400,100' rel='stylesheet' type='text/css'> <link href="css/main.css" rel="stylesheet"> </head> <body> <div class="container"><br><br> <form name="htmlform" id="form" enctype="multipart/form-data" class="col-md-offset-4 col-xs-offset-2 col-xs-8 col-md-4 form-group generator_form" > <label for="name">Email</label> <input type="email" class="form-control" id="Email" name="Email"> <br> <input type="hidden" id="theme" name="theme" value="light"> <label for="name">App's Name</label> <input type="text" class="form-control" id="App_Name" name="App_Name"> <br> <label> Choose your data source </label> <ul style="list-style-type:none"> <li><input type="radio" name="datasource" value="jsonupload"> Upload your own JSON files </input></li> <li><input type="radio" name="datasource" value="eventapi"> API endpoint of event on OpenEvent </input></li> </ul> <br> <section id="eventapi-input" style="display:none;"> <label for="apiendpoint">Link to Open Event API endpoint</label> <input type="url" class="form-control" id="Api_Link" name="Api_Link"> </section> <br> <section id="jsonupload-input" style="display:none;"> <input type="file" name="uploadZip" id="uploadZip" class="form-control"/> <br> </section> <br> <input type="hidden" name="assetmode" value="download"> <center> <br> <div id="status"></div> <br> <tr> <td colspan="5" style="text-align:center"> <button type="submit">Generate and Download app</button> </td> </tr> </table> </form> <script src="https://www.gstatic.com/firebasejs/live/3.0/firebase.js"></script> <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script> <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> <script> $('input:radio[name="datasource"]').change( function() { if ($(this).is(':checked')) { if ($(this).val() === 'mockjson') { $('#jsonupload-input').hide(100); $('#eventapi-input').hide(100); } if ($(this).val() === 'jsonupload') { $('#jsonupload-input').show(100); $('#eventapi-input').hide(100); } if ($(this).val() === 'eventapi') { $('#eventapi-input').show(100); $('#jsonupload-input').hide(100); } } }); var $ = jQuery; var timestamp = Number(new Date()); var form = document.querySelector("form"); form.addEventListener("submit", function(event) { event.preventDefault(); var ary = $(form).serializeArray(); var obj = {}; for (var a = 0; a < ary.length; a++) obj[ary[a].name] = ary[a].value; console.log("JSON",obj); if(obj.Email == "" || obj.App_Name ==""){ alert("It seems like you forgot to fill up your email address or the app's name"); setTimeout("location.reload(true);", 1); } else{ alert("Please wait while we generate the app, meanwhile you can stick around to directly download it.The app will also be emailed to you."); $.ajax({ type: "POST", url: "/test.php", data: { timestamp : timestamp }, success: function(response){ console.log("Success",response); window.location = response; } }); } }); </script> </div> </body> </html> This is basically a web page with some inputText widgets which accept response and send it to a php file named test.php on the server via an AJAX post. <?php if(isset($_POST['timestamp'])) { $uid = escapeshellcmd($_POST['timestamp']); exec("sudo sh /var/www/email.sh $uid"); } ?> This php script will call a bash script which in turns an email to me with…

Continue ReadingAllowing web-user on apache server to run scripts as root

Getting fired up with Firebase Database

As you might've noticed, in my Open Event Android Project, we are asking the user to enter his/her details and then using these details at the backend for generating the app according to his/her needs. One thing to wonder is how did we transmit the details from webpage to the server. Well, this is where Firebase comes to the rescue one more time! If you’ve read my previous post on Firebase Storage, you might have started to appreciate what an awesometastic service Firebase is. So without any further adieu, lets get started with this. Step 1 : Add your project to Firebase from the console.   Click on the Blue button Step 2 : Add Firebase to your webapp Open the project, you’ve just created and click on the bright red button that says, “ Add Firebase to your web app”   Copy the contents from here and paste it after your HTML code. Step 3 : Next up, navigate to the Database section in your console and move to the Rules tab.   For now, let us edit the rules to allow anyone to read and write to the database.   Almost all set up now. Step 4 : Modify the HTML to allow entering data by the user This looks something like this : Now let us setup our javascript to extract this data and store this in Firebase Database. We are almost finished with uploading the data to the database. Enter data inside the fields and press submit. If everything went well, you will be able to see the newly entered data inside your database. Now on to retrieving this data on the server. Our backend runs on a python script, so we have a library known as python-firebase which helps us easily fetch the data stored in the Firebase database. The code for it goes like this The data will be returned in JSON format, so you can manipulate and store it as you wish. Well, that’s it! You now know how to store and retrieve data to and from Firebase. It makes the work a lot simpler as there is no Database schema or tables that need to be defined, firebase handles this on its own. I hope that you found this tutorial helpful, and if you have any doubts regarding this feel free to comment down below, I would love to help you out. Cheers.

Continue ReadingGetting fired up with Firebase Database

Deploy Engelsystem on Your Local Server

Today, I decided to set up Engelsystem on a clean local server as a task for Google Summer of Code. My first impression when looking at the PHP application was that it is a well-built MVC app. It seems to have everything an event manager could want. When I looked at the README, all the instructions were in German, but I decided to follow the gist of it anyways. I will be telling you how to setup the application step by step in English on Ubuntu 15.10  x64. Instructions for Setup Step 1: Setup LAMP and install GIT The first you want to do is to setup LAMP stack (linux, apache, mysql, and php). Please follow the tutorial here on how to set up LAMP on Ubuntu 15.10 x64. If you are running this app on a different operating system, a quick Google search will provide you with installation steps. Afterwards, you may install git by these commands: apt-get update apt-get install git -y Step 2: Clone the Repository and Setup Database First, clone the repository (the recursive parameter allows us to clone the submodules): git clone --recursive https://github.com/engelsystem/engelsystem.git Note the absolute path of the Engelsystem directory. For example, mine is /root. Next, configure your MySQL Engelsystem database: mysql -u root -p [Enter your password] CREATE DATABASE engelsystem; use engelsystem; source [path to engelsystem]/engelsystem/db/install.sql; source [path to engelsystem]/engelsystem/db/update.sql; exit; Go to engelsystem/config and copy the default config into config.php. Modify the new file to match your MySQL credentials so that the system could access the database on the localserver. Step 3: Test That App is Working Move the app to your /var/www/html/ directory by typing mv ./engelsystem /var/www/html (alternatively create a symlink to your current directory). Go to your browser and type in [serverhost]/engelsystem/public to see the application in action. To login, type use the following credentials: Username: admin Password: asdfasdf Be sure to change your password for security reasons. You can generate a strong password here. Step 4: Modify Apache to Use Server for Production We must make sure to point our apache2 document root to the Engelsystem directory to prevent any user from accessing anything other than the public/ directory for security reasons. Do this by modifying the apache2 configuration file (assuming you are running this on a server hosting no other sites): apt-get install nano -y nano /etc/apache2/sites-available/000-default.conf Change DocumentRoot /var/www/html into DocumentRoot /var/www/html/engelsystem/public. Restart apache by typing service apache2 restart. See the result of your page by going to your host in your browser. If you made it this far without any issues, congratulations! You have successfully set up Engelsystem on your localserver and can use it to manage your event.

Continue ReadingDeploy Engelsystem on Your Local Server