POSTとGETの考え方について伝えている動画。 #以心伝心
2022.11.12
おはようございます、11月なのに寒くないって不思議です😗温暖化。
さて、POSTとGETの考え方について無音声（音楽あり）で伝えている動画です、以心伝心で意味が通じると良いですが、それではブログを書いている意味がないので要点だけ解説します。POSTとGETとは、インターネット上でデータの送信を行うのに使用します。POSTの利点はデータを隠して送れることと、比較的に重いデータも送れることにあります。ではGET送信の利点は、SEOに有利と言ったところでしょうか。
今回、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.webp);
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;
}
著者名
@taoka_toshiaki
※この記事は著者が40代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
11, 2, css, DOCTYPE, GET, html, lt, no, php, POST, SEO, インターネット, こと, ソース, データ, ところ, ブログ, プログラム, 下記, 不思議, 今回, 以心伝心, 使用, 処理, 初学, 利点, 動画, 参照, 受信, 同期, 意味, 方法, 有利, 次回, 温暖化, 考え方, 要点, 解説, 送信, 送受信, 音声, 音楽,
JSのPromiseとawaitってこういう事なんだよね。理解した！！( ･ิω･ิ)
2022.04.29
おはよう御座います。
この頃、JSを使う機会が増えてきています。巷ではReact.jsなどやVue.jsなんかが人気ですよね。またnext.jsなんかも出来れば転職活動に有利です。でもそんなフレームワークを勉強するまえにJavaScriptの基礎が出来ていないといけないと思っています。ネイティブでゴリゴリ書ける人であれば、何処へ行ってもやってけると思っています。
"use strict";
const main = (a,b,c)=>{
return new Promise ((resolve)=>{
console.log(a,b,c);
b++;
resolve({a:a,b:b,c:c});
});
}
(async()=>{
await main("A1",1,"C1").then((val)=>main(val.a,val.b,val.c)).then((val)=>main(val.a,val.b,val.c)).then((val)=>main(val.a,val.b,val.c));
// main("A1",1,"C1").then((val)=>main(val.a,val.b,val.c)).then((val)=>main(val.a,val.b,val.c)).then((val)=>main(val.a,val.b,val.c));
console.log("fin");
})();Promiseとawaitとかの使い方はこんな感じです😀、このコードでは重たい処理を書いているわけではないけど、非同期通信処理チェーンで繋ぐとどんな所で使えば良いのか分かるかなって思います。要するに順番に非同期通信処理をしたい時に役に立ちます。このソースコードの場合、awaitしなくても良いですがね・・・。awaitを付けると処理後に次のコードが処理されます。付けない場合は同時並行的に処理されます。
サンプルコードはこちらから閲覧ください（検証）ませ！！
著者名
@taoka_toshiaki
※この記事は著者が40代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
１, async, await, console, const, gt, javascript, JS, log, main, new, NEXT, Promise, quo, quot, react, resolve, return, strict, use, vue, なん, なんか, ネイティブ, フレームワーク, まえ, 事, 人, 人気, 何処, 勉強, 基礎, 巷, 有利, 機会, 活動, 理解, 転職, 頃,
あの人あの人、わたしは私？
2020.06.19
あの人がゆくんじゃ
相田みつを
わたしはゆかない
あの人がゆくなら
わたしもゆく
あの人
あの人
わたしはどっちのあの人か？
貴ちゃんねるずというチャンネルをタレントの石橋貴明さんが開設しました、なんだか、芸能人のこの流れ止まらないよね。YOUTUBERで自分を売りしているYOUTUBERさんは確実に痛手だと思います。TVで活躍されていた芸能人は取り巻く人達がやはりハイレベルです。編集力のあるひともいるだろうから。
TVからYOUTUBEに流れていく芸能人はかなり最初から有利だ、知名度があるので登録者数は普通に動画投稿せずとも千はすぐに超える。一般人が努力して増やしていってたどり着く千の壁を軽々と突破していくのである。
こんなの見たら超底辺YOUTUBERの中には嫉妬するYOUTUBERさんもいるかもしれない。そういう嫉妬したユーチューバーさんが悪いねというボタンを押すことも有るだろう。だれがYOUTUBEはゆるげーと言ったのか知らないけど、もうゆるげーではない時代になってる。
これからYOUTUBE始める人はその他のSNSも駆使しないと上手く行かないよということを底辺ブログ書きがネタにしました。これからはあの人に着いていくより自分で独創的に何かをする人が、上手くいくような気がします。
ちなみに石橋貴明さん、TwitterやInstagramなども発信していくみたいです、柔軟性ありますね。これからの時代、柔軟性がないと生き残れないと、、、。
最後にチャンネル登録はこちらです。
https://www.youtube.com/channel/UCbXUEjBdbrn4BEbLSKJuSpw/featured
著者名
@taoka_toshiaki
※この記事は著者が40代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
TV, youtube, YOUTUBER, かなり, げーと, こと, だれ, タレント, チャンネル, どっち, ハイレベル, ひと, ボタン, ユーチューバー, わたし, 一般人, 中, 人, 努力, 動画, 千, 壁, 嫉妬, 底辺, 投稿, 普通, 最初, 有利, 活躍, 痛手, 登録者, 相田みつを, 知名, 石橋貴明, 私, 突破, 編集, 自分, 芸能人, 貴, 開設,
はてな？リモートワークとお仕事。
2020.04.13
リモートワークになれば仕事が増えるのか？自分はその逆で仕事が減る、仕事ができない人はデスクワークではいらなくなる。ある一定の基準を満たしていないとアウトになる。そして中小企業が消えていくような時代になると思います。何故、デスクワークの中小企業が減ってくるのか？
リモートワークになれば人材は世界中から人材を集められるから、別に日本で駄目だという制限がなくなる。別に下請けに仕事を頼まなくても良くなるから下請けは消えていくだろうなと思います。
リモートワークは良いところは本当に技術力があるひとが認められる社会になるということだけかなと思います。これからIT関係で言えばセキュリティに強い技術者が重宝される時代になると思います、また英語が話せる技術者も有利になるかなと思います。
著者名
@taoka_toshiaki
※この記事は著者が40代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
IT, アウト, お仕事, こと, これ, セキュリティ, デスク, ところ, はてな, ひと, リモート, ワーク, 一定, 下請け, 世界, 中小企業, 人, 人材, 仕事, 制限, 基準, 技術力, 技術者, 日本, 時代, 有利, 本当, 社会, 自分, 英語, 逆, 重宝, 関係, 駄目,