loutus-appli’s diary

IT企業を目指す、ド素人40代!!

ド素人が作りました。  SNS(ソーシャルネットワーク)編 No4

Facebookツイッターなどの SNSアカウント

を使ってログイン出来るようにしたい!

しかしプラグインを探してみたんですが、

word Press用しか見つかりませんので、

メールアドレスで新規登録してIDとパスワード

を発行しようとおもいます。

 

 

 

メールアドレス入力FOAMのサンプルプログラムです!!

このメールアドレスに仮ユーザーIDを発行します。

email_form.php


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=SJIS" />
<title>ログイン</title>
</head>
<body>

 

<form action="/index.php" method="post" enctype="multipart/form-data"><input type="hidden" name="mode" value="email_regist" />
<table><caption>新規会員登録</caption>
<tr>
<td class="item">E-mail:</td>
<td><input type="text" name="email" size="30" /></td>
</tr>
</table>
<div><input type="submit" name="submit" value="登録" /></div>
</form>


<form action="/index.php" method="post" enctype="multipart/form-data"><input type="hidden" name="mode" value="login" />
<table><caption>ログインページ</caption>
<tr>
<td><div><input type="submit" name="submit" value="ログイン" /></div></td>
</tr>
</table>

</form>

 

</body>
</html>

email_regist.php

<?php <?php // フォームからメールアドレスを取得$email = $_POST["email"];
// エラーメッセージ配列$error = array();
// データベースに接続 require_once("db.php");
// メールアドレス入力チェック if($email == "") { //未入力の場合、エラーを返す  //エラー配列に値を代入
  array_push($error, "メールアドレスを入力してください。");    //  エラー配列に値を代入} else {  $pre_user_id = uniqid(rand(100,999)); //$pre_user_id = sha1( uniqid( mt_rand() , true ) );
$onoff = "off" ;
 //SQL文を発行 $query = "insert into member (pre_userid,mailadr,onoff) values ('$pre_user_id','$email','$onoff')"; $result = mysql_query($query);
 // データベース登録チェック  if($result == false) {   array_push($error, "データベースに登録できませんでした。"); //エラー配列に値を代入 } else {
   // 取得したメールアドレス宛にメールを送信    mb_language("japanese");   mb_internal_encoding("SJIS");
   $to = $email;   $subject = "会員登録URL送信メール";   $message = "以下のURLより会員登録してください。\n".   "http://hogehoge/index.php?pre_userid=$pre_user_id";   $header = "From:hogehoge@hatena";
   if(!mb_send_mail($to, $subject, $message, $header)) {  //メール送信に失敗したら     array_push($error,"メールが送信できませんでした。<a href='http://hogehoheappli.com/index.php?pre_userid=$pre_user_id'>遷移先</a>"); //エラー配列に値を代入     }  }}
 
//エラーがあるかないかによって表示の振り分け($error配列の確認)if(count($error) > 0) {  //エラーがあった場合  /*エラー内容表示*/  foreach($error as $value) {?><table>  <caption>メールアドレス登録エラー</caption>  <tr>    <td class="item">Error:</td>    <td><?php print $value; ?></td>  </tr></table><?php  }  //foreach文の終了} else {  //エラーがなかった場合 ?><table>  <caption>メール送信成功</caption>  <tr>    <td class="item">送信メールアドレス</td>    <td><?php print $email ?></td>  </tr></table><?php}?>

 メールで送信されたURIにアクセスしてユーザー情報を入力するFORMの

サンプルプログラムです。

regist_form.php

<?php<?php//pre_useridの値を取得if($mode == "regist_form") {  $pre_userid = $_GET['pre_userid'];}
// pre_userid 有効チェック$errorFlag = true;
// データベース接続設定 require_once("db.php");

//取得したユニークIDをキーに登録されたメールアドレスを取得 $query = "select mailadr from member where pre_userid = '$pre_userid'";$result = mysql_query($query);
//データベースより取得したメールアドレスを表示if(mysql_num_rows($result) > 0) { //取得した結果のデータの数が0以上なら → データが取得できた  //データが正常に取得できた  $errorFlag = false;  $data = mysql_fetch_array($result);   $email = $data['mailadr'];}
if($errorFlag) {  // pre_useridが無効?><table>  <caption>メールアドレス登録エラー</caption>  <tr>    <td class="item">Error:</td>    <td>このURLは利用できません。<br>もう一度メールアドレスの登録からお願いします。<br> <a href="index.php">会員登録ページ</a></td>  </tr></table><?php} else { // pre_useridが有効 // regist_confirmでのエラー表示  if(count($error) > 0) {    foreach($error as $value) {   print $value."<br>";    }  }?><form method="post" action="/keirin/index.php">  <input type="hidden" name="mode" value="regist_confirm">  <input type="hidden" name="pre_userid" value="<?php print $pre_userid; ?>">  <table>    <caption>会員情報登録フォーム</caption>    <tr>      <td class="item">ユーザーID:</td>      <td><input type="text" size="30" name="input_userid" value="<?php print $input_userid; ?>">&nbsp;&nbsp;※ 半角英文字または数字</td>    </tr>    <tr>      <td class="item">パスワード:</td>      <td><input type="text" size="30" name="input_password" value="<?php print $input_password; ?>">&nbsp;&nbsp;※ 6文字以上16文字以下</td>    </tr>    <tr>      <td class="item">名前:</td>      <td><input type="text" size="30" name="input_name" value="<?php print $input_name; ?>">&nbsp;&nbsp;※ 半角英文字または数字</td>    </tr>    <tr>      <td class="item">E-mail:</td>      <td><?php print $email; ?><input type="hidden" name="input_email" value="<?php print $email; ?>"></td>    </tr>  </table>  <div><input type="submit" value=" 送 信 "></div></form><?php}?>

 

regist_confirm.php

<?php<?php//入力フォームからパラメータを取得 $formList = array('mode','input_userid','input_password','input_name','input_email','pre_userid');
//必須項目 $requireList = array('mode','input_userid','input_password','input_name');
//ポストデータを取得しパラメータと同名の変数に格納foreach($formList as $value) {  $$value = $_POST[$value];}
// エラーメッセージの初期化 $error = array();
//必須項目入力チェックforeach($requireList as $value) {  if($$value == "") {    array_push($error,"入力されていない項目があります。");    break;  }}
// パスワードチェックif(strlen($input_password) < 6 || strlen($input_password) > 16) {  array_push($error,"パスワードは6文字以上16文字以内でお願いします。");}?><div class="error-msg"><?php// エラー 入力フォーム表示 $errorif(count($error) > 0) {  require_once("regist_form.php");?> </div><?php} else {?><form method="post" action="/keirin/index.php">  <input type="hidden" name="mode" value="user_regist">  <table>    <caption>入力情報確認ページ</caption>    <tr>      <td class="item">ユーザー名:</td>      <td><?php print $input_userid;?><input type="hidden" name="input_userid" value="<?php print $input_userid;?>"></td>    </tr>    <tr>      <td class="item">パスワード:</td>      <td><?php print $input_password;?><input type="hidden" name="input_password" value="<?php print $input_password;?>"></td>    </tr>    <tr>      <td class="item">名前:</td>      <td><?php print $input_name;?><input type="hidden" name="input_name" value="<?php print $input_name;?>"></td>    </tr>    <tr>      <td class="item">メールアドレス:</td>      <td><?php print $input_email;?><input type="hidden" name="input_email" value="<?php print $input_email;?>"></td>    </tr>    <tr>      <td class="item">PREユーザー名:</td>      <td><?php print $pre_userid;?><input type="hidden" name="pre_userid" value="<?php print $pre_userid;?>"></td>    </tr>  </table>  <div><input type="submit" value=" 登 録 "></div></form><?php}?>

 

今日はここまで。

 

↓こちら完成品ですが、ブログではまだまだ先の事。

lotus-SNS

ド素人が作りました。  SNS(ソーシャルネットワーク)編 No3

画像を編集できたら、今度は画像をサーバーに送信します。

簡単な方法はサーバーのファイルに画像をそのままUPする方法です、

ランダムにファイル名を生成して画像はサーバーのとあるFILEに格納して、

FILE名をデーターベースに格納します。

データーベースにFILE名を格納しとけば、ユーザーIDをキーにして

いつでも画像を表示できます。

ではサンプルコードをネットで物色してきました。

<?php

$textUpload = "";

if ($_FILES['userfile']):
$uploadfile = __DIR__ . '/uploads/image.jpg';
if (move_uploaded_file($_FILES['userfile']['tmp_name'],$uploadfile)) {
$textUpload = "File is uploaded";
} else {
$textUplaod = "Upload fail";
}
endif;

if (preg_match('/^text\/html/', $_SERVER['HTTP_ACCEPT'])) :
?>

<pre>
<?php echo $textUpload; ?>
</pre>


<form enctype="multipart/form-data" action="/uploader.php" method="POST">
<input name="userfile" type="file" />
<input type="submit" value="Send" />
</form>
<br />

Current Image:
<img src="/uploads/image.jpg?<?php echo time(); ?>" width="400">

<br />
<a href="/uploader.php"> REFRESH </a>

<?php else:
header( 'Content-Type: application/json; charset=utf-8', true );
echo json_encode( array("message" => "Upload is OK") );
endif; ?>

今日はここまで。

 

 

↓こちら完成品ですが、ブログではまだまだ先の事。

lotus-SNS

 

ド素人が作りました。  SNS(ソーシャルネットワーク)編 No2

画像を処理を習得するためにネットでサンプルソースコードを物色しました。

 

画像処理サンプル

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=2.0">
<title>画像処理サンプル</title>
<script src="megapix-image.js"></script>
<script src="pixastic.custom.js"></script>
<script>

function change(selector){
var file = selector.files[0];
var canvas = document.getElementById("canvas");
new MegaPixImage(file).render(canvas, { width : 320});
}

function filter(name){
var canvas = document.getElementById("canvas");
if(name == "noise") {
Pixastic.process(canvas, "noise", {mono:true,amount:1 ,strength:1});
} else {
Pixastic.process(canvas, name);
}
};

function output(){
var original = document.getElementById("canvas");
var newCanvas = document.createElement("canvas");

newCanvas.width = original.width;
newCanvas.height = original.height;
var newContext = newCanvas.getContext("2d");
newContext.drawImage(original, 0, 0, original.width, original.height);

var img = new Image();
img.src = newCanvas.toDataURL('image/jpeg');
img.onload = function(){
location.href = img.src;

};

}

function revert() {
var canvas = document.getElementById("canvas");
Pixastic.revert(canvas);
}
</script>
</head>
<body>

 

<div style="background-color:#ddddff;">
<input type="file" accept="image/*" capture="camera" id="selector" onchange="change(selector)"/>
</div>
<div>
<canvas id="canvas"/>
</div>
<div style="background-color:#ddffdd;">
<input type="button" value="セピア" onclick="filter('sepia')"/>
<input type="button" value="ノイズ" onclick="filter('noise')"/>
<input type="button" value="反転" onclick="filter('solarize')"/>
<input type="button" value="横反転" onclick="filter('fliph')"/>
</div>
<div style="background-color:#ffdddd;">
<input type="button" value="出力" onclick="output()"/>
<input type="button" value="戻す" onclick="revert()"/>
</div>
</body>
</html>

 

 

 

このあとでサーバーにUPすれば良いかな?

今日はここまで。

ド素人が作りました。  SNS(ソーシャルネットワーク)編 No1

40代のサラリーマンの私がSNSサービスを作ろうと頑張りました。

切っ掛けは映画「ソーシャルネットワークマーク・エリオット・ザッカーバーグ

です、彼の様になりたいと思い自分の手でSNSサイトを自分の手でプログラミングしてみようと思いました、

もともとプログラミングに興味がありビジュアルBASICで業務プログラムを作った事がありましたので、

少し勉強すれば直ぐに出来ると甘くみてました。

WEBサービスならPHPで作られているのがほとんどだと言う情報を掴んだので、PHPの勉強を始めました、

PHPはサーバーで動くので、まずはレンタルサーバーを借りる事にしました。

たまたまパソコンを開くと広告にレンタルサーバーのを見つけたので「さくらインターネット

そこのスタンダードプランを契約しました。

PHPの習得には「最初に読む PHP」ソシム社 と PHPポケットリファレンス、技術評論社を使いました、

本を読みながらテキストノートにコードを書きサーバーにUPしてパソコンで開いて動きを見ながら又、

テキストでコードを書きの繰り返しです、スペースが全角になっただけでエラーで動作しません!!

最初は何故エラーかも分らずにいましたが、慣れると大丈夫です。

FACEBOOKの機能を全部入ってるSNSにしたいので、画像を扱わなくてはいけないので・・・

今日はここまで。