@Blog{zip358.com}

あれから数年経過．コロナは落ち着きましたね？

2024.05.15

Logging

おはようございます、昔、アロー演算子の数珠繋ぎの作り方みたいなのはどうやって作るかという事を思っていた時にオープンソースを見てなるほどなぁと思っていたのですが、あれから数年経過してもっと簡略的に作れること、そしてthisの受け渡しでもいろいろ出来るよって話まで行き着きました．

あれから4年経過すると自分の過去のソースコードが残念に思います．これから数年経過するとこのコードの例も残念なコードになるかも知れませんが今最善の例コードになります．

<?php
/**
 * チェーンクラス？数珠繋ぎクラス？関数の作り方．
 */
class ChainClass{
    public $value = 0;

    /**
     * 加算関数
     */
    public function add($value)
    {
        $this->value = $this->value + $value;
        return $this;
    }

    /**
     * 乗算関数
     */
    public function multiplication($value)
    {
        $this->value = $this->value * $value;
        return $this;
    }

    /**
     * 解を表示する関数
     */
    public function answer()
    {
        printf('答えは%dです',$this->value);
        return $this;
    }
}

(new ChainClass)->add(2)->add(3)->multiplication(10)->add(5)->answer();

明日へ続く．

タグ

gt, gt;add, gt;answer, gt;value, lt, multiplication, php, printf, public, return, this, value, アロー演算子, 乗算関数, 加算関数, 数珠繋ぎ, 数珠繋ぎクラス, 最善, 関数,

干支計算2024

2024.04.05

Logging

おはようございます、干支計算2024を作りました．ソースコードは下記になります．

// 干支の計算方法は？
// 十二支は、西暦を１２で割り、同様に余りを求めます。 
let eto = ['申', '酉', '戌', '亥', '子', '丑', '寅', '卯', '辰', '巳', '午', '未'];
document.querySelector('.input').addEventListener('input', function () {
    let index = isNaN(Number(document.querySelector('.input').value)) ? -1 : (Number(document.querySelector('.input').value) % 12);
    document.querySelector('#res').innerText = index === -1 ? '' : eto[index];
});

過去に同じことをしていたのを見つけて、今ならどう書くのだろうかと書いてみた感じです．

求める方法は変わっていますが、コードをみると今の方が短くかけていると思います．昔、コードを書き出した頃から比べると全く違うようになってきた気がしますね．最初から短くかける人でなくても続けていれば短くかけるようになってきますので、滅気ずに頑張ってコードを書いてみてください．

明日へ続く．

タグ

addEventListener, document.querySelector, eto, function, index, innerText, isNaN, let, let eto, Number, querySelector, res&#39, value, ソースコード, 十二支, 午, 干支, 干支計算2024, 滅気, 西暦,

Laravelもそうだし何でもそうなんだけど📝。

2023.07.18

Logging

おはようございます、Laravelもそうだし何でもそうなんだけどまだまだ使い倒していないなぁと思います。Laravelにはいろいろな機能があります、基本的なことは覚えているのだけどもまだまだ使い倒していないなぁと思っています。それぐらいいろいろな機能があります、フレームワークをゴリゴリ使えるレベルに早くなりたいなって思います。

因みにゴリゴリとは隅から隅まで熟知しているレベルを指します（DDDとかも含みます。）。最近知ったLaravelの機能でデータ参照時に値を変更する機能があることです、これはとても便利な機能だなって感じました。

class User extends Model {

    public function getFirstNameAttribute($value) {
        return str_replace('tanaka', 'yamada', $this->first_name);
    }

}

こんな感じにまだまだ知らない機能があるのです。リモートワークで仕事をする中で技術の共有は大事になりますが、ちょっとした事は実仕事と同じだけど自分で調べることも大事になります。生成AIの登場により生成AIに分からないことを聞くことがググるよりも早く答えに近づけるのですが、それは良いようで悪い気がします。記憶に残らないような気がするのです。

記憶に残るには適度のストレスが必要らしいのですね、殆どの生き物は命を脅かす出来事を記憶するというそういう構造になっているそうです。人も同じくストレスと記憶は関係があります、なのである程度、負荷がかかった方が効率的に良いという結果生みやすいのです。

そういうわけでググるのも大事です。

これからも気付きはブログ記事にしていきますが、この頃、昔よりも気付きが少なくなりつつありますね。良いことのようで鈍化しているのかもしれないので要注意ですね(・・;)。

タグ

class User extends Model, DDD, gt;first_name, Laravel, Photo by Pixabay on Pexels.com, public function getFirstNameAttribute, return str_replace, this, value, フレームワーク, リモートワーク, 出来事, 命, 構造, 殆ど, 生き物, 生成AI, 要注意, 負荷, 隅,

How to Loop Play YouTube at a Specified Location #LoopPlay

2023.06.19

Logging

Good morning. Here’s a method to loop play YouTube videos at a specific location. Here’s how it works: by appending the following parameter (value) to the address bar, the video will loop between 0 minutes and 1 minute and 1 second. By the way, setting loop=0 will result in an infinite loop, while loop=1 will make it loop only once.

&start=00:00&end=01:01&loop=0

Actually, for those using Chrome, there is a convenient extension available that allows you to loop YouTube videos without going through all this trouble. It seems to have been created by someone from China, probably an individual, but it works really well.

I’ll provide the link for you.
https://chrome.google.com/webstore/detail/looper-for-youtube/iggpfpnahkgpnindfkdncknoldgnccdg

タグ

Actually, Good morning, Here's a method to loop, Here's how, I'll, in an infinite loop, individual, it loop, it works, location, only once, probably an, really well, setting loop, value, way, while loop, will make, will result, YouTube videos without,

htmlとcssとphp-初学非同期処理とおまけ-No.3

2022.11.14

Logging

おはようございます。月曜日の朝ですね‥お仕事探しは続いています。

さて、非同期処理とは何かと問われると詰まりますが・・・。いつ結果を返してくれない処理といえば良いのでしょうか。じゃ同期処理はといえば仕事が終わるまで次の仕事を進めない事といえば良いのかな🤔、教えるのが下手なのでぐぐってみてください。

document.querySelector(".btn").addEventListener("click", () => {
    let p = [document.querySelector("[name='name']").value, document.querySelector("[name='text']").value];
    [...document.querySelectorAll(".put")].forEach((elm, index) => {
        elm.innerText = p[index];
    });
    document.querySelector("#box2").style.display = "none";
    document.querySelector("#data").insertAdjacentHTML("beforeend", `<button class="btn2" type="button">非同期送信</button>`);
    document.querySelector(".btn2").addEventListener("click", async () => {
        //submit code
        let url = "./submit.php";
        let data = (() => {
            return ([...document.querySelectorAll(".put")].map((elm, index) => {
                return "test" + index + "=" + elm.innerText;
            })).join("&");
        })();
        const options = {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                "Content-Length": data.length,
                'Accept': 'application/json'
            },
            body: data //JSON.stringify(data)
        };
        await fetch(url, options).then(response =>
            response.json()
        ).then(resultdata => {
            document.getElementById("view").insertAdjacentHTML("beforeend", resultdata.test0 + "," + resultdata.test1);
        }).catch(error => {
            console.log(error);
        });
    });
});


function imgchg(imagename){
    document.body.setAttribute("style","background-image: url(./assets/images/" + imagename + ".jpg.webp");
}

ぐぐると自分言っていた意味がなんとなく分かるかと思います。ちなみに非同期動画（youtube）のおまけとして、背景画像を変える処理のソースコードを書いています。プログラムコードとしては３行ですが、初学者の方はこの３行のソースコードの方が面白いのかもしれません。自分が書いたソースコードを所々、変更して動かしてみてください。そうすることで、徐々にコードの意味が理解してくると思います。

追伸：サンプルサイトの動画は少しお休みします()？

https://358tool.com/sample-site/

タグ

３, 39, addEventListener, btn, click, css, document, gt, html, let, name, no, php, querySelector, querySelectorAl, quot, Text, value, いつ, おまけ, お仕事, 事, 仕事, 何, 処理, 初学, 同期, 月曜日, 朝, 次, 結果,

若気の至り若気の過ちか？Ｍｒ.ROBOT🤖

2022.09.11

Logging

こんばんは、深夜便で東京に向かってます（嘘です）。

今日は緊急で動画廻してます（記事を書いています）。私が昔書いたコードに大きな脆弱性が合ったので、そのコードの穴だけ塞ぎました。まだ、色々な所に穴があるかもしれないですが・・・。

この脆弱性に関しては知っていたのですが、昔のコードをそのままにしていたのを失念していたのです、それが大きな過ち…。仕事では重大インシデントになりますね😱。

<?php
 function defence_xss($data=""){
    if(is_array($data)){
        foreach ($data as $key => $value) {
            $data[$key] = strip_tags($value);
            $data[$key] = htmlspecialchars($data[$key],ENT_QUOTES);
        }
    }else{
        $data = strip_tags($data);
        $data = htmlspecialchars($data,ENT_QUOTES);
    }
    return $data;
}

今回、塞いだのは初歩の脆弱性です、、、POSTやGETで送られるデータに悪意のあるコードなどを埋め込んでハッキングを行う手法です。またセッションジャックとかそういうのもありますので、気になる方は調べてみてください。

追記して書いときます。昔勤めていた会社でも何度か、この手の手法でハッキングに合いました。脆弱性が解消されているかは分かりません。XSS攻撃は防げても、これではSQLインジェクション攻撃は防げません、昔のコードで動いているとしたら修正箇所は無数にあるので一日では直せないでしょう。

昔勤めていた会社はShopifyへシステムを移行しているようですが、それが良いのかは分かりません、自分だったら物足りなさを感じると思います😌。

タグ

array, as, data, defence, foreach, function, gt, htmlspecialchars, if, is, key, lt, Mr, php, quot, ROBOT, strip, tags, value, xss, インシデント, コード, それ, 今日, 仕事, 動画, 嘘, 失念, 所, 昔, 東京, 深夜便, 私, 穴, 緊急, 脆弱性, 色々, 若気, 記事,

一見似ていて全然違うコードですよ、初心者のどつぼの壺。

2022.04.02

Logging

おはよう御座います。土曜日の朝です😪。

下記のコードは一見似ていて全然違うコードですよ、初心者のどつぼの壺と言いますか・・・。初心者がハマりやすい、thisの領域です。特にメンターのいない独学で勉強をしている人はハマりやすいかなと思ったので今回、サンプルコードを記載しました。昔、自分が何故と思ったのですが今ではfunctionがねぇと気づく内容のコードです。

document.getElementById("example").addEventListener("input",function(){
    main()
})
document.getElementById("example").addEventListener("input",main);

function main(){
    if(this.value){
        console.log(this);
    }
}

最初はみんな初心者です、間違いながら覚えていけばよいのです、失敗しながら覚えていけばバグ取り🐤が上手になります。そのうち、動作するバグ🐞になっていきます。動作するバグが一番厄介です、動作するのでエラーコードを出力しないのでバグを取るにはトレースか当たりをつけてトレースするしか無いのです。

そういうことなので、初心者の皆様気おつけてくださいませ😌。

タグ

addEventListener, document, example, function, getElementById, if, input, main, quot, this, value, コード, サンプル, ドツボ, メンター, 一見, 下記, 人, 今, 今回, 内容, 初心者, 勉強, 土曜日, 壺, 昔, 朝, 独学, 自分, 記載, 領域,

WordPressのapply_filtersを使うと便利ですよ。

2021.11.29

Logging

明日（2021/11/30）は高知県は雨が降るそうです、冬の雨はあまり自分は好きではないです・・・。どんより曇り空よりかはマシですけどね。

さて「WordPressのapply_filtersを使うと便利ですよ。」というお話です、有名なプラグインにはapply_filtersが大体あるので、それを使ってプラグインに自分のオリジナル処理を割り込むことが可能です。では、 apply_filtersはどんな動作をするかと言えば、独自のフィルターを登録するときに使用します。

なので、add_actionを使って登録されている独自のフィルター名を参照することで外部のプラグインに変更処理を行うこと等が可能になります。

<?php apply_filters( $tag, $value, $var ... ); ?> 

<?php add_action( $hook, $function_to_add, $priority, $accepted_args ); ?>

apply_filtersとadd_filterがどういう物なのかを完結に説明しているサイトが有りましたので、リンクを記載しときます。

https://blog.z0i.net/2016/11/apply-filters-add-filter.html

余談：ある有名なプラグインのコードを読んでいて、自分がプラグインを作るときにもapply_filtersなどを記載しておくと開発者に使用していただける確率は高くなるなと感じました。

タグ

11, 2021, 30, Action, Add, apply, filters, function, gt, hook, lt, php, tag, To, value, var, WordPress, オリジナル, お話, こと, それ, とき, フィルター, プラグイン, まし, 使用, 便利, 冬, 処理, 動作, 参照, 可能, 変更, 外部, 明日, 曇り空, 有名, 登録, 自分, 雨, 高知県,

javascriptのアロー関数ってアレだな。

2020.05.20

Logging

javascriptのアロー関数ってアレだな、無名関数の省略形だと思ったら良いです。アロー（arrow）＝矢って意味、まんまだよね。日本語に直訳すると矢関数って意味になるのかな・・・。矢関数って響きが良くないのでアロー関数って読んでいるだけだと思うのです。英語のわからない自分は矢関数で良いじゃないと思ったりするわけです。

例文：載せときます、、比較的新しいブラウザなら動作します。

	const test = (e)=>{
		var view = document.querySelector("#view1");
		view.innerHTML = e.target.value;
	};
	const input = document.querySelector("#t");
	input.addEventListener("input",test);

一応、デモサイトのリンクも載せときますので、動作確認してみてくださいな。
尚、今回は純正なjavascriptだけで記載しました。これから極力、純正で純粋なjavascrpitで書いていこうと思います、いまのWEBの流れはそうなんだって。そしてTypescriptとかが今後来るみたいに言われていますよね。

https://zip358.com/tool/demo15/

タグ

１, addEventListener, arrow, const, document, gt, innerHTML, input, javascript, querySelector, quot, target, test, value, var, view, アレ, アロー, ブラウザ, まんま, 例文, 動作, 意味, 日本語, 無名, 直訳, 省略形, 矢, 自分, 英語, 関数,

Javascript? EVENT処理の際に引数を渡す。

2019.04.26

Logging

Javascript? EVENT処理の際に引数を渡す方法。
ちなみにもっと簡略化できます。

//NG
$(function(){
    let hoge = "test";
    $("input[type='text']").on("change",(function(hoge){
        console.log(hoge);
    })(hoge));
});
//OK!
//js
function hoge(a){
    return function(){
        console.log(a +  this.value);
    };
};
document.querySelector('input[type="text"]').addEventListener("click",hoge("aaaaaaa~"),false);
//jq
$(function(){
    let hoge = function(a){
        return function(){
            console.log(a + $(this).val());
        };
    };
    $("input[type='text']").on("change",hoge("test="));
});

タグ

aaaaaaa, addEventListener, change, click, console, document, EVENT, false, fu, function, hoge, input, javascript, jq, JS, let, log, NG, OK, ON, querySelector, return, test, Text, this, type, value, 処理, 引数, 方法, 簡略, 際,

全ての定義済の変数を配列で返す

2019.03.16

Logging

全ての定義済の変数を配列で返す関数です。
全てなのでとってきて欲しくないものまでも取ってきます。
なのでそういうのはunsetします。
ちなみに似たようなのでcompactという関数がPHPには存在します。
何に使用する場合に便利かは人それぞれ違いますが
自分の場合はテンプレートエンジンを使用するときに重宝してます。
テンプレートエンジン・・・TwigやSmartyなど

<?php
$a = "abc";
$b = array(1,2,3);
$c = 123;
$vars = get_defined_vars();
unset($_COOKIE);
unset($_POST);
unset($_GET);
unset($_FILES);
unset($GLOBALS);
foreach ($vars as $key => $value) {
    var_dump($key);
    var_dump($value);
}
//...
var_dump($vars);

タグ

１, 2, ３, ABC, array, as, compact, COOKIE, defined, dump, files, foreach, GET, GLOBALS, gt, key, lt, php, POST, Smarty, Twig, unset, value, var, vars, エンジン, それぞれ, テンプレート, とき, もの, 人, 何, 使用, 便利, 全て, 場合, 変数, 存在, 定義, 自分, 配列, 重宝, 関数,

javascriptでEVENT処理レベル1

2019.03.09

Logging

<!DOCTYPE html>
<html>
    <head>
    </head>
<body>
    <input type="text" class="zyezyezye">
    <script>
            "use strict";
            let zyezyezye = document.querySelector(".zyezyezye");
            zyezyezye.addEventListener("input",()=>{
                console.log(">おいら>>" + zyezyezye.value);
                if(zyezyezye.value=="じぇじぇじぇ")
                {
                    console.log("おいら>>ｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!nおいら>>じぇじぇじぇn<<ストーカーかよ!!");
                }
            });
        </script>
</body>
</html>

jqueryばかり書いているとこういう書き方、書かなくなる。
jqueryから世の中はjavascriptやvue.jsなどへシフトしているそうだけど、未だにjqueryばかり書いている自分です。なれないといけないと思いつつ！？
別のことに力を注いでいる毎日です。
ちなみに「じぇじぇじぇ」は方言で驚きを指す言葉だとか。

タグ

１, addEventListener, body, class, console, DOCTYPE, document, EVENT, gt, head, html, if, input, javascript, let, log, lt, querySelector, script, strict, Text, type, use, value, zyezyezye, おいら, レベル, 処理,

PHPの無名関数の使い道が未だにわからないし…

2019.03.09

Logging

<?php
$mumei = function()
{
    if($cnt = func_get_args())
    {
        foreach($cnt as $key=>$value)
        {
            print func_get_arg($key);
        }
    }
};
$mumei(1,2,3,4,5,6);

わからない、未だにわからないし、使う機会が少ないのだけどいったいどこに使うのか。

追記：
2021年の今、無名関数を使ってコードを書くことが増えました、PHP8になりオブジェクト指向が洗練されてきています。今後、無名関数を使用してコードを書くこともあると思います。因みにJSの方が無名関数でコードを書くことが多いですね。

PHPでの無名関数の問題点は、頻繁に無名関数ばかり使用していると他のエンジニアが読みづらく感じる所かもしれません。特にPHPの昔のバージョンになればなる程、読みづらいと思います。

タグ

１, 2, 2021, ３, 4, 5, 6, 8, arg, args, as, cnt, foreach, FUNC, function, GET, gt, if, JS, key, lt, mumei, php, print, value, エンジニア, オブジェクト, コード, こと, どこ, 今, 今後, 他, 使い道, 使用, 問題点, 所, 指向, 方, 未だ, 機会, 洗練, 無名, 追記, 関数, 頻繁,

たった数行のプログラムでドツボにはまる。

2018.04.14

Logging

<?php
$command = "ls -m img";
exec($command,$val,$chk);
//imglist
$imglist = explode(",",implode("",$val));
if(is_array($imglist)){
    foreach ($imglist as $key => $value) {
        $img64[$key] = base64_encode(file_get_contents("img/".trim($value)));
        $path_parts = pathinfo($value);
        $path_parts['extension']=="jpeg"?"jpg":$path_parts['extension'];
?>
<div><a href="./img/<?=trim($value)?>"><?=$value?></a><br><img src="data:image/<?=$path_parts['extension']?>;base64,<?=$img64[$key]?>"></div>
<?php
    }
}
$obj["imglist"] = implode("\n\n",$img64);

ls -m というコマンドをPHPのexecという関数を使用し
画像リストを取得しようとしてどつぼにハマった・・・。
この関数、exec(“ls -m”)と書くと$valの中に配列として返却されるのだが、複数の配列に別れて返却される。なので一度、implodeを使用して一度、文字列に戻す必要がある。そしてカンマ区切りで再度、文字列分離する。

これでほっと一息つくとアウトだ！
配列化した値の前後に空白部分が入っていたり改行コードが入っていたりして画像を参照することが出来ないのだ。そのため、trim関数を使用して取り除く必要がある。

コマンドを使用して画像をリスト化して参照するメリットは何かと言えば数百枚の画像を列挙するときなどに高速で参照化することが出来るのだ。因みにコマンドでファイルの検索を行うという事なので本領発揮すると思います。

是非、お試しあれ。

タグ

-Command, -m, ３, 39, 64, array, as, base, chk, contents, encode, exec, explode, extension, file, foreach, GET, gt, if, img, imglist, implode, is, jpeg, jpg, key, ls, lt, parts, path, pathinfo, php, quot, trim, val, value, ドツボ, プログラム, 数行,

これを使うと面白いことが出来る出来そう。file_get_contents('php://input');

2016.05.07

Logging

これを使うと面白いことが出来る出来そう。
file_get_contents(‘php://input’);を使用すると面白いことが
PHPで出来るかもしれない。
file_get_contents(‘php://input’);って何かというとPOSTしたデータの
生データを取ってくるというものです。
ちなみに最近LINE BOTを作っている人のソースコードを
見て知りました。
生データではなくPOSTのデータを
取りたい場合は下記のように記述することで
ガガッとデータを取ることも出来ますよ。

    $hoge = array();
    foreach ($_POST as $key => $value) {
        $hoge[$key] = $value;
    }

また、巷ではチャットBOTが流行中ですけど
正直なところ、あまり興味がわかないです。
プログラムの記述はやはりAPIなので
最終的に投げたり、返ってきたデータを
ｺﾞﾆｮｺﾞﾆｮ…(ﾉﾟдﾟ(;￣Д￣)したりするという
物なので・・・。
出来たら自分の場合、飽きちゃうですよね。
APIでも難しそうな人工知能APIも
基本的には同じ原理かなと思ってますが
ハードルが少し高いですね。
そんなのより、実はmailとShell＋PHPで
ｺﾞﾆｮｺﾞﾆｮ…(ﾉﾟдﾟ(;￣Д￣)するのが
なんだか楽しいかもと思ってます。
mailで投げたらTwitterに投稿するとか、
mailでキーワード投げたら検索結果が返ってくるとか、
そういう何とも無駄なものを作りたい欲求が
高まってます。
 
 

タグ

$_POST as, AM, file_get_contents, foreach, hoge, input, key, LINE BOT, mail, php, value, ガガッとデータ, ゴニョゴニョ, ソースコード, チャットBOT, ハードル, 人工知能API, 生データ, 面白いこと,