JSの?.って何か!

2024.04.03

Logging

おはようございます、この頃js(javascript)コードに?.オプショナルチェーン (optional chaining) 演算子を見かけるようになってきましたね.そろそろこういう書き方をしてもエラーにならない時代になってきたのでしょう.

//オプショナルチェーン (optional chaining) 演算子 (?.)👍
let email = data?.email;

因みにdata?.emailが宣言されていない場合はundefinedが返却されます.今迄、if文なんかで判断していたものがオプショナルチェーンを使用することで省略可能になります.

このオプショナルチェーンは使い道が結構あると思うので、これから見ることが多くなると思います.

明日へ続く.

タグ

data, email, if文, javascript, let email, optional chaining, undefined, エラー, オプショナルチェーン, コード, この頃js, 使い道, 時代, 書き方, 演算子, 省略,

vue.jsの学習をはじめて思うこと。 #参考書

2022.12.29

Logging

おはようございます、今年もあと少しですね😳。

先日からvue.jsの学習をしているのですが、参考書の8割方のアウトプットが出来ましたがですが、正直なところ、基礎概念がわかったぐらいの物でテクニックが記載されているという感じではない本、そういう印象を持っていますが、あと2割に極上のテクニックが記載されているかも知れません。

自分が買った本はこれです。

こんなデザイン表紙になっています、本のタイトル名は過去の記事に記載していますので、そちらを参照くださいませ🙇。

因みにいまVue.jsのコンポーネントを勉強しています。コンポーネントの使い方は分かったのですが、正直な所、JavaScriptを初めて勉強した方からするとハードルは結構高いじゃないかなと思います。こういう様になるんだという考えで進めていくべしですね。何故ならフレームワークの中身を知ろうとするとかなり難解なので、こういうルールがあるだよと思った方が良いです。

最後に自分のGitHubに参考書を基にしたサンプルコードをUPしていますので、良かったら参照ください。

        Vue.component('ore',{
            data:function(){
                return {
                    oreore:''
                }
            },
            mounted:function(){
                this.oreore = ' https://taoka-toshiaki.com';
            },
            template:'<h1>taoka toshiaki {{ oreore }}</h1>',
        });
        let app = new Vue({
            el:'#app',
        });

タグ

data, EL, function, github, let app, lt, mounted, new Vue, oreore, return, taoka-toshiaki, template, this.oreore, Vue.component, vue.js, アウトプット, コンポーネント, ハードル, フレームワーク,

dockerとlaravel(ローカルと同期していると遅くなる。)

2022.12.26

Logging

おはようございます、先日は雪が降りましたね_(:3」∠)_。今日も寒い日になりそうです☃。

さて、Laravelを勉強して昨日の時点でLaravelの参考書は終盤になっています。月曜日には入門書はコンプリート出来そうです。自分はDockerを使って環境を作っているのですが、Laravelのファイルをローカルに置きDockerで走らせているのですが、どうもブラウザで見る際も常に全ての同期処理がバックグラウンドで走っているらしく、とても表示するのにストレス(遅延)を感じていました。

それを解消する方法はないかと探していた所、@ucan-labさんと@suinさんがヒントを記載していました。下記のヒントから、vendorをローカルに同期しないようにしてDocker内にコピーする方法に変更した所、Qiitaに記載している通り、レスポンスがかなり早くなりました。爆速で表示されるようになりました😲。

docker container cp vendor コンテナ名:/var/www/html/example-app

追伸

vendor及びstorageのframeworkの配下も同じようにすると早くなりますよ。エラーが出るのでパーミッションの777に変更することもお忘れなく!!!!Composerのインストールでエラーが出る場合は下記を叩いてみてください。

mkdir -p storage/framework/cache/data/
mkdir -p storage/framework/app/cache
mkdir -p storage/framework/sessions
mkdir -p storage/framework/views

タグ

App, cache mkdir, Composer, data, docker, example-app, Framework, Laravel, qiita, sessions mkdir, storage, ucan-labさん, var, vendor, Volume, パーミッション, 爆速, 置きDocker, 追伸, 配下,

Laravelのbladeにはloop変数が用意されている🙄 #loop

2022.12.23

Logging

おはようございます、今年もあと数日ですね_(:3」∠)_。

Laravelのbladeにはloop変数が用意されています、 ワードプレスでいう$postとは考え方が違います。$loopはbladeファイルの@foreach内だけで動作するように設計されています。なので@foreach外でしようする{{$loop}}とは別ものです。

逆に$loop変数を@foreach内で表示しようとすると$loopはオブジェクトなので表示できませんとエラーが発生して怒られます。ややこしいいっその事、使用できないようにして欲しいですよね。

ErrorException
htmlspecialchars() expects parameter 1 to be string, object given

$loop変数の他に$attributes(属性)という変数もあるそうです。使いどころがイマイチ分からないですがあります。最後に予約語の一覧を抜粋して記載ときます😄。

  • data
  • render
  • resolveView
  • shouldRender
  • view
  • withAttributes
  • withName

追伸:laravelで独自関数を使用したい場合やbladeで使用したい場合などはこの方法で定義することで使用可能となります。Qiitaのリンクを参照ください。

https://qiita.com/kuroshun960/items/13a792ceabfec454cf21

タグ

attributes, blade, bladeファイル, data, ErrorException htmlspecialchars, foreach外, Laravel, loop, loop変数, object given, qiita, render, resolveView, shouldRender, withAttributes, withName, 変数, 追伸,

chart.jsでデモを試してみました。📈 #javascriptcode

2022.11.18

Logging

おはようございます、朝が早いですねと言われますが、夜が早いだけです😅。

さて、今日はchart.jsのデモを試してみました。売上のグラフとかコレで作るのが一番じゃないかなと思うライブラリですね。動画で編集してみせたのは二箇所ですが、実際、業務で使用する場合は3箇所ほど変更して使用しないといけないのかなって。

chart.jsでデモを試してみました。📈
chart.jsでデモを試してみました。📈

そういう訳で、こちらのブログにソース・コードを貼り付けておきます。

        const ctx = document.getElementById('myChart');
        let data = [12, 19, 3, 19, 2, 3];
        new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ['demo1', 'demo2', 'demo3', 'demo4', 'demo5', 'demo6'],
                datasets: [{
                    label: '# of Votes',
                    data: data,
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    x: {
                        beginAtZero: true
                    }
                }
            }
        });

業務で変更しないといけない最低限3箇所はこちらです~😆。

  • ラベル
  • データーセットの中のラベル
  • データーセットの中のデータ

上記の3箇所を売上のデータや何やらに使用することで活用できるかと思います。

タグ

12, 19, 2, , 39, bar, chart, const, ctx, data, document, getElementById, javascriptcode, JS, let, myChart, new, type, グラフ, コード, こちら, コレ, ソース, デモ, ブログ, ライブラリ, , , 今日, 使用, 動画, 場合, 変更, , 実際, , 業務, 編集, ,

若気の至り若気の過ちか?Mr.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で送られるデータに悪意のあるコードなどを埋め込んでハッキングを行う手法です。またセッションジャックとかそういうのもありますので、気になる方は調べてみてください。

SQLインジェクション判決、オニギリペイ、これらをつなぐセミナーにかける思いを語る
徳丸浩のウェブセキュリティ講座

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

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

タグ

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

Yahooが567(コロナ)の情報を取り扱っているそれも県単位でURLまとめたよ。

2020.12.20

Logging

Yahooが567の情報を取り扱っている。567(コロナ)を県単位で情報を配信しているまとめリンクサイトを作りましたので、ご自由にお使いください。
リンクはこちらです。https://zip358.com/tool/demo28/

ソースコードとJSONを貼っときます。IT土方さんみたいな事をした?。

<script>
	fetch("./assets/js/ken47.json").then(response => response.json()).then((data)=>{
		let ken = [];
		ken.push('<div class="list-group">');
		for (const key in data) {
			ken.push("<a  class='list-group-item list-group-item-action' href='https://hazard.yahoo.co.jp/article/covid19" + data[key].roman + "' target='_"+ data[key].roman +"'>" + data[key].name +":::https://hazard.yahoo.co.jp/article/covid19" + data[key].roman + "</a>");
		}
		ken.push("</div>");
		document.getElementById("covid19-link-list").innerHTML = ken.join("")
	});
</script>
{
	"1": {
		"name": "北海道",
		"roman": "hokkaido"
	},
	"2": {
		"name": "青森",
		"roman": "aomori"
	},
	"3": {
		"name": "岩手",
		"roman": "iwate"
	},
	"4": {
		"name": "宮城",
		"roman": "miyagi"
	},
	"5": {
		"name": "秋田",
		"roman": "akita"
	},
	"6": {
		"name": "山形",
		"roman": "yamagata"
	},
	"7": {
		"name": "福島",
		"roman": "fukushima"
	},
	"8": {
		"name": "茨城",
		"roman": "ibaraki"
	},
	"9": {
		"name": "栃木",
		"roman": "tochigi"
	},
	"10": {
		"name": "群馬",
		"roman": "gunma"
	},
	"11": {
		"name": "埼玉",
		"roman": "saitama"
	},
	"12": {
		"name": "千葉",
		"roman": "chiba"
	},
	"13": {
		"name": "東京",
		"roman": "tokyo"
	},
	"14": {
		"name": "神奈川",
		"roman": "kanagawa"
	},
	"15": {
		"name": "新潟",
		"roman": "niigata"
	},
	"16": {
		"name": "富山",
		"roman": "toyama"
	},
	"17": {
		"name": "石川",
		"roman": "ishikawa"
	},
	"18": {
		"name": "福井",
		"roman": "fukui"
	},
	"19": {
		"name": "山梨",
		"roman": "yamanashi"
	},
	"20": {
		"name": "長野",
		"roman": "nagano"
	},
	"21": {
		"name": "岐阜",
		"roman": "gifu"
	},
	"22": {
		"name": "静岡",
		"roman": "shizuoka"
	},
	"23": {
		"name": "愛知",
		"roman": "aichi"
	},
	"24": {
		"name": "三重",
		"roman": "mie"
	},
	"25": {
		"name": "滋賀",
		"roman": "shiga"
	},
	"26": {
		"name": "京都",
		"roman": "kyoto"
	},
	"27": {
		"name": "大阪",
		"roman": "osaka"
	},
	"28": {
		"name": "兵庫",
		"roman": "hyogo"
	},
	"29": {
		"name": "奈良",
		"roman": "nara"
	},
	"30": {
		"name": "和歌山",
		"roman": "wakayama"
	},
	"31": {
		"name": "鳥取",
		"roman": "tottori"
	},
	"32": {
		"name": "島根",
		"roman": "shimane"
	},
	"33": {
		"name": "岡山",
		"roman": "okayama"
	},
	"34": {
		"name": "広島",
		"roman": "hiroshima"
	},
	"35": {
		"name": "山口",
		"roman": "yamaguchi"
	},
	"36": {
		"name": "徳島",
		"roman": "tokushima"
	},
	"37": {
		"name": "香川",
		"roman": "kagawa"
	},
	"38": {
		"name": "愛媛",
		"roman": "ehime"
	},
	"39": {
		"name": "高知",
		"roman": "kochi"
	},
	"40": {
		"name": "福岡",
		"roman": "fukuoka"
	},
	"41": {
		"name": "佐賀",
		"roman": "saga"
	},
	"42": {
		"name": "長崎",
		"roman": "nagasaki"
	},
	"43": {
		"name": "熊本",
		"roman": "kumamoto"
	},
	"44": {
		"name": "大分",
		"roman": "oita"
	},
	"45": {
		"name": "宮崎",
		"roman": "miyazaki"
	},
	"46": {
		"name": "鹿児島",
		"roman": "kagoshima"
	},
	"47": {
		"name": "沖縄",
		"roman": "okinawa"
	}
}

タグ

39, 47, 567, assets, class, const, data, div, fetch, For, gt, in, IT, JS, json, ken, key, let, list-grou, list-group, list-group-item, lt, push, quot, response, script, then, url, Yahoo, コード, こちら, コロナ, サイト, ソース, それ, まとめ, リンク, , 単位, 土方, 情報, , 配信,

質問DATA検索を作りました。

2020.08.29

Logging

質問箱というサービスでじぶんに質問してくれる方がいます、そんな人達が使用してくれればなと思い、ちょこちょこっと作りました。OR検索はできません。ワンキーワードだけの検索ですが、役に立つかなと。

じぶんは重複した(似たような)質問には答えなくて良いかなと思います。なお、質問箱のデータは手動で登録しました。いちぶブログラムでデータを抜き取りましたが、未回答は完璧な手動での登録です…。

ちなみにこういう仕様のサービスは1時間もなく出来上がります、とても簡単なので・・・。ウェブサイトのサービスって基本的に簡単なので長年やっていると飽きます。とくに簡単なものはコードを書くのが面倒くさくなってなんでこんな簡単なコードを書かなくてはならないのかと思ってしまうことも過去に何度かありました。なので汎用性のあるコードを構えておいてコピペで使えるものを構えておくと良いですよ。長年、プログラムをやっていると飽きますね。

URLはこちら
https://zip358.com/QuestionTXT/

タグ

, data, OR, url, いち, ウェブ, キーワード, グラム, コード, こちら, こと, コピペ, サービス, サイト, じぶん, ちょこ, データ, プロ, プログラム, もの, ワン, , 仕様, 何度か, 使用, 回答, 完璧, , 手動, , 検索, 汎用性, 登録, 簡単, 質問, 過去, 重複, 長年,

jqueryのイベント処理時に引数を受け渡す方法を知っとくと良いかもしれません。

2020.03.10

Logging

jqueryのイベント処理時に引数を受け渡す方法を知っとくと良いかもしれません。記述は下記になります。ぐぐると出てくるので知っている人の方が多いかもしれませんが…。ちなみに自分はこの記述方法、ごくまれにしか使わないため、忘れてしまいます。event.dataに紐づけてくれるのはとても良いかなと自分は思っていますが、皆さんはいかがでしょうか?もうjqueryなんか使わないよという方もいると思うのですが、自分が思うにゴリゴリ書くよりか、jqueryで済ませれるところは使ったほうがコードは短くて済むと思っています。WEB業界は技術の移り変わりが早いですよね。逆にソフトのほうはWEBよりはスパンが長い気がします。

https://zip358.com/tool/demo9/

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="common.js"></script>
    <title>Document</title>
</head>
<body>
    <p id="pen">お腹空いた(´;ω;`)お腹空いたと>φ(..)</p>
</body>
</html>
$(function(){
    $("#pen").click({sword:"The pen is mightier than the sword"},function(e){
        $(this).text(e.data.sword);
    });
    // $("#pen").on("click",{sword:"The pen is mightier than the sword"},function(e){
    //     $(this).text(e.data.sword);
    // });
});

タグ

charset, data, DOCTYPE, EVENT, gt, head, html, ja, jquery, lang, lt, meta, quot, web, いかが, イベント, かな, コード, スパン, ソフト, ため, ところ, 下記, , 処理, 引数, 技術, , 方法, 業界, , 皆さん, , 自分, 記述, ,

天気予報を取得するアレを使用してみた(Openweathermap_api)。

2020.02.19

Logging

ご自由にお使いください。尚、openweathermap.orgより
アカウントを作成後、APIKEYを取得しお使いください。
下記のソースコードをコピーしての可変等は可能です。

余談

天気予報の絵文字が合致していていないかもしれません。
また都道府県のIDもズレている場合、お好みで変更ください。
ZIPコードで情報を取得するとより正確な天気予報となるそうです。

下記のコードを実行するとこんな感じになります。

ソースコードはこんな感じになります。

<?php
class Openweathermap_api{
    public $url = "https://api.openweathermap.org/data/2.5/weather?id=";
    public $appid = "apikey";
    public $ken ="";
    public $response ="";
    public $icon = array(
        "01d"=>"?",
        "02d"=>"?",
        "03d"=>"?",
        "04d"=>"?",//?
        "09d"=>"?",
        "010d"=>"?",
        "011d"=>"?",
        "013d"=>"?",
        "050d"=>"?",
    );
    function __construct()
    {
        $this->ken = (object)(json_decode(@file_get_contents("ken.json"),true));
    }
    function api(){
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $this->url);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        $this->response =  (object)json_decode(curl_exec($ch),true);
        curl_close($ch);
    }
}
$tenki = New Openweathermap_api();
$tenki->url = "https://api.openweathermap.org/data/2.5/weather?id=".$tenki->ken->kochi["id"]."&appid=".$tenki->appid;
$tenki->api();
print($tenki->icon[str_replace("n","d",$tenki->response->weather[0]["icon"])]);
var_dump($tenki->response);
{
    "hokkaido": {
        "id": "2130037",
        "kenmei": "北海道",
        "kenfurigana": "ほっかいどう"
    },
    "aomori": {
        "id": "2130656",
        "kenmei": "青森県",
        "kenfurigana": "あおもり"
    },
    "iwate": {
        "id": "2112518",
        "kenmei": "岩手県",
        "kenfurigana": "いわて"
    },
    "miyagi": {
        "id": "2111888",
        "kenmei": "宮城県",
        "kenfurigana": "みやぎ"
    },
    "akita": {
        "id": "2113124",
        "kenmei": "秋田県",
        "kenfurigana": "あきた"
    },
    "yamagata": {
        "id": "2110554",
        "kenmei": "山形県",
        "kenfurigana": "やまがた"
    },
    "fukushima": {
        "id": "2112923",
        "kenmei": "福島県",
        "kenfurigana": "ふくしま"
    },
    "ibaraki": {
        "id": "2112669",
        "kenmei": "茨城県",
        "kenfurigana": "いばらき"
    },
    "tochigi": {
        "id": "1850310",
        "kenmei": "栃木県",
        "kenfurigana": "とちぎ"
    },
    "gunma": {
        "id": "1863501",
        "kenmei": "群馬県",
        "kenfurigana": "ぐんま"
    },
    "saitama": {
        "id": "1853226",
        "kenmei": "埼玉県",
        "kenfurigana": "さいたま"
    },
    "chiba": {
        "id": "2113014",
        "kenmei": "千葉県",
        "kenfurigana": "ちば"
    },
    "tokyo": {
        "id": "1850144",
        "kenmei": "東京都",
        "kenfurigana": "とうきょう"
    },
    "kanagawa": {
        "id": "1860291",
        "kenmei": "神奈川県",
        "kenfurigana": "かながわ"
    },
    "niigata": {
        "id": "1855429",
        "kenmei": "新潟県",
        "kenfurigana": "にいがた"
    },
    "toyama": {
        "id": "1849872",
        "kenmei": "富山県",
        "kenfurigana": "とやま"
    },
    "ishikawa": {
        "id": "1861387",
        "kenmei": "石川県",
        "kenfurigana": "いしかわ"
    },
    "fukui": {
        "id": "1863983",
        "kenmei": "福井県",
        "kenfurigana": "ふくい"
    },
    "yamanashi": {
        "id": "1848649",
        "kenmei": "山梨県",
        "kenfurigana": "やまなし"
    },
    "nagano": {
        "id": "1856210",
        "kenmei": "長野県",
        "kenfurigana": "ながの"
    },
    "gifu": {
        "id": "1863640",
        "kenmei": "岐阜県",
        "kenfurigana": "ぎふ"
    },
    "shizuoka": {
        "id": "1851715",
        "kenmei": "静岡県",
        "kenfurigana": "しずおか"
    },
    "aichi": {
        "id": "1865694",
        "kenmei": "愛知県",
        "kenfurigana": "あいち"
    },
    "mie": {
        "id": "1857352",
        "kenmei": "三重県",
        "kenfurigana": "みえ"
    },
    "shiga": {
        "id": "1852553",
        "kenmei": "滋賀県",
        "kenfurigana": "しが"
    },
    "kyoto": {
        "id": "1857907",
        "kenmei": "京都府",
        "kenfurigana": "きょうと"
    },
    "osaka": {
        "id": "1853909",
        "kenmei": "大阪府",
        "kenfurigana": "おおさか"
    },
    "hyogo": {
        "id": "1862047",
        "kenmei": "兵庫県",
        "kenfurigana": "ひょうご"
    },
    "nara": {
        "id": "1855608",
        "kenmei": "奈良県",
        "kenfurigana": "なら"
    },
    "wakayama": {
        "id": "1848938",
        "kenmei": "和歌山県",
        "kenfurigana": "わかやま"
    },
    "tottori": {
        "id": "1849890",
        "kenmei": "鳥取県",
        "kenfurigana": "とっとり"
    },
    "shimane": {
        "id": "1852442",
        "kenmei": "島根県",
        "kenfurigana": "しまね"
    },
    "okayama": {
        "id": "1854381",
        "kenmei": "岡山県",
        "kenfurigana": "おかやま"
    },
    "hiroshima": {
        "id": "1862413",
        "kenmei": "広島県",
        "kenfurigana": "ひろしま"
    },
    "yamaguchi": {
        "id": "1848681",
        "kenmei": "山口県",
        "kenfurigana": "やまぐち"
    },
    "tokushima": {
        "id": "1850157",
        "kenmei": "徳島県",
        "kenfurigana": "とくしま"
    },
    "kagawa": {
        "id": "1860834",
        "kenmei": "香川県",
        "kenfurigana": "かがわ"
    },
    "ehime": {
        "id": "1864226",
        "kenmei": "愛媛県",
        "kenfurigana": "えひめ"
    },
    "kochi": {
        "id": "1859133",
        "kenmei": "高知県",
        "kenfurigana": "こうち"
    },
    "fukuoka": {
        "id": "1863958",
        "kenmei": "福岡県",
        "kenfurigana": "ふくおか"
    },
    "saga": {
        "id": "1853303",
        "kenmei": "佐賀県",
        "kenfurigana": "さが"
    },
    "nagasaki": {
        "id": "1856156",
        "kenmei": "長崎県",
        "kenfurigana": "ながさき"
    },
    "kumamoto": {
        "id": "1858419",
        "kenmei": "熊本県",
        "kenfurigana": "くまもと"
    },
    "oita": {
        "id": "1854484",
        "kenmei": "大分県",
        "kenfurigana": "おおいた"
    },
    "miyazaki": {
        "id": "1856710",
        "kenmei": "宮崎県",
        "kenfurigana": "みやざき"
    },
    "kagoshima": {
        "id": "1860825",
        "kenmei": "鹿児島県",
        "kenfurigana": "かごしま"
    },
    "okinawa": {
        "id": "1854345",
        "kenmei": "沖縄県",
        "kenfurigana": "おきなわ"
    }
}

タグ

2.5, API, APIKEY, appid, class, data, ID, lt, Openweathermap, org, php, pub, public, quot, url, weather, zip, アカウント, アレ, お好み, コード, コピー, ご自由, ズレ, ソース, 下記, 予報, 余談, 作成, 使用, 取得, 可能, 合致, 場合, 変更, 天気, 実行, 情報, 感じ, 正確, 絵文字, 都道府県,

MYSQL8以降ウィンドウ関数対応=>ランキング。

2019.05.06

Logging

MYSQLでもランキング機能(rank())が使えるようになったとさ。日本国内のレンタルサーバーは最新の技術というより
一歩遅れた技術で運営している理由はリスクを取らないためにそうしているのだろうなとヒシヒシと感じます。

### support mysql>8.0.2 ウィンドウ関数
```sql
select id,namae, rank() over(order by code_total asc)as code_rank from code_data;
```
### code_data
|id|namae|code_total|
|---|---|---|
|1|kaonashi|15|
|2|mononoke|75|
|3|asitaka|52|
|4|san|87|
|5|theta|99|

タグ

```, ---, , 15, 2, , 4, 5, 52, 75, 8, 8.0.2, 87, 99, as, asc, asitaka, BY, Code, data, from, gt, ID, kaonashi, mononoke, MYSQL, namae, order, over, rank, san, select, SQL, support, theta, total, ウィンドウ, サーバー, ため, ランキング, リスク, レンタル, , 国内, 対応, 技術, 日本, 最新, 機能, 理由, 運営, 関数,

大量データをDBに高速にインストールする方法。

2019.04.13

Logging

LOAD DATA INFILE 'data.csv' INTO TABLE tblname FIELDS TERMINATED BY ',' LINES TERMINATED BY 'rn';

この一行の命令で…かなり高速にインストールできます。
インストールする前に、ファイルのチェックを行い整合性などが
正しければ一括にインストールするという具合がよろしいかと思われます。
 
https://www.youtube.com/watch?v=rrvL2-jqZ-4
ドロップシッピングの大量データを入れ込むときに役立ちそうだ・・・。
自分あまりSQLの事を知らないですね。そろそろSQLの知識も増やそうと
思っています。
 

タグ

-jqZ-, 2, 4, BY, com, CSV, data, db, FIELDS, INFILE, INTO, LINES, load, , nbsp, rrvL, SQL, TABLE, tblname, TERMINATED, youtube, インストール, かなり, シッピング, チェック, データ, とき, ドロップ, ファイル, 一括, 一行, , 具合, , 命令, 大量, 整合性, 方法, 知識, 自分, 高速,

DropFTPを配布。

2018.12.01

Logging

ドップして一つのファイルを転送するソフトを作りました。
こんなのどうしているのかと疑問を持つ人もいると思いますが
業務上、こんなソフトが要るという会社などもいるのではないかと
思いで作りました。
ダウンロードはこちらから
https://zip358.com/tool/DropFTP.zip
ソースコードは下記になります。
※FTP部分はWinSCPのライブラリを使用しています。

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
using WinSCP;
namespace dropFTP
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
        private void upbtn_Click(object sender, EventArgs e)
        {
            String err = "";
            if (hostText.Text == "") {
                err += "ホスト名が設定されていませんn";
            }
            if (idText.Text == "")
            {
                err += "IDが設定されていませんn";
            }
            if (passText.Text == "")
            {
                err += "passが設定されていませんn";
            }
            if (remText.Text == "")
            {
                err += "アップロード場所が設定されていませんn";
            }
            if (uplab.Text == "")
            {
                err += "アップロードファイルが設定されていませんn";
            }
            var RadioGroup = groupFTP.Controls.OfType<RadioButton>().SingleOrDefault(rb => rb.Checked == true);
            if (RadioGroup == null) {
                err += "アップロード環境が設定されていませんn";
            }
            if (err != "")
            {
                MessageBox.Show(err);
            }
            else {
                if (RadioGroup.Text == "FTP") {
                    upFTP();
                }
                if (RadioGroup.Text == "SFTP")
                {
                    upSFTP();
                }
            }
        }
            private int upFTP() {
            try
            {
                // Setup session options
                SessionOptions sessionOptions = new SessionOptions
                {
                    Protocol = Protocol.Ftp,
                    HostName = hostText.Text,
                    UserName = idText.Text,
                    Password = passText.Text,
                    PortNumber =int.Parse(portText.Text)
                };
                using (Session session = new Session())
                {
                    // Connect
                    session.Open(sessionOptions);
                    // Upload files
                    TransferOptions transferOptions = new TransferOptions();
                    transferOptions.TransferMode = TransferMode.Binary;
                    TransferOperationResult transferResult;
                    if (remText.Text.EndsWith("/"))
                    {
                        transferResult = session.PutFiles(@uplab.Text, remText.Text, false, transferOptions);
                    }
                    else
                    {
                        transferResult = session.PutFiles(@uplab.Text, remText.Text + "/", false, transferOptions);
                    }
                    // Throw on any error
                    transferResult.Check();
                    // Print results
                    foreach (TransferEventArgs transfer in transferResult.Transfers)
                    {
                        MessageBox.Show("アップロードしました");
                    }
                }
                return 0;
            }
            catch (Exception e)
            {
                MessageBox.Show("Error: {0}" + e);
                return 1;
            }
        }
        private int upSFTP()
            {
                try
                {
                    // Setup session options
                    SessionOptions sessionOptions = new SessionOptions
                    {
                        Protocol = Protocol.Sftp,
                        HostName = hostText.Text,
                        UserName = idText.Text,
                        Password = passText.Text,
                        PortNumber = int.Parse(portText.Text),
                        GiveUpSecurityAndAcceptAnySshHostKey = true
                    };
                using (Session session = new Session())
                {
                    // Connect
                    session.Open(sessionOptions);
                    // Upload files
                    TransferOptions transferOptions = new TransferOptions();
                    transferOptions.TransferMode = TransferMode.Binary;
                    TransferOperationResult transferResult;
                    if (remText.Text.EndsWith("/")) {
                        transferResult = session.PutFiles(@uplab.Text, remText.Text, false, transferOptions);
                    } else {
                        transferResult = session.PutFiles(@uplab.Text, remText.Text + "/", false, transferOptions);
                    }
                        // Throw on any error
                        transferResult.Check();
                        // Print results
                        foreach (TransferEventArgs transfer in transferResult.Transfers)
                        {
                        MessageBox.Show("アップロードしました");
                        }
                    }
                    return 0;
                }
                catch (Exception e)
                {
                    MessageBox.Show("Error: {0}" + e);
                    return 1;
                }
            }
            private void Form1_DragDrop(object sender, DragEventArgs e) {
            //e.Effect = DragDropEffects.Copy;
            string[] fileName = (string[])e.Data.GetData(DataFormats.FileDrop, false);
            uplab.Text = fileName[0];
        }
        private void Form1_DragEnter(object sender, DragEventArgs e)
        {
            e.Effect = DragDropEffects.Copy;
        }
        private void radioSFTP_CheckedChanged(object sender, EventArgs e)
        {
            portText.Text = "22";
        }
        private void radioFTP_CheckedChanged(object sender, EventArgs e)
        {
            portText.Text = "21";
        }
        private void Form1_Load(object sender, EventArgs e)
        {
            this.FormBorderStyle = FormBorderStyle.FixedSingle;
            this.MaximumSize = this.Size;
            this.MinimumSize = this.Size;
        }
    }
}

タグ

358, Collections, com, ComponentModel, data, Drawing, DropFTP, Forms, FTP, Generic, Linq, System, Tasks, Text, Threading, tool, using, Wi, Windows, WinSCP, zip, コード, こちら, ソース, ソフト, ダウンロード, ドップ, ファイル, ライブラリ, 一つ, 下記, , 会社, 使用, 業務, 疑問, 転送, 部分, 配布,

javascriptでテキストファイルやCSVファイルを読み込む方法。

2018.11.13

Logging

javascriptでテキストファイルやCSVファイルを読み込む方法は下記になります。
この他に、jqueryだとajaxを使用して読み込む方法などもありますが、あえて
javascriptで記述しています。

rt();
function rt(){
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open("GET","xxx.txt",true);
    xmlHttp.send(null);
    xmlHttp.onload = function(){
        var data = xmlHttp.responseText;
    }
}

追記:アクセス数が結構あるのでサンプルを作りました。
下記のコードをお試しください。
デモページはこちらになります。
https://zip358.com/tool/demo13/ 【改良前】
https://zip358.com/tool/demo13/index2.php 【ちょっと改良】
https://zip358.com/tool/demo13/index3.php 【もうちょっと改良】
https://zip358.com/tool/demo13/index4.php 【もっと改良】
https://zip358.com/tool/demo13/index5.php 【もっともっと改良】2022年度版


※文字の中にカンマ区切りがあるのには対応してません?

"use strict";
var csv = {
	load:async function(filename,id){
		await fetch(filename).then(data=>data.text()).then((res)=>{
			let result = (res.split("\r\n").map(value=>{
				return "<tr>" + (value.split(",").map(val =>{
					return "<td>" + val.slice(1, -1) + "</td>";
				})).join("") +"</tr>";
			})).join("");
			if(result){
				document.getElementById(id).innerHTML = result;
			}
		}).catch(m =>{
			console.error(m);
		});
		return true;
	}
}

csv.load("xxx.csv", "table");
"use strict";
var csv = {
	load:async function(filename,id){
		const res = await fetch(filename);
		const data1 = await res.text();
		let separate1 = /\r\n/;
		let separate2 = ",";
		let data_tbl = (data1.split(separate1)).map(function(value){
			return (value.split(separate2)).map(function(value1){
				return value1.slice(1, -1);
			});
		});
		var str = "";
		for (const key in data_tbl) {
			str+=`<tr>`;
			for (const key1 in data_tbl[key]) {
				str+=`<td>${data_tbl[key][key1]}</td>`;
			}
			str+=`</tr>`;
		}
		document.getElementById(id).innerHTML = str;
		return "OK";
	}
};

csv.load("xxx.csv", "table");
"use strict";
var csv = {
    load: function (filename, id) {
		fetch(filename).then(
			Response=>{
				return Response.text();
			}).then(data1 =>{
                let separate1 = /\r\n/;
                let separate2 = ",";
				let data_tbl = (data1.split(separate1)).map(function(value){
					return (value.split(separate2)).map(function(value1){
						return value1.slice(1, -1);
					});
				});
				var str = "";
				for (const key in data_tbl) {
					str+=`<tr>`;
					for (const key1 in data_tbl[key]) {
						str+=`<td>${data_tbl[key][key1]}</td>`;
					}
					str+=`</tr>`;
				}
				document.getElementById(id).innerHTML = str;
				return "OK";
			}).catch(error=>{
				console.log("失敗しました" + error);
			})
    }
};

csv.load("xxx.csv", "table");
"use strict";
var csv = {
    load: function (filename, id) {
        var xmlHttp = new XMLHttpRequest();
        xmlHttp.open("GET", filename, true);
        xmlHttp.send(null);
        xmlHttp.onload = function () {
            if (xmlHttp.status === 200) {
                let separate1 = /\r\n/;
                let separate2 = ",";
				let data1 = xmlHttp.responseText;
				let data_tbl = (data1.split(separate1)).map(function(value){
					return (value.split(separate2)).map(function(value1){
						return value1.slice(1, -1);
					});
				});
				var str = "";
				for (const key in data_tbl) {
					str+=`<tr>`;
					for (const key1 in data_tbl[key]) {
						str+=`<td>${data_tbl[key][key1]}</td>`;
					}
					str+=`</tr>`;
				}
				document.getElementById(id).innerHTML = str;
				
            }
        };
    }
};

csv.load("xxx.csv?123", "table");
"use strict";
var csv = {
    load: function (filename, id) {
        var data = {};
        var xmlHttp = new XMLHttpRequest();
        xmlHttp.open("GET", filename, true);
        xmlHttp.send(null);
        xmlHttp.onload = function () {
            if (xmlHttp.status === 200) {
                let separate1 = /\r\n/;
                let separate2 = ",";
                let data_org = xmlHttp.responseText;
                let data_en = data_org.split(separate1);
                for (let d in data_en) {
                    data[d] = data_en[d].split(separate2);
                }
                //data load
                var t = document.getElementById(id);
                var h = "<table>";
                for (var o in data) {
                    h += "<tr>";
                    for (var r in data[o]) {
                        h += "<td>";
                        h += data[o][r].slice(1, -1);
                        h += "</td>";
                    }
                    h += "</tr>";
                }
                h += "</table>";
                t.innerHTML = h;
            }
        };
    }
};
csv.load("xxx.csv", "table");

タグ

358, ajax, com, CSV, data, function, GET, https, javascript, jquery, new, null, onload, open, quot, responseText, rt, send, too, true, txt, var, xmlHttp, XMLHttpRequest, xxx, zip, アクセス, コード, こちら, サンプル, テキスト, デモ, ファイル, ページ, 下記, , 使用, 方法, 記述, 追記,

SSH.NETでSFTPとSSHの接続を確立させるまでの過程。

2016.12.11

Logging

SSH.NETでSFTPとSSHの接続を確立させるまでの過程。
ソースコードは下記です、あくまでも触りなのでココからご自分で考えて作り変えてください。ちなみにSSH.NETのライブラリを入手するには拡張機能からNuGet Package Managerという拡張機能を追加するとツールのNuGetパッケージマネージャーが現れるので、ソリューションのNuGetパッケージ管理からSSH.NETと検索しインストールすることによりライブラリが使用できます。

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
using System.IO;
using Renci.SshNet;
using Renci.SshNet.Common;
using Renci.SshNet.Sftp;
namespace ftp
{
    public partial class Form1 : Form
    {
        String Host = "168.192.11.1";
        int Port = 22;
        String RemoteFileDIR = "/root/";
        String LocalDestinationDIR = "C:\\Users\\hoge\\Documents\\BACKUP\\";
        String Username = "admin";
        String Password = "hogehoge";
        public Form1()
        {
            InitializeComponent();
        }
        private void button1_Click(object sender, EventArgs e)
        {
            ssh_cmd();
        }
        private void dl(string filename) {
            using (var sftp = new SftpClient(this.Host, this.Port, this.Username, this.Password))
            {
                sftp.Connect();
                using (var file = File.OpenWrite(this.LocalDestinationDIR + filename))
                {
                    sftp.DownloadFile(this.RemoteFileDIR + filename, file);
                }
                sftp.Disconnect();
            }
        }
        private void ssh_cmd() {
            SshClient ssh = new SshClient(this.Host, this.Username, this.Password);
            ssh.Connect();
            string command = "cd /root && ls";
            string[] str_result;
            string str_results;
            char ptn ='\n';
            int i =0;
            var result = ssh.RunCommand(command);
            //MessageBox.Show(result.Result);
            str_results = result.Result;
            str_result = str_results.Split(ptn);
            ssh.Disconnect();
            for ( i = 0; i < str_result.Length; i++) {
                //MessageBox.Show((str_result[i]));
                if (str_result[i] != "")
                {
                    dl(str_result[i]);
                }
            }
        }
    }
}

タグ

Collections, ComponentModel, data, Drawing, Generic, Linq, Manager, net, NuGet, Package, SFTP, SSH, System, Tasks, Text, Threading, using, インストール, コード, ココ, こと, ご自分, ソース, ソリューション, ツール, パッケージ, マネージャー, ライブラリ, 下記, 使用, 入手, 拡張, 接続, 検索, 機能, 確立, 管理, 追加, 過程,