POSTとGETの考え方について伝えている動画。 #以心伝心

2022.11.12

Logging

おはようございます、11月なのに寒くないって不思議です😗温暖化。

さて、POSTとGETの考え方について無音声(音楽あり)で伝えている動画です、以心伝心で意味が通じると良いですが、それではブログを書いている意味がないので要点だけ解説します。POSTとGETとは、インターネット上でデータの送信を行うのに使用します。POSTの利点はデータを隠して送れることと、比較的に重いデータも送れることにあります。ではGET送信の利点は、SEOに有利と言ったところでしょうか。

htmlとcssとphp-初学POSTとGETの考え方-No.2
htmlとcssとphp-初学POSTとGETの考え方-No.2

今回、POST送信とGET送信を行い、PHPのプログラムでPOSTとGETを受信する方法を動画で伝えています。次回は非同期処理を使用して送受信を行う方法をプログラムで書いていきます。

HTMLとPHPプログラムは下記のソースを参照下さいませ🙇。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>demo site</title>
    <style>
html {
    width: 100vw;
    height: 100vh;
}

body {
    background-color: rgb(0, 0, 0);
    color: aliceblue;
    background-image: url(./assets/images/aig-mid22910-120-xl_TP_V.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

div.box {
    border-color: aliceblue;
    border-style: inset;
    position: absolute;
    width: 300px;
    height: 450px;
    color: white;
    border-radius: 1em;
    padding: 1em;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    /* background-color: #ffffff80; */
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    overflow-wrap: break-word;
    text-align: center;
}

div>form>p {
    font-weight: bold;
    margin: 13px;
}

input {
    opacity: 0.5;
}

textarea {
    opacity: 0.5;
}

button {
    padding: 5px;
    border-radius: 1em;
    border-style: solid;
    border-color: aliceblue;
    background-color: aliceblue;
    color: rgb(0, 0, 0);
}
button:hover{
    border-color: rgb(255, 255, 255);
    border-style: inset;
    background-color: rgb(27, 76, 119);
    color: aliceblue;
}
.put:nth-child(2){
    overflow: auto;
    height: 120px;
}
    </style>
</head>
<body>
    <div class="box">
        <div id="box2">
            <form action="submit.php" method="post">
                <p>名前:<input type="text" name="name"></p>
                <p><textarea name="text" id="" cols="30" rows="10"></textarea></p>
                <p><button class="btn" type="submit">確認</button></p>
            </form>
        </div>
        <div id="data">
            <p class="put"></p>
            <p class="put"></p>
        </div>
    </div>
    <script src="./assets/js/main.js"></script>
</body>

</html>
<?php
var_dump(xss_d($_POST));
print(xss_d($_POST["name"])."<br>");
print(xss_d($_POST["text"])."<br>");

function xss_d(mixed $val){
    if(!isset($val))return false;

    if(is_array($val)){
        foreach ($val as $key => $value) {
            $val[$key] = strip_tags($value);
            $val[$key] = htmlspecialchars($val[$key],ENT_QUOTES);
        }
    }else{
        $val = strip_tags($val);
        $val = htmlspecialchars($val,ENT_QUOTES);
    }

    return $val;

}

タグ

11, 2, css, DOCTYPE, GET, html, lt, no, php, POST, SEO, インターネット, こと, ソース, データ, ところ, ブログ, プログラム, 下記, 不思議, 今回, 以心伝心, 使用, 処理, 初学, 利点, 動画, 参照, 受信, 同期, 意味, 方法, 有利, 次回, 温暖化, 考え方, 要点, 解説, 送信, 送受信, 音声, 音楽,

submit(サブミット):送信させない4つの方法です🙄。#javascript #サブミットキャンセル

2022.09.07

Logging

おはようございます、台風一過が去りましたね😌。

さて、今日はsubmit(サブミット):送信させない4つの方法を記載します、方法は大きく分けて2つの方法があり、それを細分化して4つの方法になります。まず、一番目は“送信する際(form側)”にてキャンセルする方法です。この場合、addEventListener(アッドイベントリスナー)でキャンセル処理する場合とonsubmitを使用してキャンセルする方法があります。

サンプルコード例1と例3にあたるコードが上記のコードになります。

次に”ボタンをクリック”した際にサブミット(送信)処理をキャンセルする方法です、この方法でも送信を阻止する事ができます。

サンプルコード例2と例4にあたります、自分としてはフォームで処理した方が良いかなと思いますが、こちらでも送信をキャンセルする事ができます。

尚、ソースコードは下記になります。また、参考にしたサイトのリンクを貼っときます。MDNのリンクです。

    <form id="frm" method="post" action="./example/">
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary">Submit1</button>
    </form>
    <form method="post" action="./example/">
        <input type="hidden" name="example" value="data">
        <button id="btn" type="submit" class="btn btn-primary">Submit2</button>
    </form>    
    <form method="post" action="./example/" onsubmit="return func1()" >
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary">Submit3</button>
    </form>
    <form method="post" action="./example/"  >
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary" onclick="return func2()" >Submit4</button>
    </form>
//例1
document.getElementById("frm").addEventListener("submit",function(event){
    event.preventDefault();
});
//例2
document.getElementById("btn").addEventListener("click",function(event){
    event.preventDefault();
    event.stopPropagation();//インターフェイスのメソッドで、キャプチャおよびバブリング段階において現在のイベントのさらなる伝播を阻止します。 
});
//例3
function func1(){
    return false;
}
//例4
function func2(){
    return false;
}

タグ

, 2, , 4, addEventListener, Form, javascript, onsubmit, submit, アッド, イベント, キャンセル, クリック, コード, こちら, サブミット, サンプル, それ, フォーム, ボタン, リスナー, , 上記, , 今日, 使用, , , 処理, 台風一過, 場合, , 方法, , 細分化, 自分, 記載, 送信, 阻止, ,

LINE messaging apiでブログの配信通知するプログラムコード。

2021.07.14

Logging

暑い日が続いています、夕立になった後のアスファルトの匂いを嗅ぐと夏だなぁって思うのは自分だけでしょうか?
さてLINE messaging apiでブログの配信通知するプログラムコードを書きましたのでお裾分けします?、コードはいつもの通りコメントなんてものはありません。この2つのコードは何をしているのかだけ、解説しますね。

1つ目のコードは私のLINEチャンネルを友だち追加してくれたら、データベースにuseridを登録するコードです。解除したらuseridの削除もちゃんとしています。

2つ目のコードは私のLINEチャンネルに登録してくれた方々に最新の記事を送信しています。自分は毎日、9時に最新の記事を送信するようにcron登録しました。

一部、defineを設定している部分がありますのでコードに追加してください、よろしくお願いします?
※LINEチャンネル登録よろしくお願いします。

<?php
    class line{
        function webhook($webhook_object=null){
            if(!$webhook_object)return false;
            $obj = json_decode($webhook_object);
            $type = $obj->events[0]->type;
            $userId = $obj->events[0]->source->userId;
            $replyToken = $obj->events[0]->replyToken;
            if($type==="follow"){
                $pdo = self::db();
                if($pdo){
                    $sql = "insert into user (userid)values(:userid)";
                    $sth = $pdo->prepare($sql);
                    $sth->bindValue(":userid",$userId,PDO::PARAM_STR);
                    $sth->execute();
                }
            }
            if($type==="unfollow"){
                $pdo = self::db();
                if($pdo){
                    $sql = "delete from user where userid = :userid";
                    $sth = $pdo->prepare($sql);
                    $sth->bindValue(":userid",$userId,PDO::PARAM_STR);
                    $sth->execute();
                }
            }
            if($type==="message"){

            }
        }

        function db(){
            try {
                $pdo = new PDO(DSN,USERNAME,PASSWORD);
                return $pdo;
            } catch (\Throwable $th) {
                //throw $th;
                return false;
            }
        }
    }


    if($data = file_get_contents('php://input')){
       print line::webhook($data);
    }
<?php
    class blog_post_msg_line{

        function db(){
            try {
                //code...
                return new PDO(DSN,USERNAME,PASSWORD);
            } catch (\Throwable $th) {
                //throw $th;
                return false;
            }
        }

        function rss(){
            $obj = simplexml_load_file("https://zip358.com/feed");
            $post_message[2] = $obj->channel->item[0]->title ."\n". $obj->channel->item[0]->link;
            $post_message[1] = $obj->channel->item[1]->title ."\n". $obj->channel->item[1]->link;
            $post_message[0] = $obj->channel->item[2]->title ."\n". $obj->channel->item[2]->link;
            return $post_message;
        }

        function main(){
            $pdo = self::db();
            if($pdo){
                $post_message = self::rss();
                $sql = "select userid from user;";
                $sth = $pdo->query($sql);
                $res = $sth->fetchAll(PDO::FETCH_ASSOC);
                if($res){
                    foreach($res as $key=>$val){
                        $user_id = $val["userid"];
                        self::line_post($user_id,$post_message);
                    }
                }
                
            }
            
        }

        function line_post($user_id ='',$post_message=null){
            $text = [
                [
                    'type' => 'text',
                    'text' =>"最新の記事をお届けします"
                ],
                [
                'type' => 'text',
                'text' =>$post_message[0]
                ],
                [
                    'type' => 'text',
                    'text' =>$post_message[1]
                ],
                [
                    'type' => 'text',
                    'text' =>$post_message[2]
                ]                                
            ];
            
            $message = [
                'to' => $user_id,
                'messages' => $text
            ];
            
            $message = json_encode($message);
            
            $ch = curl_init();
            curl_setopt($ch, CURLOPT_HTTPHEADER, array('Authorization: Bearer ' . ACCESS_TOKEN, 'Content-Type: application/json'));
            curl_setopt($ch, CURLOPT_URL, 'https://api.line.me/v2/bot/message/push');
            curl_setopt($ch, CURLOPT_CUSTOMREQUEST, 'POST');
            curl_setopt($ch, CURLOPT_POSTFIELDS, $message);
            curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
            $res = curl_exec($ch);
            curl_close($ch);      
        }
    }

    if($argv[0]){
        blog_post_msg_line::main();
    }  

タグ

, 2, , API, cron, define, line, Messaging, userid, アスファルト, いつも, お裾分け, お願い, コード, コメント, チャンネル, データベース, ブログ, プログラム, もの, 一部, , 削除, 匂い, 友だち, , 夕立, , 方々, , 最新, 毎日, 登録, , 自分, 解説, 解除, 記事, 設定, 追加, 送信, 通り, 通知, 部分, 配信,

お問い合わせフォームとメールフォームの考え方は同じ。

2021.06.07

Logging

お問い合わせフォームとメールフォームの考え方は同じです。AからBにデータを送信してそれを元に処理をしているだけです。これはフォームに限らず、プログラムはデータを元に計算などを行い結果を出力しているに過ぎないのです。コンピュータというのは高速にデータを分類したり、計算したりしているだけなのです。

プログラミングに挫折する人は、いろいろな事に疑問を持って先に進まない人が多いです。どうしてそうなるのかという所まで考えようとしていて前に進まない人が多いです。

https://www.youtube.com/watch?v=5cl3D95KrN4

逆にそうなるだという事を受け入れる人の方が覚えが早いです。最初はルールを覚えたほうが良いですね。
小学生でプログラミングを始めたい方は、人のプログラミングコードを模写して、そのコードの一部の数字などを変更してみて、こうするとこうなるのかという形で覚えていくほうが良いと感じます。参考書には難しい言葉を使って書いている事が多いので、そのような形で覚えるほうが良いでしょう。
今回のソースコードを貼っときますので、コピーするのではなく自分で書いて動かしてみてください!
※因みにphp言語が動作する環境が必要になります。
https://www.sakura.ne.jp/standard.html#plan

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="Description" content="お問い合わせ"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css">
<title>お問い合わせ</title>
<style>
	body{
		background-color: #f8f9fa;
	}
</style>
</head>
<body>
	<div class="container">
		<div class="row">
			<div class="col-12 mt-5">
				<h2>お問い合わせ</h2>
				<input class="form-control mt-1" type="text" name="name" placeholder="お名前を入力ください">
				<input class="form-control mt-1" type="text" name="email" placeholder="メールアドレスを入力ください">
				<div class="form-group mt-1">
					<label for="my-select">お問い合わせ</label>
					<select id="my-select" class="form-control" name="ptn">
						<option value="問い">お問い合わせ</option>
						<option value="意見">ご意見</option>
					</select>
				</div>
			</div>
		</div>
		<div class="form-group mt-1">
			<label for="my-textarea">内容</label>
			<textarea id="my-textarea" class="form-control" name="text" rows="3" placeholder="内容を入力ください"></textarea>
		</div>
		<button class="btn btn-primary" id="btn" type="button">送信</button>
	</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
<script>
	document.getElementById("btn").addEventListener("click",function(){
		let data = {};
		data["name"]  = document.getElementsByName("name")[0].value;
		data["email"] = document.getElementsByName("email")[0].value;
		data["ptn"]   = document.getElementsByName("ptn")[0].value;
		data["text"]  = document.getElementsByName("text")[0].value;
		$.ajax({
			type: "POST",
			dataType: "json",
			url: "./send.php",
			data: data,
			success: function (response) {
				if(response){
					console.log(response);
				}
			}
		});
	});
</script>
</body>
</html>
<?php
print json_encode($_POST);

タグ

いろいろ, お問い合わせ, コード, これ, コンピュータ, それ, データ, フォーム, プログラミング, プログラム, メール, ルール, 一部, , , , 処理, 出力, 分類, , 参考書, 変更, 小学生, , , 挫折, 数字, , 最初, 模写, 疑問, 結果, 考え方, 言葉, 計算, 送信, , 高速,

簡易的なメールフォームとメール送信のプログラムを書くのにかかる時間は?

2021.05.28

Logging

簡易的なメールフォームとメール送信のプログラムを書くのにかかる時間は?大体10分?15分ぐらいかと思います。本当はエラーチェックなどの機能をちゃんとした物に置き換える必要があるけど、ざっくり考え方はこれだけで良いじゃないかなと思っています。下記のコードを制作するのに参考にしたサイトのリンクを貼っときますね。

https://www.youtube.com/watch?v=xqg-zp2cHW8

https://techplay.jp/column/550https://techacademy.jp/magazine/19300

上記のコードを拝借してコードを書き、簡易的な二重送信防止対策と簡易的なエラーチェックをプログラミングしていますが、ここにreCAPTCHAなどの機能を入れてあげるとボット対策にもなるので良いかもしれません。ソースコードを見て後から気づいたのですが、ポストしているnameのデータを受け取っていない事があとから気づきました。因みにPOSTの生データが欲しいと言うときはこのように書くと取得することが可能ですよ。

<?php
 $data = file_get_contents('php://input');
?>
reCAPTCHA ENTERPRISE Updated Video
<?php
session_start();
$toke_byte = openssl_random_pseudo_bytes(16);
$csrf_token = bin2hex($toke_byte);
$_SESSION['csrf_token'] = $csrf_token;
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="Description" content="Enter your description here"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css">
<link rel="stylesheet" href="assets/css/style.css">
<title>sendmail</title>
</head>
<body>
	<div class="container">
		<div class="row">
			<div class="col-12">
				<form method="post" action="./sendmail.php">
					name<input class="form-control" type="text" name="name">
					email<input class="form-control" type="text" name="email">
					<div class="form-group">
						<label for="my-textarea">Text</label>
						<textarea id="my-textarea" class="form-control" name="text" rows="3"></textarea>
					</div>
					<input type="hidden" name="csrf_token" value="<?=$_SESSION['csrf_token']?>">
					<?=$_SESSION["sendmail"]!=="ok"?'<button class="btn btn-primary" type="submit">submit</button>':"NG"?>
				</form>
			</div>
		</div>
	</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
</body>
</html>
<?php
session_start();
?>
<!DOCTYPE html>
<html lang="ja">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<meta name="Description" content="Enter your description here" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css">
	<link rel="stylesheet" href="assets/css/style.css">
	<title>sendmail</title>
</head>

<body>
	<div class="container">
		<div class="row">
			<div class="col-12">
				<?= EmailSend() ?>
			</div>
		</div>
	</div>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
</body>

</html>
<?php

function EmailSend()
{

	$check = function ($val = "") {
		return isset($val) ? $val : false;
	};

	mb_language("Japanese");
	mb_internal_encoding("UTF-8");

	$to = $_POST['email'];
	$title = "test-mail";
	$message = $_POST['text'];
	$headers = "From: from@example.com";
	if (
		isset($_POST["csrf_token"])
		&& $_POST["csrf_token"] === $_SESSION['csrf_token']
	) {
		if (($check($to) && $check($title) && $check($message)) && mb_send_mail($to, $title, $message, $headers)) {
			$_SESSION["sendmail"] = "ok";
			return "メール送信成功です";
		} else {
			$_SESSION["sendmail"] = "ng";
			return "メール送信失敗です";
		}
	} else {
		return "不正なリクエストです";
	}
	return false;
}

タグ

10, 15, 2, 550, 8, cHW, column, com, https, jp, name, POST, reCAPTCHA, techplay, watch, www, xqg-zp, youtube, あと, エラー, コード, ここ, これだけ, サイト, ソース, チェック, デー, データ, フォーム, プログラミング, プログラム, ポスト, ボット, メール, リンク, 上記, 下記, , , 制作, 参考, 大体, 対策, , 必要, 拝借, 時間, 本当, 機能, , , 簡易的, 考え方, 送信, 防止,

SEOって意味があるのかわからないけれどAll in One SEOの採点は気にしてる。

2021.05.14

Logging

SEOって意味があるのかわからないけれどAll in One SEOの採点は気にしてる自分。ワードプレス(WordPress:WP)にはオールインワンSEO(エスイオー)というプラグインがあり、最新版には記事単位でSEO採点をしてくれる機能が無料でついている。このWPプラグインのコード(中身の処理)がどうなっているかは知らないけれど、恐らく記事のデータはWPプラグインの提供元(All in One SEO)へデータを送信していることは間違いないのではないかと思っています。このSEO採点基準は投稿フォームの下の方にヒントとして記載されているので、その基準に記事を書けばスコアは最低でも70点以上の採点になるはずです。

【2021年度版】All in One SEO(WordPressプラグイン)の設定方法

因みにこの頃、書いている自分の記事は大体、80点以上の採点になることが多くなってきている。この機能が導入されてから記事を見返したり、SEOの得点を気にするようになった。それでも前から言っているように最終的に記事を読むのは人なので人が読んで評価が良いものを投稿する事こそが最強のSEOだと思っています。

しかし記事が検索サイトに表示されないと人目につかないので、SEOはある程度意識しないといけないなというのが今の自分の考えだったりします。昔に比べて検索の上位を狙うのが難しくなっていることは確かな事で数撃ちゃ当たる戦法はもう難しくなってきています。YOUTUBEは今の所、それが通用するみたいです。

なぜ、数撃ちゃ当たるの戦法が難しくなってきているかといえば、SEOを熟した企業が記事を量産しているから、個人で記事を書いている人が太刀打ちが難しくなってきているのが現状です。

https://twitter.com/zip358com/status/1389684900937097217

ならば、プログラムで記事を量産させようと思い立ち、先日、記事を自動生成するサービスをいろいろ調べていた。調べると量産させるサービスがあった。そのサービスは「Articoolo(日本語はベータ版:2021年)」というサービスで人工知能の機能を使用し記事が作成されるものだった。試してみた結果、日本語が整っていなく未完成な記事が生成された、今のところは使用できるレベルではない(2021/05)。

【取材】超巨大言語モデルの開発を発表したLINEさんにその裏側を聞いてみた!

まだ、先の話になるのだけどこんな取り組みがある。LINEは日本語に特化した人工知能モデルを作ろうとしている。そのサービスが完成すればそれを使用して記事の自動制作を行えないかという事を自分は考えています。おそらくベータ版サービスは無料で作成できそうなので精度が良ければ使用してみたいと思っています。

今でも自然言語処理と人工知能のことを正しく理解している人であれば、記事を量産できるかもしれないが・・・。

タグ

70, 80, all, in, one, SEO, WordPress, wp, エスイ, オー, オールインワン, コード, こと, スコア, データ, パス, ヒント, フォーム, プラグイン, プレス, ワード, , 中身, 処理, 単位, 基準, 大体, 導入, 得点, 意味, 投稿, 採点, 提供, , 最低, 最新版, 機能, , 無料, 自分, 記事, 記載, 送信, ,

FF14を自動起動させてパスワード入力を

2021.03.23

Logging

Power Automate Desktop使用してFF14を自動起動させてパスワード入力する事を試みる。パスワード入力の動作を録画して再現して実行してみると動かないので自分で直しました。当初はUI Pathを活用して試してみたけど結局、うまく行かないので凄く単純な方法で動作をさせました。因みにこの方法はFF14が開いている最中に他のアプリを開いたりすると上手く動作することが出来ないので悪しからず。

上記のような設定をします。ウェイト(待ち時間)はご自身のPCによって調整が必要です。キーの送信部分は下記のように設定ください。

これで超長いパスワードを入力することもなくワンパスワードを入力すれば良いようになりました。ワンパスを設定していない方やフリープレイの方は送信するテキストを入力して保存するだけで後は、Power Automate Desktopを起動してフローを再生(実行)することで自動的にFF14が起動してパスワードを入力してくれます。

※前手順としてID保存状態にした状態で上記を実行ください!!!

https://flow.microsoft.com/ja-jp/desktop/

タグ

14, Automate, Desktop, FF, path, PC, Power, UI, アプリ, ウェイト, キー, こと, これ, ご自身, テキスト, パス, パスワ, パスワード, フリー, プレイ, フロー, ワン, 上記, 下記, , , 使用, 保存, 入力, 再現, 再生, 動作, 単純, 実行, 当初, 待ち時間, , 必要, , 方法, 最中, 活用, 自分, 自動, 設定, 調整, 起動, 送信, 部分, 録画,

マウスの動きをトラッキング(追跡)する。

2020.11.17

Logging

サイトのマウスの動きをトラッキングして行動パターンを知りたいという案件がクラウドでありました。応募はしていませんが考え方はこのような感じだと思います。ただ楽天サイトだという制約があったのでクロスサイトへ接続可能なのかはわからないけれど…ね?。

考え方のソースコードとdemoサイトのリンクを貼っときます、因みにIPを取れるJSライブラリもあるみたいなので、それを使用すると案件の内容が完結すると思います。
尚、PHPで再度、返却していますが、実際トラッキングする場合はPHP側でJSから送ったデータを保存処理を行う処理とクライアントが開いている状態のページの画面をキャプチャする機能などが必要になるかと思われます。そういう処理をPHP側で行わないといけないので、実際はJS側ではマウスのトラッキングとクライアントがブラウザで開いた画面サイズもPHP側に送信する必要はあるかなと。そういう事をPHP側に追加すれば良いのかと・・・感じました。

Demo22:: https://zip358.com/tool/demo22/

https://www.youtube.com/watch?v=UefhNlxx3xk
window.onload = function(){
	document.body.addEventListener("mousemove",(e)=>{
		var timeInMs = Date.now();
		document.querySelector("#log").innerHTML = navigator.userAgent + "<br>" + "x=" + e.offsetX  + "y=" + e.offsetY;
		var data = {timeInMs:timeInMs,userAgent:navigator.userAgent,x:e.offsetX,y:e.offsetY};
		move_xy(data).then(function(response){
			console.log(response);
		});
		
	});
};

async function move_xy(data){
	return await new Promise(function(resolve) {$.ajax({
		type: "POST",
		dataType: "json",
		url: "./move_xy.php",
		data: data,
		success: function (response) {
			if(response.res==="ok"){
				
				resolve(response);
			}
			resolve(false);
		},
		error:function(XMLHttpRequest, textStatus, errorThrown){
			resolve(false);
		}
	});});
}
<?php
$obj["timeInMs"] = $_POST["timeInMs"];
$obj["userAgent"] = $_POST["userAgent"];
$obj["x"] = $_POST["x"];
$obj["y"] = $_POST["y"];
$obj["res"] = "ok";

print json_encode($obj);

タグ

demo, IP, JS, php, あるかな, キャプチャ, クライアント, クラウド, クロス, コード, サイズ, サイト, ソース, それ, データ, トラッキング, パターン, ブラウザ, ページ, マウス, ライブラリ, リンク, , 使用, 保存, , 内容, 再度, 処理, 制約, 可能, 場合, 完結, 実際, 必要, 応募, 感じ, 接続, 案件, 楽天, 機能, 状態, 画面, 考え方, 行動, 返却, 追加, 追跡, 送信,

ping送信はエラー吐きまくり。

2020.11.03

Logging

FC2ブログ http://ping.fc2.com
Technorati JAPAN	http://rpc.technorati.jp/rpc/ping
NAMAAN	http://ping.namaan.net/rpc/
Blog People	http://www.blogpeople.net/servlet/weblogUpdates
BulkFeed	http://bulkfeeds.net/rpc
gooブログ	http://blog.goo.ne.jp/XMLRPC
MyBlog Japan	http://ping.myblog.jp
ココログ	http://ping.cocolog-nifty.com/xmlrpc
ブログ村 Pingサーバー広場	http://ping.blogmura.jp/rpc/
Amagle ping service	http://ping.amagle.com/
ブログスタイル	http://blogstyle.jp/xmlrpc/
JUGEM	http://jugem.jp/?mode=NEWENTRY
bolgoon	http://www.blogoon.net/ping/
人気blogランキング	http://blog.with2.net/ping.php/
ドリコム	http://ping.rss.drecom.jp
エキサイトブログ	http://ping.exblog.jp/xmlrpc
yahoo.com	http://api.my.yahoo.com/RPC2
PING.BLOGGERS.JP	http://ping.bloggers.jp/rpc/

上記のようなping一覧が在るけれど、実際機能していないものが多い。ping送信はもう時代遅れになりつつ在るのかもしれない。そんな時代遅れになりつつ存在なので、自分でping先をいちいち管理するのは、ナンセンスだと思いこの度、pingoo!(https://pingoo.jp/)というサービスのフリープランを使いだしました。因みにスパム屋さんなど、いろいろな方々が登録されているサービスなのでそれを覚悟でお試しください。

それとは別にping送信をコマンドラインから送信するPHPプログラムを作りました。自分が運用しているよさこい動画検索サイトに入れ込んでいます。ソースコードとコマンドは下記になります。

php ping.php ping
<?php

if ($argv[1]=="ping") {
	$nglist = [];
	$server = array(
		"http://ping.fc2.com",//FC2ブログ
		"http://pingoo.jp/ping/",//pingoo.jp
	);

	$site_name = "よさこい動画検索";

	$url_parameter = explode("\n", file_get_contents("../data.csv"));

	for ($i = 0; $i < count($server); $i++) {

		foreach ($url_parameter as $key => $val) {
			$parameter = explode(",", $val);
			$parameter[0] = trim($parameter[0]);
			$parameter[1] = trim($parameter[1]);
			$site_url = "https://yosakoi-video.com/?id={$parameter[0]}&q=" . urlencode($parameter[1]);
			$dev = $content = '<?xml version="1.0" encoding="UTF-8"?>
<methodCall>
<methodName>weblogUpdates.ping</methodName>
<params>
<param><value>' . $site_name . '</value></param>
<param><value>' . $site_url . '</value></param>
</params>
</methodCall>
';

			$options = array('http' => array(
				'method' => 'POST',
				'header' => 'Content-type: text/xml' . "\r\n"
					. 'Content-length: ' . strlen($content),
				'content' => $content
			));
			$context = stream_context_create($options);

			$ret = @file_get_contents($server[$i], false, $context);
			var_dump($server[$i]);
			var_dump($parameter[0]);
			//var_dump($ret);
		}
	}
}

タグ

2, Amagle, blog, BLOGGERS, bolgoon, BulkFeed, cocolog-nifty, com, fc, goo, http, https, JAPAN, jp, JUGEM, MyBlog, NAMAAN, People, ping, pingoo, service, Technorati, xmlrpc, Yahoo, いろいろ, エキサイト, エラー, ココログ, サーバー, サービス, スタイル, スパム, ドリコム, ナンセンス, プラン, フリー, ブログ, ブログ村, もの, ランキング, 一覧, 上記, 人気, , 存在, 実際, 広場, , 方々, 時代遅れ, 機能, 登録, 管理, 自分, 送信,

WEBお問い合わせフォームのお値段はいったい幾ら?

2020.01.17

Logging

WEBお問い合わせフォームのお値段はいったい幾らなのか?
堀江貴文氏はデジタルの値段は限りなくゼロに近くなると言っていたけど、無料のWEB申し込みフォームやお問い合わせフォームはある。自分もお問い合わせフォームの簡易的な物を作ってみましたのでファイルをアップしますね。

テンプレートエンジンとしてtwig3.0を使用しています、そのため動作環境はPHP7.2以上になります。ソースコードの可変は行って構いません、またこのソースコードの動作保証などは致しません。WEB担当者様が確認を行いバグ等があれば修正を行ってください。

尚、Composerでtwigをインストール済みという事が前提となります。また送信部分やエラー処理についてはご自身で機能の追加が必要となります。


サンプルページ
https://zip358.com/tool/request/

<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>お問い合わせ</title>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
        integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
        integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
        integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
        crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
        integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
        crossorigin="anonymous"></script>
    <script src="js/common.js"></script>
    <style>
        .jumbotron {
            background-color: #2bd4d0;
            color: #fff;
        }

        .btn-primary {
            color: #fff;
            background-color: #2bd4d0 !important;
            border-color: #2bd4d0 !important;
        }

        .input-group-text {
            background-color: #2bd4d0;
            border: 1px solid #2bd4d0;
        }
    </style>
</head>

<body>
    <div class="jumbotron jumbotron-fluid">
        <div class="container">
            <h1 class="display-4">お問い合わせ</h1>
            <p class="lead">必須項目を入力し送信ボタンを押してください。<br>DEMOのため送信はできません</p>
        </div>
        <div class="alert alert-warning" id="error_sendmail" role="alert">
        </div>
    </div>
    <form action="index.php" method="POST">
        <div class="container">
            <div class="row">
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text">お名前[必須]</span>
                    </div>
                    <input type="text" name="name" class="form-control" id="name" placeholder="name" value="{{name}}">
                </div>
                <div class="alert alert-warning" id="error_name" role="alert">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text">メールアドレス[必須]</span>
                    </div>
                    <input type="email" name="email" class="form-control" id="email" placeholder="name@example.com"
                        value="{{email}}">
                </div>
                <div class="alert alert-warning" id="error_email" role="alert">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text" id="basic-addon1">@</span>
                    </div>
                    <input type="text" name="twitter_account" class="form-control" placeholder="twitter account"
                        aria-label="twitter account" aria-describedby="basic-addon1" value="{{twitter_account}}">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text">お問い合わせ内容[必須]</span>
                    </div>
                    <select name="meun" class="form-control" id="exampleFormControlSelect1">
                        {% for selectop in meun_option %}
                        <option value="{{selectop.value}}" {{ selectop.value == selectoped ? " selected":"" }}>
                            {{selectop.name}}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="alert alert-warning" id="error_meun" role="alert">
                </div>
                <div class="input-group">
                    <div class="input-group-prepend">
                        <span class="input-group-text">コメント[必須]</span>
                    </div>
                    <textarea name="comment" rows="10" class="form-control" aria-label="コメント">{{comment}}</textarea>
                </div>
            </div>
            <div class="row">
                <footer class="blockquote-footer">
                    <small class="text-muted">
                        ご自由に記入ください。
                    </small>
                </footer>
            </div>
            <div class="alert alert-warning" id="error_comment" role="alert">
            </div>
            <button type="submit" class="mt-2 btn btn-primary btn-lg btn-block">送信する</button>
        </div>
    </form>
</body>

</html>
<?php
session_start();
require __DIR__ . '/vendor/autoload.php';
use Twig\Environment;
use Twig\Loader\FilesystemLoader;

$loader = new FilesystemLoader(__DIR__.'/templates');
$twig = new Environment($loader);
$meun_option = json_decode(file_get_contents("js/select.json"));

$form = ["name","email","twitter_account","meun","comment"];
$data = [];

if($_POST){
	foreach($_POST as $key=>$val){
		$_SESSION[$key] = strip_tags($val);
	}
}
if($_SESSION){
	foreach($_SESSION as $key=>$val){
		$_SESSION[$key] = strip_tags($val);
	}
}

foreach($form as $key => $val){
	$data[$val] = $_SESSION[$val]?$_SESSION[$val]:"";
}

extract($data);

print $twig->render('index.html.twig',["name"=>$name,"email"=>$email,"twitter_account"=>$twitter_account,"selectoped"=>$meun,"comment" => $comment,"meun_option"=>$meun_option]);

タグ

3.0, 358, 7.2, com, Composer, DOCTYPE, gt, html, https, lt, php, request, tool, Twig, web, www, zip, アップ, インストール, エラー, エンジン, お問い合わせ, コード, ご自身, サンプル, ゼロ, ソース, ため, デジタル, テンプレート, バグ, ファイル, フォーム, ページ, , 使用, 保証, 修正, 値段, 処理, 前提, 動作, 堀江貴文, 幾ら, 必要, 担当者, 機能, 無料, , 環境, 確認, 簡易的, 自分, 追加, 送信, 部分,

phpでイマドキDB接続の仕方なの?

2019.07.20

Logging

実行していないので上手く動いているかは
未知数ですが、コードの書き方はイマドキの書き方に
しています。PHP公式ではこう書かれています。

プリペアドステートメントのパラメータに変数をバインドすると・・・。
i 対応する変数の型は integer です。
d 対応する変数の型は double です。
s 対応する変数の型は string です。
b 対応する変数の型は blob で、複数のパケットに分割して送信されます。

<?php
$servername = "hostname";
$dbname ="dbname";
$dbusername = "root";
$dbpassword = "pass";
if($conn = mysqli_connect($servername,$dbusername,$dbpassword,$dbname)){
    $sql = "select username from mastertbl where uid =? and password = ?";
    $stmt = mysqli_stmt_init($conn);
    if(mysqli_stmt_prepare($stmt,$sql)){
        mysqli_stmt_bind_param($stmt,"ss",$uid,password_hash($password,PASSWORD_DEFAULT));
        mysqli_stmt_execute($stmt);
        mysqli_stmt_store_result($stmt);
        if($cnt=mysqli_stmt_num_rows($stmt)){
            $result = mysqli_stmt_get_result($stmt);
            for($i=0;$i<$cnt;$i++){
                $row = mysqli_fetch_assoc($result);
            }
        }
    }
    mysqli_stmt_close($stmt);
    mysqli_close($conn);
}

タグ

blob, conn, connect, db, dbname, dbpassword, dbusername, double, hostname, if, Integer, lt, mysqli, pass, php, root, select, servername, SQL, string, user, イマドキ, コード, バインド, パケット, パラメータ, プリペアドステートメント, 仕方, 公式, 分割, , 変数, 実行, 対応, 接続, 書き方, 未知数, 複数, 送信,

GCPではサーバ上から送信が出来ないだから代替えサービス。

2018.04.15

Logging


GCPではサーバ上から送信が出来ないだから代替えサービスを使わないと
いけないらしい。でも其の代替えサービスは有料だったりする。
それも結構お高い。
なので、サーバ内から送信を行う必要がなければ無理に
代替えサービスを使う必要はない、ということなので
国内サーバのメール送受信サービスを
使えば何とかなります。
もしsendmail系を使いたいなら
国内サーバの仮想サーバ(VPS)を自分はお薦めします。
ちなみにGCPよりAWSの方が良い気がしていますが
人工知能などのAPIサービスはやはりGCPの方が性能が良いですね。
AWSは機能が豊富な所が売りかなと。

タグ

APIサービス, AWS, GCP, Google Cloud Platform, sendmail系, VPS, お薦め, サーバ上, サーバ内, メール送受信サービス, 人工知能, 代替えサービス, 仮想サーバ, 国内サーバ, 有料, 機械学習, 深層学習, 送信,

明けましておめでとうございます。

2017.01.01

Logging


明けましておめでとうございます。
新年、そうそうちょっと暗めの年賀状が届いている方、
申し訳ございません。うまく色合いを調整することが出来ませんでした。
ちなみに年賀状を送ったのは
数人、片手で数えることが可能な人数でございます。
あとはデジタル送信でLINEやらに送信されていると思います。
この記事は自動投稿機能によりカウントダウン後、
日付が変わって数秒で投稿されているはずです。
ちなみにこの記事はクリスマス・イブの日に書き上げています。
正月用の記事はこの三連休に予約しときます。
(それ以外にも記事は投稿するとは思いますが未定。)
ということで
今年もよろしくお願いします。
皆様にとって良い年になるように祈ってますので、
祈り返してください:D
 

タグ

line, nbsp, あと, イブ, お願い, カウントダウン, クリスマス, こと, それ, デジタル, パス, 三連, 予約, 人数, 今年, , 可能, , 年賀状, 投稿, 数人, 数秒, 新年, , , 日付, 未定, 機能, 正月, 片手, 申し訳, 皆様, 自動, 色合い, 記事, 調整, 送信,