View
239
Download
0
Category
Preview:
Citation preview
Creating Databases
CSS example. One-way encryption. Passwords.Security issues. Work session.
.Homework: Making unique posting on encryption,
passwords, security, Clinton email. Keep working on projects.
Stories problem
• A pesky user (namely me) uploaded a story referencing a big image.
• Challenge: without asking anything more from the user and also acting retroactively, create CSS to limit size of image.
@charset "utf-8";
/* CSS Document */
<style>
header {display:block; font-family: Garamond, serif;
font-size: 30px; font-style:bold;
}
article {display:block; width: 80%;
padding: 3px;
font-family: Garamond, serif;
font-size: 16px;
border: 1px solid black;
border-radius: 10px;
}
article > img {border-radius: 15px; height: 40%; width: auto;
border-style: solid; border-color: blue;
}</style>
News stories?
• Big Data
• Behavioral marketing
• Privacy
• Net Neutrality
• ???
Passwords
• How can your security with respect to passwords be compromised?
Password advice
• Do what they force us (the faculty) to do at Purchase– change passwords often
• Don't put on paper that you leave around.
• Use different passwords.
• Monitor your bank, credit card, etc.
• ???
Password protection
• Over-the-shoulder: – use password type for input fields.– Use post and not get
• [use https connection. Needs cooperation of server.]
• Use one-way hash algorithm
• ???
Secure Hash Algorithm-256
• Takes input and produces a digest (256 bits long)
• One-way: very difficult to decrypt it.• Can be done on the server or on the client.
– I will demonstrate on the client.
• Test is done digest vs digest.• Protects against some inside jobs:
someone may know the digest, but won't know the plain text to produce the digest.
Start of password system
• http://socialsoftware.purchase.edu/jeanine.meyer/research/register.html – probably never have this as part of a
production application.
outline of register.html
<!DOCTYPE html> <html> <head><meta http-equiv="Content-Type"
content="text/html; charset=utf-8" /><title>Register</title><script type="text/javascript" src="sha256.js"></script><script type="text/javascript">function encode() { …. }</script> </head><body> <form … > .. </form> </body> </html>
register.html<form name="f" action="completereg.php"
onSubmit="return encode();" method="post"><table><tr><td>User name </td><td><input type="text" name="un"
required /></td></tr><tr><td>Password </td><td><input type="password"
name="pw" required /></td></tr><tr><td>Confirm password </td><td><input
type="password" name="cpw" required/></td></tr> </table>
<input type="submit" value="Register"/></form>
function encode() {var pw1 = document.f.pw.value;
if ((document.f.un.value.length<1) ||(pw1.length<1)) {alert("Need to enter User Name and Password. Please try
again.");return false;
}else if (pw1 == document.f.cpw.value) { document.f.pw.value = SHA256(pw1); document.f.cpw.value = ""; alert("document.f.pw.value now is "+document.f.pw.value); return true;
}else {
alert("passwords do not match. Please try again.");return false;
}}
Note• After submitting the form, the encode function does
[some] client side validation.• It returns true if appropriate to continue to the action
script• It returns false if appropriate to return the form for the
user to try again.• Notice that the second password field is cleared if the
two are the same• Notice that the first password field is altered:
document.f.pw.value = SHA256(pw1);• So…only the encrypted (aka digest) is sent to server.
completereg.php<html> <head> <title>Add song to database</title></head> <body><?phprequire("opendbo.php");$tname = "finders";$finder = addslashes($_POST["un"]);$epw = $_POST["pw"];$query = "INSERT INTO $tname values ('0','$finder','$epw')";$result = mysqli_query($link,$query);if ($result) {
print("The finder was successfully added.<br>\n");}else { print ("The finder was NOT successfully added. <br>\n");}?></body> </html>
Remember
• computer systems are made up of– hardware– software– [networks]– people– procedures
Registration system
• Assign people passwords– Admin. does the registration just shown
• Provide way for users to change passwords
• Tradeoff:– randomly generated versus– one the player can remember
Change password scripts
• changepassword.html– show out of order, body first
• completechangepassword.php
<form name="f" action="completechangepw.php" onSubmit="return encode();" method="post">
<table><tr><td>User name </td><td><input type="email" name="un"
required /></td></tr><tr><td>Current password </td><td><input type="password"
name="oldpw" required /> </td></tr><tr><td>Password </td><td><input type="password"
name="newpw" required /></td></tr><tr><td>Confirm password </td><td><input type="password"
name="cpw" required/></td></tr> </table><input type="submit" value="Change pw"/></form><canvas id="canvas" width="600" height="600">Your browser does not recognize canvas </canvas>
start of changepassword.html
<!DOCTYPE html> <html><head><meta http-equiv="Content-Type" content="text/html;
charset=utf-8" /><title>Change password</title>
<script type="text/javascript" src="sha256.js"></script><script type="text/javascript"
src="drawroundedarrowbox.js"></script>
<script type="text/javascript">
function encode() {var ctx= document.getElementById("canvas").getContext("2d");ctx.clearRect(0,0,600,600);var pw1 = document.f.oldpw.value;var npw = document.f.newpw.value;
if ((document.f.un.value.length<1) ||(pw1.length<1)) {alert("Need to enter User Name and Password. Please try
again.");return false; }
else if (npw == document.f.cpw.value) { document.f.oldpw.value = SHA256(pw1); document.f.newpw.value = SHA256(npw); document.f.cpw.value = document.f.newpw.value; return true; }else { drawroundedarrowbox(ctx,10,30,40,300,80,"Passwords do not match.",30,"black","pink");
return false; } }</script>
Note
• Allows new email to be the same as current email.
• Many places do NOT allow this and some even go back in time.
completechangepw.php <html> <head><title>Complete change finder password</title> </head><body>
<?phprequire("opendbo.php");$tname = "finders";$finder = $_POST["un"];$epw1 = $_POST["oldpw"];$epw2 = $_POST["newpw"];$query = "UPDATE $tname SET epw = '$epw2' WHERE
username = '$finder' AND epw = '$epw1'";$result = mysqli_query($link, $query);if ($result) {
print("The password was changed.<br>\n"); }else { print ("The password was NOT successfully
changed. <br>\n"); }?></body> </html>
addsite scripts
• http://socialsoftware.purchase.edu/jeanine.meyer/research/addsite.html
• addsite.html– show body first
• addsite.php– tries to make addition and– presents new form for adding another site or
going to one of the display scripts• goes into and out of php
<body onLoad="retrieveinfo();"><div id="greeting"></div><form name="f" action="addsite.php" onSubmit="return encode();"
method="post">Site: <input name="stitle" placeholder="Your name for site"
required/><br/>Date: <input name="sdate" type="date" placeholder="YYYY-MM-DD"
required/> <br/>Site description: <br/><textarea name="sdesc" cols="30" rows="2"></textarea> <br/>URL: <input name="surl" type="url" placeholder="http:// "
required/><br/>Category: <input name="scat" type="text" required/><hr/>Username: <input name="un" type="email" required / > <br/>Password: <input name="pw" type="password" required /> <br/> Save on this computer next time you invoke addsite? <input
name="saveok" value="No" /><input type="submit" value="Submit Site"/></form> </body>
addsite.html• retrieves information from local Storage• does the encoding: client side then server side
handling• Start of the file:
<!DOCTYPE html>
<html>
<head>
<title>Add website info, login</title>
<script type="text/javascript" src="sha256.js">
</script>
<script type="text/javascript">
retrieveinfo functionfunction retrieveinfo() {
var savedun;var savedpw;try {
savedun = localStorage.getItem("researchun"); savedpw = localStorage.getItem("researchpw");
if (savedun) {document.f.un.value = savedun;document.f.pw.value = savedpw;
document.getElementById("greeting").innerHTML="Welcome Back.";
document.f.saveok.value = "Yes"; } }
catch(e) {} }
encode functionfunction encode() {
var pw1 = document.f.pw.value;if (document.f.saveok.value!="No") {try { localStorage.setItem("researchun",document.f.un.value);
localStorage.setItem("researchpw",pw1); }catch(e) { alert("error on local storage "+e); } }else { //no saving, remove anything savedtry { localStorage.removeItem("researchun");
localStorage.removeItem("researchpw"); }catch(e) { //alert("error on local storage "+e); } }
if ((document.f.un.value.length<1) ||(pw1.length<1)) {alert("Need to enter User Name and Password. Please try
again.");return false; }
else { document.f.pw.value = SHA256(pw1); return true; } }
start of addsite.php<html> <head> <title>Complete adding site to research table</title>
</head><body><?phprequire("opendbo.php");$tname = "sitesfinders";$stitle=addslashes($_POST["stitle"]);
$sdate=$_POST["sdate"];$sdesc=addslashes($_POST["sdesc"]);$surl=$_POST["surl"];$scat = addslashes($_POST["scat"]);$un =$_POST['un'];$epw = $_POST['pw'];
$query = "SELECT * FROM finders WHERE username='$un' AND epw='$epw'";
$result = mysqli_query($link, $query);if ($row=mysqli_fetch_array($result)) {
$fid = $row['finderid'];
$query = "INSERT INTO $tname values ('0','$stitle','$sdate','$surl','$sdesc','$scat','$fid')";
$result = mysqli_query($link, $query); if ($result) {
print("The site was successfully added.<br>\n");?>
Add [another] web site? <br/><form name="f" action="addsite.php"
method="post">Site: <input name="stitle" placeholder="Your name
for site"/><br/>Date: <input name="sdate" type="date"
placeholder="YYYY-MM-DD" /> <br/>Site description: <br/><textarea name="sdesc" cols="30" rows="2"></textarea> <br/>URL: <input name="surl" type="url"
placeholder="http:// "/><br/>Category: <input name="scat" type="text"/><hr/>
<?php
print ("Username: <input name='un' type='email' value='");
print ($un."' />");
print ("Password: <input name='pw' type='password' value='$epw' />");
?>
<input type="submit" value="Submit Site"/></form><a href="showsites.php">Show all websites </a> or <a
href="showsitesbycategory1.php">Show sites for a category </a>
<?php }
else {print ("The site was NOT successfully added. <br>\n");
} }else {
print ("Problem with username and/or password and/or data.");
}?></body> </html>
Where should (persistent) data go?
• localStorage (cookie) on client computer
• Database (s)
• Flat file on server– File with its own encoding
• XML file on server
• Decisions based on more than technical factors….
Fields of table
• Set up using php (or phpMyAdmin) in a certain order, set names, data types
• Two variations for INSERT– “INSERT INTO questions VALUES
(‘0’,’$qtext’,’$atext’,$val)”• Must use order used in creation step
– “INSERT into questions (text,value,answer) VALUES (‘$qtext’, $val,’$atext’)”
Number of records
• After any SELECT, can query the number of records.
$query = "SELECT * FROM tablename"; $result = mysqli_query($link,$query); $num_rows = mysqli_num_rows($result); echo $num_rows;
Homework
• Make unique posting on security, password, encryption, OR current kerfuffle involving Hillary Clinton’s use of private (vs .gov) email.– READ the reference and comment on it!!!
• Work on enhancement projects.
Recommended