Computer Science 486 Mobile and Internet Game Development

Study Guide :: Unit 6

Data Storage and Exchange Behind the Game

Overview

Unit 6 focuses on all the technologies and skills that a game needs for storing and retrieving game-play data and parameter settings to and from mySQL database through the help of backbone services implemented in PHP. This unit also teaches the use of Ajax and JSON for doing data exchanges between the game and its backbone services.

Learning Objectives

After completing this unit, you will be able to:

• Create a database and correspondent tables to store game-play data and gaming parameters.
• Develop backbone service in PHP to access database for the game.
• Use Ajax and JSON to exchange game-play and setting data with the backbone service.
• Use RSA to encrypt and decrypt the data exchanging between the game and its backbone services.
• Design avatar-creation and property pages that allow players to choose, change, and review basic attributes of their avatars in the game.
• Create a customer service form for players to contact the game developer.

Learning Activities

• First, read Unit 6 notes.
• Second, read the unit exercise below in this unit:
  • Choose any one exercise and try to complete it.
  • Use the course discussion board to post your experience and solution to any one of the exercises.
  • Comment and make suggestions on another student’s posting.
  • Answer any questions posed to you.

Lesson Notes

1. Read one of the following tutorials to install a server set on your computer according to your platform (i.e., Windows, Mac, or Linux) so you can develop the browser game and its backbone services in PHP later:

   1. How to Install and Configure XAMPP on Windows 10 (https://pureinfotech.com/install-xampp-windows-10/)
   2. How to Install WAMP Server on Windows 10 (https://www.shaileshjha.com/how-to-install-wamp-server-on-windows-10/)
   3. Running a Local Server with MAMP (for Mac) (https://mac.appstorm.net/reviews/internet-reviews/running-a-local-server-with-mamp/)
   4. How To Install Linux, Apache, MySQL, and PHP (LAMP) (for Linux) (https://www.digitalocean.com/community/tutorials/how-to-install-linux-apache-mysql-php-lamp-stack-on-ubuntu-16-04)

   For this course, you only need Apache, MySQL, PHP, and phpMyAdmin. You don’t have to choose FTP server if the chosen server set is installed locally in your computer and you can simply save and open any HTML5 or PHP page to the website root folder.

   Please always remember which folder you set up as the root folder of the website in your local computer so you can simply save and open any HTML5 or PHP page for your website later.

   Note that the default website port 80 might be occupied by your application or service on Windows. For instance, Skype might use ports 80 and 443 as an alternative communication channel and you may want to prevent it from using port 80. You can watch the following YouTube video (starting from 0:20) to configure your Skype accordingly. https://www.youtube.com/watch?v=fd5yc3YpAW4

   Some people may experience missing DLL errors in Windows 10. If you experience this, please read the article “How to Fix MSVCR110.dll, MSVCR100.dll, MSVCP110.dll and MSVCP100.dll error in windows 10” at https://www.shaileshjha.com/how-to-fix-msvcr110-dll-msvcr100-dll-msvcp110-dll-and-msvcp100-dll-error-in-windows-10/

2. Try to create your first Hello World PHP page, with Notepad++, based on the following example:

   https://www.w3schools.com/php/php_syntax.asp

   Save the PHP page to your local website root folder. You may then type https://localhost/index.php in your browser to see if it works. (Note: I saved the PHP page as "index.php." You can save it as any file name you want but you need to type its correct name in the address bar of your browser.)

3. Using PHP webpage as backbone service of a game doesn’t require you to learn everything about PHP. You only need to read the PHP tutorial at https://www.w3schools.com/php/ for only the following sections: Variables, Echo Statement, Basic Sata Types, Operators, If-Else, For Loops and While Loops.
4. Before we can learn how to store and access game relevant data with PHP, we need to learn how to create a simple database on mySQL. Watch Create a Database and Table in phpMyAdmin. (https://www.youtube.com/watch?v=n7c5zMk8cx4) to learn how to create a database and tables in mySQL on browser.

5. Read the following two articles to learn how to export and import a database and its tables and data from and to mySQL.

   1. How to Export a Database Using phpMyAdmin (https://www.inmotionhosting.com/support/server/databases/export-database-using-phpmyadmin/)
   2. Import a MySQL Database using phpMyAdmin (https://www.inmotionhosting.com/support/server/databases/import-database-using-phpmyadmin/)

   From time to time, you may want to export and import the game database in your local server to a remote testing or production server that others (i.e., your team members or players) can access. You will need to export your local database to an .sql file and import the .sql to the database on the remote testing or production server.

6. Now we can have PHP pages to access MySQL database and see if we can output the retrieved data on the browser. Watch Connect to a MySQL (https://www.youtube.com/watch?v=5sQ4scQz0qY) and read the following “Access MySQL database” articles to learn how to

   1. Insert Data into Database (https://www.w3schools.com/php/php_mysql_insert.asp)
   2. Retrieve Data from Database (https://www.w3schools.com/php/php_mysql_select.asp)
   3. Delete Data from Database (https://www.w3schools.com/php/php_mysql_delete.asp)
   4. Update Data in the Database (https://www.w3schools.com/php/php_mysql_update.asp)
7. When a game communicates with its backbone service for any purpose, it has to be done behind the scene without making its players notice. Ajax is a concept we need to adopt. Read “What is Ajax and Where is it Used in Technology?” (https://www.seguetech.com/ajax-technology/) to understand what Ajax is.

8. Read the following articles to use simply JavaScript and XMLHttpRequest object to send a request and get a response to and from a server-side service in PHP.

   1. Send a Request to a Server (https://www.w3schools.com/xml/ajax_xmlhttprequest_send.asp)
   2. Get a Response from the Server (https://www.w3schools.com/xml/ajax_xmlhttprequest_response.asp)
9. The game itself can use JavaScript and XMLHttpRequest to access the services that the backbone PHP pages provide. Read the “AJAX PHP Example” (https://www.w3schools.com/xml/ajax_php.asp) and try to make a scenario that contains one HTML page (assuming it is your game) to access data provided by a PHP page.
10. When the game communicates with its backbone services, usually they are exchanging structural data; for instance, the game actions, responses, and the information of the subject the player is encountering, e.g., non-player controlled characters, other players, and boss and monsters. It would be better to have a human-readable and machine-interpretable way for the data exchange. JSON is what we need. Read “JSON: What It Is, How It Works, & How to Use It” (https://www.copterlabs.com/json-what-it-is-how-it-works-how-to-use-it/) to know what a JSON string looks like and how to create one.
11. Now you can read the example (https://www.w3schools.com/js/js_json_intro.asp) and try to pass a JSON string to the backbone service implemented in PHP.
12. Assuming your game receives a JSON string passed from its backbone service, you need to read the following two articles to learn how to parse the data with JavaScript so your game can further use it.
    1. https://www.w3schools.com/js/js_json_parse.asp
    2. https://www.w3schools.com/js/js_json_arrays.asp
13. When the player takes some actions and your game needs to update them into database, you may need to read https://www.w3schools.com/js/js_json_stringify.asp to learn how to convert it into a JSON string so the string can be passed back to the backbone service with Ajax.
14. Now we can once again use the scenario you created earlier, which has one HTML page (assuming it is your game), to access data provided by a PHP page, but this time we can try to pass data in JSON format. You may read https://www.w3schools.com/js/js_json_php.asp to get a better idea.
15. Since JSON is human readable, we don't want any unauthorized third party to have opportunity to see or change the data the game is exchanging with its backbone service. We prefer to encrypt the JSON data before we send it out and decrypt a received data into the JSON data first before interpreting it. You will need to have a pair of private and public RSA keys to achieve this goal. Please read “What is RSA?” (https://www.techtarget.com/searchsecurity/definition/RSA) to understand what RSA is.
16. You may create RSA keypairs on your own and test them with the following PHP code example. If you don't use Linux/Unix, you may download the “RSA keys.zip” here: https://maiga.athabascau.ca/share/RSA%20keys.zip. PHP—RSA (Public-Private Key Encryption Decryption) https://varunver.wordpress.com/2014/04/23/php-rsa-public-private-key-encryption-decryption/

Unit Exercise

1. Create a database with tables that you want to use to store the game-play data, game settings, and perhaps game world.
2. Create an avatar-creation page that allows the player to enter his or her avatar’s name, gender, icon, and perhaps eyes, hair and skin colour. Once the player clicks Create, the chosen data should be sent to a backend service in PHP and store the data into the database.
3. Following the exercise above, you may create a two-stage avatar-creation process and redirect the player to the second stage. At the second stage, the player can roll 1 to 18 for the characteristics like strength, stamina, agility, wisdom, intelligence, and charm for his or her avatar, with JavaScript’s help. Once again, when the player clicks Complete, the data will be further updated to the database.
4. In the above two exercises, try to encrypt the data with the public key before passing to the backbone service and decrypt the received data with the private key in the backbone service before storing it in the database.
5. Create an Avatar Attribute page with HTML form elements that will ask for a backbone service written in PHP to access particular avatar’s data and pass the data back to the page via Ajax and JSON. The page then can show the player his or her avatar’s properties (e.g., name, gender, icon, etc.) and stats (e.g., level, gold experiences, strength, agi, etc.) in the game.
6. Create a Contact Us function with HTML and PHP that includes a drop-down list for players to choose the game or game version that they are playing, a textbox for players to enter their account ID, a text area for them to enter the issues they encountered in the game, and a Send button for them to submit a ticket to the game’s customer service representative, i.e., your email address with subject “Customer Request.” You may refer to the video (https://www.youtube.com/watch?v=TO7MfDcM-Ho) to get some idea.
7. Enhance the above exercise with JavaScript. First, using JavaScript to check whether or not the player has entered his or her account ID as well as the message. Second, trying to use random() and fromCharCode() to automatically generate a six alphabet-numerical digits as ticket number in the format “AA##AA”, where A indicates a character and # means a number (e.g., XH23OF). Third, automatically change the email subject to “Customer angela323’s Request (ticket number: XH23OF)” if the player’s account ID is angela323 and the ticket number generated is XH23OF.