Photo by Markus Spiske on Pexels.com

デモ55ajax=jqueryを使わずに非同期通信するのが普通に。

2022.05.03

Logging

おはようございます。

祝日が始まりましたね、お休みの方も多いかと思います。

そんな中、連休からプログラミングの勉強を始めようと考えている方もいるかと思いましたので、フロントエンドエンジニアがバックエンドエンジニアとの連携で一番初めにぶち当たる壁である、非同期通信のコードを書きました。コードをコピペして階層など合わしてご自身の実行環境で実行してみてください。この頃ではフロントエンドエンジニアの方は非同期処理でコードを書いているので、非同期という言葉を聞くことも多くなったと思います。

非同期処理は処理の結果を待たずして次の処理を実行することです、非同期通信も同じです。バックエンド側に処理を問い合わせて処理の結果は待たずして行います。結果も順番に帰ってくる訳では無いのでフロント側で処理するときに注意も必要になります。

<!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>Document</title>
</head>

<body>
    <button id="api">非同期通信</button>
    <script>
        document.getElementById("api").addEventListener("click", api);

        function api() {
            let data = [];
            data.push({"name":"樹龍"});
            console.log(param(data));
            fetch("./api.php", {
                method: "POST",
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                },
                body:param(data)
            }).then(
                response => response.json()
            ).then(data => {
                console.log('data', data);
            }).catch(error => {
                console.log('error', error);
            });
        }
        function param(data){
            let str = [];
            for(key in data){
                for(keyname in data[key]){
                    str.push(keyname +"="+ encodeURIComponent(data[key][keyname]));
                }
            }
            return str.join("&");
        }
    </script>
</body>

</html>
<?php
$name = htmlspecialchars(strip_tags($_POST['name']));
$response['res'] = $name;
print json_encode($response);

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

55, ajax, DOCTYPE, gt, html, jquery, lang, lt, quot, エンジニア, エンド, お休み, コード, こと, コピペ, ご自身, デモ, とき, バック, プログラミング, フロント, , 処理, 勉強, 同期, , 実行, 必要, , 普通, , 注意, 環境, 祝日, 結果, 言葉, , 通信, 連休, 連携, 階層, , 順番,

Photo by luis gomes on Pexels.com

JSのPromiseとawaitってこういう事なんだよね。理解した!!( ・ิω・ิ)

2022.04.29

Logging

おはよう御座います。

この頃、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

OFUSEで応援を送る

タグ

, async, await, console, const, gt, javascript, JS, log, main, new, NEXT, Promise, quo, quot, react, resolve, return, strict, use, vue, なん, なんか, ネイティブ, フレームワーク, まえ, , , 人気, 何処, 勉強, 基礎, , 有利, 機会, 活動, 理解, 転職, ,

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

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);
    }
}

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

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

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

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

tailwind-cssで画面中央に表示するクラスはこれ、中央表示でググっても。

2022.02.08

Logging

この頃、Bootstrapからtailwind-cssに変えようと奮闘中で勉強中です。そんな中でググっても中々ヒットしなかった事を紹介します。

tailwind-cssで画面中央に表示する方法を中央表示でググっても画面中央表示がヒットしなかったのは、少しやっかいだなって思いました。何でも検索出来るGさんですが、何度か自分はNot Foundページを見たことがあります。つい最近のNot Foundページは、こんな感じ釣り堀?で釣りをしている宇宙人さんみたいなが表示されます、そしてちょっとした操作が出来ます😌。

引用:Googleページ

脱線した話をもとに戻して…tailwind-cssで画面中央に表示したい場合は、このクラスを付与すると良いですよ😏。

<div class="h-screen w-screen flex justify-center items-center">
    <p>center</p>
</div>

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

Bootstrap, center&lt, div class, div&gt, gt, Gさん, h-screen w, justify-center items-center&quot, lt, Not Foundページ, p&gt, quot, screen flex, tailwind-css, クラス, もと, 奮闘中, 感じ釣り堀, 操作, 画面中央,

コード書き初め、そろそろネタが尽きてきたよ「始め」!?

2022.01.03

Logging

コード書き初めは何が良いのかなぁなどと考えておりましたが、やはりこれかなっていう事で文字のグラデーションを徐々に変えてい行くものを作ってみました。IEとかでは動きませんが、最新のChromeやFirefox、エッジなどでは動くかなと思います。ソースコードを写景してみて、コードの動きがわかればソースコードを変更していろいろと試してみてください。

Rewind 2021 – Love of the Code

動作はこちらから確認くださいませ。

https://zip358.com/tool/demo51/

尚、このコードは2021年の12月28日に書いたものになります。

<!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.4/css/all.min.css">
<title>Happy New Year 2022</title>
<style>
    body{
        background-color: black;
    }
    #HNY{
        font-weight: bold;
        font-size: 222px;
    }
</style>
</head>
<body>
    <h1 id='HNY'>Happy New Year 2022</h1>
<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>
<script>
    let color1 =["40","E0","D0"];
    let color2 =["FF","8C","00"];
    let color3 =["FF","00","80"];
    let postion =[2,0,1];
    setInterval(() => {
        if((parseInt(color1[postion[0]],16) + 1)<255){
            color1[postion[0]] = (parseInt(color1[postion[0]],16) + 1).toString(16);
        }else{
            color1[postion[0]] = (100).toString(16);
            postion[0]--;
        }
        if((parseInt(color2[postion[1]],16) + 1)<255){
            color2[postion[1]] = (parseInt(color2[postion[1]],16) + 1).toString(16);
        }else{
            color2[postion[1]] = (50).toString(16);
            postion[1]--;
        }
        if((parseInt(color3[postion[2]],16) + 1)<255){
            color3[postion[2]] = (parseInt(color3[postion[2]],16) + 1).toString(16);
        }else{
            color3[postion[2]] = (80).toString(16);
            postion[2]--;
        }
        
        for(key in postion){
            if(postion[key]<=-1){
                postion[key] = 2;
            }
        }
        //console.log(`#${color1.join("")}, #${color2.join("")}, #${color3.join("")}`);
        document.getElementById('HNY').style = `
        color: #FF8C00;
  background: -webkit-linear-gradient(0deg, #${color1.join("")}, #${color2.join("")}, #${color3.join("")});
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
        `;    
    }, 70);
</script>
</body>
</html>

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

12, 2021, 28, 8, cGLonkCQ, charset, Chrome, com, D-, DOCTYPE, Firefox, gt, head, html, https, IE, ja, lang, lt, meta, name, quot, UTF-, viewport, watch, www, youtube, いろいろ, エッジ, グラデーション, コード, こちら, これ, ソース, ネタ, もの, , , , 動作, 変更, 文字, , 書き初め, 最新, 確認,

ReactNativeのボタンがiosとAndroidでは挙動が違うので代替。

2021.11.18

Logging

今日はReactNative(リアクトネイティブ)でアプリを制作しながら勉強している中で、ボタンを使ってみたら・・・iosとAndroidでは挙動というか見栄えが違うのですよ、ドキュメントにもそう書いていた?。なので、ボタンじゃなくてこちらを使用するほうが良さげです。

Color of the text (iOS), or background color of the button (Android).

こちら【TouchableOpacity】などを使用してボタンを作成しないといけないみたい。こちらで作るとios、Android同じ見栄え(デザイン)になります。作ってて思うことは師というかメンターがいればもっと効率的に開発できそうです。

師匠がほしい今日此頃・・・。

React Native Tutorial #8 – Touchable Components

以上、現場からでした。

import React, { useState } from "react";
import { StyleSheet, Text, TouchableOpacity, View } from "react-native";

const App = () => {
  const [count, setCount] = useState(0);
  const onPress = () => setCount(prevCount => prevCount + 1);

  return (
    <View style={styles.container}>
      <View style={styles.countContainer}>
        <Text>Count: {count}</Text>
      </View>
      <TouchableOpacity
        style={styles.button}
        onPress={onPress}
      >
        <Text>Press Here</Text>
      </TouchableOpacity>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    paddingHorizontal: 10
  },
  button: {
    alignItems: "center",
    backgroundColor: "#DDDDDD",
    padding: 10
  },
  countContainer: {
    alignItems: "center",
    padding: 10
  }
});

export default App;

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

Android, background, button, color, from, import, iOS, of, OR, quot, react, ReactNative, Text, The, TouchableOpacity, useState, アプリ, こちら, こと, デザイン, ドキュメント, ネイティブ, ボタン, メンター, リアクト, , 今日, 今日此頃, 代替, 作成, 使用, 制作, 勉強, , 師匠, 挙動, 現場, 見栄え, 開発,

JavaScript(js)でcsvファイルを読み込み自動計算する(合計sum)

2021.11.17

Logging

謎の訪問者さんが検索窓を使用して何度かググっているので要望にお応えJavaScript(js)でcsvファイルを読み込み自動計算する(合計sum)というものを作りました。以前、csvを元にテーブルを作成するものを作っていました、ソースコードはそれを応用して作っています。実際、数万行に渡るファイルを自動計算するには、かなり爆速のパソコンが必要になります。このプログラムで耐えれるのは精々、1,000行あたりだと思います。

過去のコードと今回のサンプルデモのリンクを貼っときます。

どうぞご自由にお使いください。

https://zip358.com/tool/demo47/

"use strict";
var csv = {
	load:async function(filename,id){
		const responseFile = await fetch(filename);
        const result = await responseFile.text()
		let separate1 = /\r\n/;
		let separate2 = ",";
		let data = (result.split(separate1)).map(function(value){
			return (value.split(separate2)).map(function(value1){
				return value1;
			});
		});
		let sum =[];
		for (const usedata of data) {
            (usedata).map(function(val,index,array){
                sum[index] = (isNaN(parseInt(sum[index]))?0:parseInt(sum[index])) + parseInt(array[index]);
            });
		}
        console.log(sum);
		document.getElementById(id).innerHTML = sum.join(",");
		return "OK";
	}
};
csv.load("math.csv?", "sum");
JSでCSVファイルの和

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

000, , async, await, const, CSV, fetch, filename, function, ID, javascript, JS, load, quot, res, responseFile, strict, sum, use, var, お応え, かなり, コード, ご自由, サンプル, ソース, それ, テーブル, デモ, パソコン, ファイル, プログラム, もの, リンク, 今回, 以前, 何度か, 作成, 使用, , 合計, 実際, 必要, 応用, 数万, 検索窓, 爆速, 精々, 自動, 要望, 計算, 訪問者, , 過去,

JS(javaScript)ファイルを動的に再読み込みする方法。

2021.10.13

Logging

今日は朝からメールで書類提出してクラウドワークスの仕事に何か良いものはないかなどを見ておりましたがありません?。

さて、JS(javaScript)ファイルを動的に再読み込みする方法のオリジナルコードを書きましたので、お裾分けします。前々の会社で JS(javaScript)ファイルを動的に再読み込みしないとJSが動作しないという何ともやるせない気持ちの仕様があり、その時は人様のコードを拝借して使っていましたが、今日はクラウドワークスなどの案件もないのでちゃちゃっと自分でコードを書きました?。同じように困っている方はご使用くださいな?

https://zip358.com/tool/demo67/

ちょっと愚痴?
そもそも前々の会社のオリジナルMVCはいろいろと欠陥だらけで且つ仕様書もない、何が正解なのかも教えてもらえない中、修正やらしていたので本当に大変でした。聞いても明確に答えてもらえないのは正直な所、大変です。後任にはちゃんと教えていたら良いのですがね。

"use strict";
document.querySelector("button").addEventListener("click",jsandcssreload);
function jsandcssreload(){
    let d = (new Date()).getTime();
    [...document.querySelectorAll("link")].forEach((elm)=>{
        elm.href = elm.href.replace(/(\.css)\??[0-9]{0,}$/,".css?" + d);
    });
    [...document.querySelectorAll("script")].forEach((elm)=>{
        elm.src = elm.src.replace(/(\.js)\??[0-9]{0,}$/,".js?" + d);
    });    
}

上手く行かなかった場合の対応.

[...document.querySelectorAll('script')].forEach(elm => {
        let script = document.createElement('script');
        script.src = elm.src;
        document.body.appendChild(script);   
});

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

'src', addEventListener, createElement, css, document.querySelector, document.querySelectorAll, elm, foreach, getTime, gt, href, javascript, jsandcssreload, quot, quot;button&quot, quot;use, script, src.replace, strict&quot, 後任,

ブラウザに画像をドロップして表示させる部分的な処理(javascript)。これを使って?

2021.10.07

Logging

本日はブログを更新するのがいつもよりかなり遅めです?、2000記事を超えてからネタが尽きているようにも思いますが、何とか毎日更新出来ています。ネタが尽きたら少し充電しようかなと思います。

ブラウザに画像をドロップして表示させる部分的な処理(javascript)

さて、ブラウザに画像をドロップして表示させる部分的な処理(javascript)を作りました。これらを使ってちょっとしたサービスを作っています。まだ完成はしていませんが完成できたらこちらで紹介しようと思っています。尚、部分的な処理なのでドロップしても画像をサーバーに保存させたりすることはないです。

ソースコードはこちらになります。

全体のソースコードはこちらにアクセスしてブラウザのデバッグ機能で見ることが出来ます。
https://zip358.com/tool/demo43/

        var obj_input = document.createElement("input");
        obj_input.type = "file";
        obj_input.accept = "image/png,image/jpeg";
        var element = document.getElementById("dropArea");
        element.addEventListener("dragover", function(e) {
            e.preventDefault();
            this.classList.add("dragover");
        });
        element.addEventListener("dragleave", function(e) {
            e.preventDefault();
            this.classList.remove("dragover");
        });
        element.addEventListener("drop", function(e) {
            e.preventDefault();
            element.classList.remove("dragover");
            if (/\.((png)|(jpeg)|(jpg))/i.test(e.dataTransfer.files[0].name) === true) {
                var obj = element;
                obj.innerHTML = e.dataTransfer.files[0].name;
                var imgfiles = e.dataTransfer.files;
                obj_input.files = imgfiles;
                var fr = new FileReader();
                fr.readAsDataURL(obj_input.files[0]);
                fr.onload = function() {
                    obj.style.backgroundImage = "url(" + fr.result + ")";
                    obj.style.backgroundSize = "cover";
                };
            }
        });

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

2000, createElement, document, inp, input, javascript, obj, quot, var, アクセス, かなり, コード, こちら, こと, これ, これら, サーバー, サービス, ソース, デバッグ, ドロップ, ネタ, ブラウザ, ブログ, 保存, 充電, 全体, 処理, 完成, 少し, 更新, 本日, 機能, 毎日, 画像, 紹介, 表示, 記事,

数珠繋ぎにTweet(リプライ)するPHP言語のコードは意外にも簡単。

2021.08.28

Logging

先日、高知県はコロナ感染症が111人になったそうです。早くコロナワクチン接種?2回目を打ちたいです、ただファイザー社のワクチンなのでデルタ株のウィルスは軽症化させるだけで無症状や感染しないようにはならないという事です。それでも重症化を防げるので打たないより打った方が良いですね?。なお、混合ワクチン接種が結構無敵だとか?インドではDNAワクチン接種を世界初で承認したみたいですね。新たな変異種も防ぐことが出来れば一気にDNAワクチン接種が世界的に進みそうです。

さて、前置きはここまでとして、数珠繋ぎにTweet(リプライ)するPHP言語のコードは意外にも簡単に書けました、なお、TwitterOAuthというライブラリを使用して呟いています。

作った経緯は数珠繋ぎにする方法などは調べてもヒットしなかったので記載しようと思ったわけです。今回の方法でアファリエイトなどを紹介などや長文のツイートが行えるなどいろいろな用途に使えるかと思います。

※このソースコードはコマンドライン(CUI)から叩かないと(実行)、動かない仕様になっています。

<?php
require_once("../vendor/autoload.php");
use Abraham\TwitterOAuth\TwitterOAuth;
if ($argv[0]) {
    require_once "./tw-config.php";
    $connection = new TwitterOAuth(CONSUMER_KEY, CONSUMER_SECRET, ACCESS_TOKEN, ACCESS_TOKEN_SECRET);
    date_default_timezone_set('Asia/Tokyo');
    $affiliate = json_decode(file_get_contents("./affiliate.json"));
    $id = null;
    foreach ($affiliate->{date("w")} as $key=>$val) {
        $str = $id?array("status"=>$affiliate->{date("w")}[$key]->txt,"in_reply_to_status_id"=>$id):array("status"=>$affiliate->{date("w")}[$key]->txt);
        $res = $connection->post("statuses/update",$str);
        $id = $res->id;
    }
}
{
    "0": [
        {
            "txt": ""
        },
        {
            "txt": "2"
        },
        {
            "txt": "3"
        }
    ],
    "1": [
        {
            "txt": "1"
        },
        {
            "txt": "2"
        },
        {
            "txt": "3"
        }
    ],
    "2": [
        {
            "txt": "1"
        },
        {
            "txt": "2"
        },
        {
            "txt": "3"
        }
    ],
    "3": [
        {
            "txt": "1"
        },
        {
            "txt": "2"
        },
        {
            "txt": "3"
        }
    ],
    "4": [
        {
            "txt": "1"
        },
        {
            "txt": "2"
        },
        {
            "txt": "3"
        }
    ],
    "5": [
        {
            "txt": "1"
        },
        {
            "txt": "2"
        },
        {
            "txt": "3"
        }
    ],
    "6": [
        {
            "txt": "1"
        },
        {
            "txt": "2"
        },
        {
            "txt": "3"
        }
    ]
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

$affiliate, argv, Asia, connection, CUI, date, foreach, gt, json_decode, lt, null, php require_once, quot, TwitterOAuth, txt, use AbrahamTwitterOAuthTwitterOAuth, val, vendor, アファリエイト, コマンドライン,

androidアプリをはじめて申請しました。リリースされるかは?

2021.07.21

Logging

高知県も梅雨明け宣言したころだと思います、そんな事を考えながら雷の音を聞きながらこの記事を書いています。
この記事が公開された時にはandroidアプリがリリースされている頃だと思います。
この記事はアンドロイドアプリ(Flutterアプリ)を作ったときに戸惑ったところなどを本人しかわからない形で箇条書きにしたものです。他人が見てもわかるようには書いていません。

尚、参考にしたサイトはこちらになります。
https://passe-de-mode.uedasoft.com/ja/tips/software/device/flutter/flutter04.htm

flutter_icons:
  android: true
  ios: true
  image_path: "lib/assets/icon.png.webp"
flutter pub get
flutter pub run flutter_launcher_icons:main
keytool -genkey -v -keystore C:\android\jks\key.jks -storetype JKS -keyalg RSA -keysize 2048 -validity 10000 -alias key
    signingConfigs {
        release {
            storeFile file("C:\\android\\jks\\key.jks")
            storePassword "Password"
            keyAlias "key"
            keyPassword "Password"
        }
    }
    buildTypes {
        release {
            // TODO: Add your own signing config for the release build.
            // Signing with the debug keys for now, so `flutter run --release` works.
            signingConfig signingConfigs.release
        }
    }
flutter build appbundle

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

04, Android, assets, com, device, fl, flutter, GET, htm, https, icon, icons, image, iOS, ja, lib, passe-de-mode, path, png, pub, quot, run, software, tips, true, uedasoft, アプリ, アンドロイド, こちら, ころ, サイト, とき, ところ, もの, リリース, , 他人, 公開, 参考, 宣言, , , 本人, 梅雨明け, 申請, 箇条書き, 記事, , , , 高知県,

アンフォローが多発しているのでアンフォローした人には自動でお礼コメントする。

2021.07.15

Logging

アンフォローが多発しているのでアンフォローした人には自動でお礼コメントするようにプログラミングコードを書いて五分間で処理を実行するようにcrontabに設定しました。ソースコードの一部を記載しますのでご自分の環境に合わしてご自由にお使いくださいませ。尚、TwitterOAuthライブラリを使用しておりますが、ライブラリの導入などに関しては割愛しております。

何故、こんなコードを書いたのか余談。フォロワーさんが外れるのはあまり嬉しいことではないですよね。離れていく人を食い止めようとは思いませんが、最後のお礼コメントぐらい言わせてくださいなという考えの元、今回のお礼コメントをするPHPのコードを書きました。相変わらずソースコードにコメントはありません、悪しからず?。

尚、一回目は一部コメントアウトして実行ください?

<?php
require_once("../vendor/autoload.php");

use Abraham\TwitterOAuth\TwitterOAuth;

if ($argv[0]) {
    require_once "./tw-config.php";
    $f_data = @file_get_contents("followers.dat");
    $f_data = $f_data?explode(PHP_EOL,$f_data):[];     

    date_default_timezone_set('Asia/Tokyo');
    $connection = new TwitterOAuth(CONSUMER_KEY, CONSUMER_SECRET, ACCESS_TOKEN, ACCESS_TOKEN_SECRET);
    $response = $connection->get("followers/ids", array(
        'screen_name' => 'zip358com',
        'count'=>1000
    ));

    $unFolloewers = array_diff($f_data,$response->ids);
    $data = @implode(PHP_EOL,$response->ids);
    file_put_contents("followers.dat",$data);

    if($unFolloewers){
        foreach($unFolloewers as $key=>$val){
            $response = $connection->get("users/show", array(
                'user_id' =>$val
            ));
            $text = "@".$response->screen_name. " さん 今までフォローありがとうございました(¯―¯?)。{フォロー解除されました? ([atmark]zip358comより自動投稿)}";
            print $text;
            $connection->post("statuses/update", array("status" => $text . " \n"));
        }
    }
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

aut, crontab, lt, once, php, quot, require, TwitterOAuth, vendor, アウト, アン, お使い, お礼, コード, こと, コメント, ご自分, ソース, フォロー, フォロワー, プログラミング, ライブラリ, , 一部, , , 今回, 何故, 余談, 使用, , 処理, 割愛, 多発, 実行, 導入, 最後, 環境, 自動, 記載, 設定,

プログラムを始めるきっかけになったアルゴリズム。

2021.05.31

Logging

プログラムを始めるきっかけになったのは、高校時代にひょんなことから情報処理の部活を見学に行った事がきっかけになっている。動画にあるような『枠の中を動き回る円のアルゴリズムを作ってみよう』という事が部活の先輩から出題された事が自分がプログラミングするきっかけだった、案外それが自分にあった事で今まで続いている。

プログラムを始めるきっかけになったアルゴリズム。

不思議なもので数十年も独学や仕事でプログラミングするとは思っていなかった。最初はN88BASICなどでこのプログラミングを書いていた。最初はオブジェクト指向言語なんて知らなかったのだけど、いつしかオブジェクト指向でプログラミングを書くことが多くなっている。ソースコードは人により違うのでひとの書いたプログラミングは読みにくいなどと言われる事もあるけど、他人のソースコードを見ることは結構大事なことだと思います。何故か?

自分では思いつかないコードを知ることになったり技を知ることになるので、どんなコードでも勉強になりますよ。てな訳です。

https://zip358.com/tool/line-line/

	let x = [40,0,30];
	let y = [0,40,30];
	let xp = [5,5,5]; 
	let yp = [5,5,5];
	let color = ["rgba(255,0,255,0.8)","rgba(255,255,0,0.8)","rgba(0,0,255,0.8)"]
	let cn = function(element,color,bx,by){
		var context = element.getContext( "2d" ) ;
		context.beginPath () ;
		context.arc((bx), (by), 5, 0 * Math.PI / 180, 360 * Math.PI / 180, false ) ;
		context.fillStyle = color;
		context.fill() ;
		context.strokeStyle = "purple" ;
		context.lineWidth = 2 ;
		context.stroke();
	};
	setInterval(() => {
		for(a = 0 ;a < x.length;a++){
			let base = xy(a);
			cn(document.getElementById("c"),color[a],base[0],base[1]);
		}
	},1);
	// setInterval(()=>{
	// 	let element = document.getElementById("c");
	// 	var context = element.getContext( "2d" ) ;
	// 	context.clearRect(0, 0, context.canvas.clientWidth, context.canvas.clientHeight);
	// },500);

	function xy(a){
		xp[a] = x[a] > 490 || x[a] < 0 ?xp[a]*-1:xp[a];
		yp[a] = y[a] > 440 || y[a] < 0 ?yp[a]*-1:yp[a];
		x[a]=x[a]+xp[a];
		y[a]=y[a]+yp[a];
		return [x[a],y[a]];
	}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

base, bx, cn, context.arc, context.beginPath, context.clearRect, context.fill, context.fillStyle, context.lineWidth, context.stroke, context.strokeStyle, function, getElementById, Math.PI, quot, quot;rgba, setInterval, xp, xy, yp,

WEBスクレイピングで日経平均株価の値を取得するPHPプログラム

2021.05.26

Logging

WEBスクレイピング日経平均株価の値を取得するPHPプログラムです。下記のようなブログラムを応用してクラウドワークスなどの案件(データ取得の案件)を自分は請け負っています。現在のWEBスクレイピングの相場は1-5万円ぐらいです。PHP言語ではJSがOFFの状態をスクレイピングするのでJS(java script)が動作して表示されているものは取得できないのが難点です。そのような場合はPhantomJSを使用すると良いらしいですが、こちら開発が終了しているライブラリになります。

WEBスクレイピングで日経平均株価の値を取得するPHPプログラム

大手の企業はJSがOFFの状態でも表示できるように設計されている事が多いので大体のデータは取得可能です、例外として大手のショッピングサイト(ECサイト)では、JSをゴリゴリと使用している場合もあるのでスクレイピングする前にブラウザで見栄えの検証(java script OFFの状態)することをオススメします。

<?php
	//WEBスクレイピング
	$url = "https://stocks.finance.yahoo.co.jp/stocks/detail/?code=998407.O";
	$html = file_get_contents($url);
	$dom = new DOMDocument();
	$html = mb_convert_encoding($html, "HTML-ENTITIES", 'UTF-8');
	@$dom->loadHTML($html, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
	$xpath = new DOMXPath($dom);
	print $xpath->query("//*[@id=\"root\"]/main/div/div/div[1]/div[2]/div[1]/div[2]/div[2]/p[2]/span")->item(0)->textContent;

追記:スクレイピング先のコードが変わればデータは取得出来なくなりますので、ソースコードの変更が必要です。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

$dom-&gt, div, dom, gt, gt;textContent, HTML-ENTITIES&quot, item, loadHTML, lt, mb_convert_encoding, NODEFDTD, NOIMPLIED, PhantomJS, php, print, query, quot, quot;root, XPath, プログラム,

goo-labのひらがな化API雛形を作りました。

2021.05.17

Logging

goo-labひらがな化API雛形を作りましたので、お裾分けです。YOUTUBEで解説している事を抜粋して記載します、まずAPIとはアプリケーションプログラミングインターフェイスの略です。APIを簡単に解説するとAというデータを送るとAのデータを処理して何らかの結果を返却してくれるサービスを言います。

APIとは?|仕組みやどんなAPIあるのかなど、図解を使って3分でわかりやすく解説します

今回のひらがな化APIは漢字の文字をひらがな(カタカナ)に変換して返却してくれるサービスです。自分が作った部分はひらがな化APIのサーバにデータを送信して返却データをキャッチする部分になります。APIというのはどんなAPIも同じようなものですので、一度、理屈を分かってしまうと簡単なものです。

因みにディファインの部分を自分のAPIに変更してお使いください、尚、コマンドラインから実行するように設計しています。

<?php
define("APIKEY","xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx");

class Hieagana{
	public function main($str="漢字が混ざっている文章"){
		if(!$str){return false;}
		$headers = array(
			"Content-Type: application/x-www-form-urlencoded",
		);
		// app_id(必須項目)	アプリケーションID
		// request_id	リクエストID
		// 省略時は"labs.goo.ne.jp[タブ文字]リクエスト受付時刻[タブ文字]連番"となります。
		// sentence(必須項目)	解析対象テキスト
		// output_type (必須項目)	出力種別
		// hiragana(ひらがな化)、katakana(カタカナ化)のどちらかを指定してください。
		$params = [
			"app_id"=>APIKEY,
			"sentence"=>$str,
			"output_type"=>"hiragana"
		];

		$curl = curl_init("https://labs.goo.ne.jp/api/hiragana");
		curl_setopt($curl, CURLOPT_CUSTOMREQUEST, "POST");
		curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);
		curl_setopt($curl, CURLOPT_HTTPHEADER, $headers);
		curl_setopt($curl, CURLOPT_POSTFIELDS, http_build_query($params));
		curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE);  
		curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE);  
		curl_setopt($curl, CURLOPT_FOLLOWLOCATION, TRUE);
		
		$output =  (object)json_decode(curl_exec($curl));
		curl_close($curl);

		var_dump($output);

	}
}

if($argv[0]){
	(new Hieagana)->main($argv[1]);
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

$params, APIKEY, application, argv, array, decode, false, goo.ne.jp, headers, hiragana, katakana, labs, lt, object, php define, quot, VERIFYHOST, youtube, アプリケーションプログラミングインターフェイス, コマンドライン,

Proofreading(校正)というリクルートが開発したAPIを使って。

2021.04.27

Logging

Proofreading(校正)というリクルートが開発したAPIを使って、今まで投稿した記事に誤字がないかを判別してもらった。因みに1000文字を超える文章は対象にならないのでワードプレスで取得した記事を900文字程度で切って判断してもらうことにしています。誤字があった場合、1を最大値として値が渡されるので、その平均値を取ればその文章の誤字率が判定できる。今回は平均値を取らず、最大値を判断材料として文章をスコア化しました。一応、判断した値をCSVで出力するプログラムをちょこちょこと制作したので参考にして頂ければ幸いです。正直なところ、ProofreadingのAPIが制度が良いのか疑わしいものがあるがAPIを取り扱うのが始めてという人は勉強になると思います?。

AI・機械学習と創る未来 – A3RT

ソースコードはこちらになります。

<?php
require "../../wp-load.php";
global $wpdb;

$proofreading = function($text=""){
	$url = "https://api.a3rt.recruit-tech.co.jp/proofreading/v2/typo";

	$params = [
		'apikey' => '取得したAPIKEY',
		'sentence'=>"$text",
		'sensitivity'=>"high"
	];
	$curl = curl_init($url);
	curl_setopt($curl, CURLOPT_POST, TRUE);
	curl_setopt($curl, CURLOPT_POSTFIELDS, $params);
	curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
	curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
	$response = curl_exec($curl);
	curl_close($curl);
	$obj = (object)json_decode($response);
	$score = 100;
	if($obj->alerts){
		$max = 0;
		foreach($obj->alerts as $key=>$val){
			$max = $max<$val->score?$val->score:$max;
		}
		$score = 100 - ($max * 100);
	}
	return $score;
};

if($argv[0]){
	file_put_contents("blogscore.csv","");
	$query = "SELECT * FROM $wpdb->posts WHERE post_status = 'publish' and post_type = 'post'";
	$results = $wpdb->get_results( $wpdb->prepare($query));
	foreach($results as $row) {
	   $id = $row->ID;
	   $title = $row->post_title;
	   $score = $proofreading(mb_strimwidth(preg_replace("/[\r|\n]/","",strip_tags($row->post_content)),0,900,"…"));
	   $str = "'$id'".",'".$title."',"."'$score'";
	   print $str.PHP_EOL;
	   file_put_contents("blogscore.csv",mb_convert_encoding($str."\n","SJIS","UTF-8"),FILE_APPEND);
	}
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

, 1000, 900, API, CSV, lt, php, Proofreading, quot, require, wp-load, コード, こちら, こと, スコア, ソース, ところ, プレス, プログラム, もの, リクルート, ワード, , 今回, , 出力, 判別, 判定, 判断, 制作, 制度, 勉強, 参考, 取得, 場合, 対象, 平均, 投稿, 文章, 最大, 材料, 校正, 正直, 記事, 誤字, 開発,

Anglesharpというライブラリの話。

2021.03.13

Logging

久しぶりに技術的なお話の記事を書きます。AnglesharpというのはC#などでスクレイピングするときにスクレイピングを補助してくれるライブラリで結構人気のあるライブラリなるようです。スクレイピングするコードは下記のようになります。この書き方が至ってシンプルで書きやすいのではないかなと思っています。

http://anglesharp.github.io/

var Url = $"https://zip358.com/";
var querySelector = $"#index_post_list > li.clearfix.num1.type1 > div > h3";
var document = BrowsingContext.New(Configuration.Default.WithDefaultLoader()).OpenAsync(Url).Result;
var element = document.QuerySelector(querySelector);
Console.WriteLine($"blogtitle is {element.InnerHtml}");

このライブラリはとても良いのですが、一つ問題があります。スクレイピングするのですが・・・これjavascriptがOFFの状態でスクレイピングされるのですね。どうもこのコードではJSがONにはならないようですね。因みに自分はそのことを知っていなかったのでどハマリしました。大手の検索サイトなどはjavascriptがOFFの状態でも閲覧できるようになっている事を知りました、試しにブラウザをOFFの状態にしてみるとソースコードがかなり違っていてJSのONの状態とは情報が差異がある事が理解できると思います。

Anglesharpのコンフィグ設定(init)でエージェントなどを設定してあげると上手くJSがONの状態をスクレイピングすることが可能なのかもしれません。動画を見る限りではまだかもしれません・・・。

AngleSharp NET Headless Browsing

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

, , 358, anglesharp, BrowsingContext, clearfix, com, Configuration, default, div, document, element, gt, https, index, li, LIST, new, num, OpenAsync, POST, QueryS, querySelector, quot, result, type, url, var, WithDefaultLoader, zip, お話, コード, シンプル, スク, とき, ピング, ライブラリ, レイ, 下記, 久しぶり, 人気, 書き方, 補助, 記事, ,

全国各地のダム貯水率を可視化してみた。

2021.03.02

Logging

全国各地のダム貯水率を可視化してみた。以前、高知県のダムの貯水率を可視化した事を記事にしたのですが、意外にもある一部の人達に好評なので全国のダムファンのために、全国各地のダム貯水率を可視化してみましたよ。あまり好評だったら、取得してきているサーバーに負荷がかかるため、中止します。

なお、どこから取集してきているかというとダムの貯水状況 – 国土交通省からです、正直なところcsvデータ化して頂きたいなと思う人もいるのではないでしょうか?

追記 2021:この頃、ブロックされて私のHPから拾えなくなりました・・・。もしくはHTMLの構造が変わった可能性があります。

	[
		{
			"ken": "北海道道北", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0102/ipDamGaikyo_pc0102_pg1_fw0.html",
				"dam_name": ["愛別ダム", "西岡ダム", "有明ダム", "小平ダム", "岩尾内ダム", "サンルダム", "留萌ダム", "大雪ダム", "金山ダム", "忠別ダム"]
			}
		},
		{
			"ken": "北海道道東", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0103/ipDamGaikyo_pc0103_pg1_fw0.html",
				"dam_name": ["佐幌ダム", "庶路ダム", "鹿ノ子ダム", "十勝ダム", "屈足ダム", "札内川ダム", "糠平ダム", "元小屋ダム", "活込ダム", "仙美里ダム"]
			}
		},
		{
			"ken": "北海道道央", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0104/ipDamGaikyo_pc0104_pg1_fw0.html",
				"dam_name": ["美唄ダム", "栗山ダム", "徳富ダム", "当別ダム", "朝里ダム", "豊平峡ダム", "夕張シューパロダム", "滝里ダム", "漁川ダム", "定山渓ダム", "桂沢ダム", "芦別ダム"]
			}
		},
		{
			"ken": "北海道道南", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0105/ipDamGaikyo_pc0105_pg1_fw0.html",
				"dam_name": ["新中野ダム", "矢別ダム", "上ノ国ダム", "高見ダム", "様似ダム", "浦河ダム", "美利河ダム", "二風谷ダム", "厚幌ダム"]
			}
		},
		{
			"ken": "青森県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0201/ipDamGaikyo_pc0201_pg1_fw0.html",
				"dam_name": ["津軽ダム", "遠部ダム", "飯詰ダム", "浅瀬石川ダム", "久吉ダム", "相馬ダム(利水)", "世増ダム", "下湯ダム", "小泊ダム", "浅虫ダム", "清水目ダム(利水)", "川内ダム"]
			}
		},
		{
			"ken": "岩手県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0301/ipDamGaikyo_pc0301_pg1_fw0.html",
				"dam_name": ["四十四田ダム", "胆沢ダム", "早池峰ダム", "御所ダム", "綱取ダム", "入畑ダム", "湯田ダム", "遠野ダム", "遠野第二ダム", "田瀬ダム", "滝ダム", "鷹生ダム", "日向ダム", "綾里川ダム"]
			}
		},
		{
			"ken": "宮城県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0401/ipDamGaikyo_pc0401_pg1_fw0.html",
				"dam_name": ["鳴子ダム", "花山ダム", "長沼ダム", "上大沢ダム", "化女沼ダム", "小田ダム", "荒砥沢ダム", "栗駒ダム(利水)", "漆沢ダム", "宮床ダム", "南川ダム", "樽水ダム", "釜房ダム", "大倉ダム", "七ケ宿ダム", "七北田ダム", "惣の関ダム", "払川ダム"]
			}
		},
		{
			"ken": "秋田県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0501/ipDamGaikyo_pc0501_pg1_fw0.html",
				"dam_name": ["早口ダム", "山瀬ダム", "素波里ダム", "萩形ダム", "森吉ダム", "森吉山ダム", "砂子沢ダム", "旭川ダム", "鎧畑ダム", "玉川ダム", "皆瀬ダム", "板戸ダム", "岩見ダム", "大松川ダム", "協和ダム", "大内ダム"]
			}
		},
		{
			"ken": "山形県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0601/ipDamGaikyo_pc0601_pg1_fw0.html",
				"dam_name": ["長井ダム", "高坂ダム", "白水川ダム", "寒河江ダム", "木地山ダム", "田沢川ダム", "最上小国川流水型ダム", "留山川ダム", "蔵王ダム", "前川ダム", "神室ダム", "綱木川ダム", "白川ダム", "荒沢ダム", "月山ダム", "月光川ダム", "温海川ダム", "横川ダム"]
			}
		},
		{
			"ken": "福島県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0701/ipDamGaikyo_pc0701_pg1_fw0.html",
				"dam_name": ["摺上川ダム", "三春ダム", "堀川ダム", "真野ダム", "木戸ダム", "小玉ダム", "こまちダム", "高柴ダム", "四時ダム", "大川ダム", "新郷ダム(利水・東北電力)", "山郷ダム(利水・東北電力)", "上野尻ダム(利水・東北電力)", "片門ダム(利水・東北電力)", "奥只見ダム(利水・電源開発)", "田子倉ダム(利水・電源開発)", "本名ダム(利水・東北電力)", "滝ダム(利水・電源開発)", "大鳥ダム(利水・電源開発)", "上田ダム(利水・東北電力)", "宮下ダム(利水・東北電力)", "柳津ダム(利水・東北電力)", "只見ダム(電源開発)", "日中ダム", "東山ダム", "田島ダム"]
			}
		},
		{
			"ken": "栃木県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/0901/ipDamGaikyo_pc0901_pg1_fw0.html",
				"dam_name": ["塩原ダム", "寺山ダム", "西荒川ダム", "東荒川ダム", "川俣ダム", "川治ダム", "三河沢ダム", "中禅寺ダム", "五十里ダム", "湯西川ダム", "松田川ダム"]
			}
		},
		{
			"ken": "群馬県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1001/ipDamGaikyo_pc1001_pg1_fw0.html",
				"dam_name": ["四万川ダム", "矢木沢ダム", "藤原ダム", "草木ダム", "八ッ場ダム", "薗原ダム", "相俣ダム", "奈良俣ダム", "桐生川ダム", "塩沢ダム", "道平川ダム", "大仁田ダム", "坂本ダム", "霧積ダム"]
			}
		},
		{
			"ken": "埼玉県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1101/ipDamGaikyo_pc1101_pg1_fw0.html",
				"dam_name": ["渡良瀬遊水地", "下久保ダム", "二瀬ダム", "荒川第一調節池", "浦山ダム", "滝沢ダム", "有間ダム", "合角ダム"]
			}
		},
		{
			"ken": "千葉県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1201/ipDamGaikyo_pc1201_pg1_fw0.html",
				"dam_name": ["亀山ダム", "片倉ダム", "高滝ダム", "矢那川ダム"]
			}
		},
		{
			"ken": "神奈川県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1401/ipDamGaikyo_pc1401_pg1_fw0.html",
				"dam_name": ["城山ダム", "宮ヶ瀬ダム", "宮ヶ瀬副ダム", "三保ダム"]
			}
		},
		{
			"ken": "新潟県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1501/ipDamGaikyo_pc1501_pg1_fw0.html",
				"dam_name": ["大石ダム", "揚川ダム(利水・東北電力)", "豊実ダム(利水・東北電力)", "鹿瀬ダム(利水・東北電力)", "早出川ダム", "下条川ダム", "刈谷田川ダム", "笠堀ダム", "城川ダム", "破間川ダム", "広神ダム", "三国川ダム", "正善寺ダム", "三面ダム", "奥三面ダム", "胎内川ダム", "奥胎内ダム", "内の倉ダム", "加治川治水ダム", "鯖石川ダム", "久知川ダム", "新保川ダム", "大野川ダム", "柿崎川ダム", "大谷ダム"]
			}
		},
		{
			"ken": "富山県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1601/ipDamGaikyo_pc1601_pg1_fw0.html",
				"dam_name": ["宇奈月ダム", "室牧ダム", "熊野川ダム", "久婦須川ダム", "和田川ダム", "利賀川ダム", "境川ダム", "刀利ダム", "子撫川ダム", "城端ダム", "臼中ダム", "朝日小川ダム", "角川ダム", "上市川ダム", "上市川第2ダム", "白岩川ダム", "舟川ダム", "布施川ダム", "大谷ダム"]
			}
		},
		{
			"ken": "石川県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1701/ipDamGaikyo_pc1701_pg1_fw0.html",
				"dam_name": ["手取川ダム", "赤瀬ダム", "犀川ダム", "辰巳ダム", "内川ダム", "新内川ダム", "我谷ダム", "九谷ダム", "小屋ダム", "八ヶ川ダム"]
			}
		},
		{
			"ken": "長野県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2001/ipDamGaikyo_pc2001_pg1_fw0.html",
				"dam_name": ["浅川ダム", "大町ダム", "松川ダム", "片桐ダム", "小渋ダム", "美和ダム", "高遠ダム", "横川ダム", "味噌川ダム", "牧尾ダム(利水)"]
			}
		},
		{
			"ken": "岐阜県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2101/ipDamGaikyo_pc2101_pg1_fw0.html",
				"dam_name": ["丹生川ダム", "御母衣ダム(利水)", "小里川ダム", "丸山ダム", "中野方ダム", "阿木川ダム", "岩屋ダム", "大ヶ洞ダム", "横山ダム", "徳山ダム", "阿多岐ダム", "岩村ダム", "打上ダム(利水)"]
			}
		},
		{
			"ken": "静岡県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2201/ipDamGaikyo_pc2201_pg1_fw0.html",
				"dam_name": ["長島ダム", "佐久間ダム", "秋葉ダム", "船明ダム", "太田川ダム", "奥野ダム", "青野大師ダム"]
			}
		},
		{
			"ken": "愛知県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2301/ipDamGaikyo_pc2301_pg1_fw0.html",
				"dam_name": ["新豊根ダム", "宇連ダム", "矢作ダム", "木曽川大堰(利水)"]
			}
		},
		{
			"ken": "三重県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2401/ipDamGaikyo_pc2401_pg1_fw0.html",
				"dam_name": ["君ヶ野ダム", "蓮ダム", "宮川ダム", "三瀬谷ダム(発電)", "安濃ダム(利水)", "比奈知ダム(機構)", "滝川ダム", "青蓮寺ダム(機構)", "小森ダム(電発)"]
			}
		},
		{
			"ken": "福井県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/1801/ipDamGaikyo_pc1801_pg1_fw0.html",
				"dam_name": ["九頭竜ダム", "龍ヶ鼻ダム", "広野ダム", "二ツ屋分水堰", "永平寺ダム", "浄土寺川ダム", "浄土寺川ダム(貯砂ダム)", "笹生川ダム", "真名川ダム", "雲川ダム(利水)", "桝谷ダム", "河内川ダム", "大津呂ダム"]
			}
		},
		{
			"ken": "滋賀県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2501/ipDamGaikyo_pc2501_pg1_fw0.html",
				"dam_name": ["青土ダム", "日野川ダム", "永源寺ダム(利水)", "宇曽川ダム", "姉川ダム", "余呉湖", "石田川ダム", "天川ダム"]
			}
		},
		{
			"ken": "京都府", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2601/ipDamGaikyo_pc2601_pg1_fw0.html",
				"dam_name": ["和知ダム(利水)", "大野ダム", "日吉ダム(機構)", "天ヶ瀬ダム", "高山ダム(機構)", "畑川ダム"]
			}
		},
		{
			"ken": "大阪府", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2701/ipDamGaikyo_pc2701_pg1_fw0.html",
				"dam_name": ["箕面川ダム", "狭山池ダム", "滝畑ダム(利水)"]
			}
		},
		{
			"ken": "兵庫県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2801/ipDamGaikyo_pc2801_pg1_fw0.html",
				"dam_name": ["三宝ダム", "栗柄ダム", "一庫ダム(機構)", "大路ダム", "与布土ダム", "但東ダム", "権現ダム", "平荘ダム", "川代ダム", "大川瀬ダム", "呑吐ダム", "糀屋ダム", "みくまりダム", "安富ダム", "引原ダム", "青野ダム", "生野ダム", "菅生ダム", "安室ダム", "金出地ダム", "長谷ダム", "石井ダム", "天王ダム", "大日ダム", "分水堰", "牛内ダム", "成相ダム", "北富士ダム", "諭鶴羽ダム"]
			}
		},
		{
			"ken": "奈良県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/2901/ipDamGaikyo_pc2901_pg1_fw0.html",
				"dam_name": ["布目ダム(機構)", "室生ダム(機構)", "初瀬ダム", "大門ダム", "天理ダム", "白川ダム", "岩井川ダム", "大滝ダム", "猿谷ダム(利水)", "九尾ダム(利水)", "川迫ダム(利水)", "二津野ダム(電発)", "風屋ダム(電発)", "池原ダム(電発)", "坂本ダム(電発)"]
			}
		},
		{
			"ken": "和歌山県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3001/ipDamGaikyo_pc3001_pg1_fw0.html",
				"dam_name": ["七色ダム(電発)", "二川ダム", "椿山ダム", "七川ダム", "広川ダム", "切目川ダム"]
			}
		},
		{
			"ken": "鳥取県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3101/ipDamGaikyo_pc3101_pg1_fw0.html",
				"dam_name": ["殿ダム", "賀祥ダム", "菅沢ダム"]
			}
		},
		{
			"ken": "島根県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3201/ipDamGaikyo_pc3201_pg1_fw0.html",
				"dam_name": ["尾原ダム", "布部ダム", "山佐ダム", "志津見ダム", "八戸ダム", "大長見ダム", "御部ダム", "三瓶ダム", "浜田ダム", "第二浜田ダム", "益田川ダム", "嵯峨谷ダム", "笹倉ダム", "大峠ダム", "銚子ダム", "美田ダム", "清瀧ダム", "津田川ダム"]
			}
		},
		{
			"ken": "岡山県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3301/ipDamGaikyo_pc3301_pg1_fw0.html",
				"dam_name": ["苫田ダム", "八塔寺川ダム", "津川ダム", "旭川ダム", "湯原ダム", "竹谷ダム", "河平ダム", "鳴滝ダム", "河本ダム", "千屋ダム", "新成羽川ダム", "黒鳥ダム", "三室川ダム", "高瀬川ダム", "楢井ダム"]
			}
		},
		{
			"ken": "広島県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3401/ipDamGaikyo_pc3401_pg1_fw0.html",
				"dam_name": ["土師ダム", "灰塚ダム", "庄原ダム", "三川ダム", "八田原ダム", "野間川ダム", "四川ダム", "御調ダム", "山田川ダム", "温井ダム", "小瀬川ダム", "弥栄ダム", "福富ダム", "椋梨ダム", "魚切ダム", "梶毛ダム", "野呂川ダム", "仁賀ダム"]
			}
		},
		{
			"ken": "山口県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3501/ipDamGaikyo_pc3501_pg1_fw0.html",
				"dam_name": ["小瀬川ダム", "佐波川ダム", "島地川ダム", "阿武川ダム", "菅野ダム", "向道ダム", "御庄川ダム", "生見川ダム", "中山川ダム", "荒谷ダム", "一の坂ダム", "厚東川ダム", "木屋川ダム", "湯免ダム", "黒杭川ダム", "川上ダム", "末武川ダム", "今富ダム", "大坊ダム", "見島ダム", "屋代ダム", "真締川ダム"]
			}
		},
		{
			"ken": "徳島県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3601/ipDamGaikyo_pc3601_pg1_fw0.html",
				"dam_name": ["池田ダム(機構)", "宮川内ダム", "川口ダム(利水)", "長安口ダム", "正木ダム", "福井ダム"]
			}
		},
		{
			"ken": "香川県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3701/ipDamGaikyo_pc3701_pg1_fw0.html",
				"dam_name": ["内場ダム", "五名ダム", "大川ダム", "前山ダム", "長柄ダム", "府中ダム(利水)", "吉田ダム", "門入ダム", "五郷ダム", "粟井ダム", "粟地ダム", "殿川ダム", "千足ダム", "大内ダム", "田万ダム", "内海ダム"]
			}
		},
		{
			"ken": "愛媛県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3801/ipDamGaikyo_pc3801_pg1_fw0.html",
				"dam_name": ["柳瀬ダム", "新宮ダム(機構)", "富郷ダム(機構)", "銅山川ダム群", "石手川ダム", "野村ダム", "鹿野川ダム", "黒瀬ダム", "鹿森ダム", "玉川ダム", "台ダム", "須賀川ダム", "山財ダム"]
			}
		},
		{
			"ken": "高知県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/3901/ipDamGaikyo_pc3901_pg1_fw0.html",
				"dam_name": ["早明浦ダム(機構)", "永瀬ダム", "大渡ダム", "桐見ダム", "中筋川ダム", "横瀬川ダム", "鏡ダム", "坂本ダム", "鎌井谷ダム", "以布利川ダム"]
			}
		},
		{
			"ken": "福岡県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/4001/ipDamGaikyo_pc4001_pg1_fw0.html",
				"dam_name": ["犬鳴ダム", "力丸ダム", "福智山ダム", "陣屋ダム", "藤波ダム", "江川ダム", "小石原川ダム", "山神ダム", "寺内ダム", "日向神ダム", "油木ダム", "北谷ダム", "ます渕ダム", "鳴淵ダム", "南畑ダム", "瑞梅寺ダム", "猪野ダム", "牛頸ダム"]
			}
		},
		{
			"ken": "佐賀県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/4101/ipDamGaikyo_pc4101_pg1_fw0.html",
				"dam_name": ["平木場ダム", "厳木ダム", "本部ダム", "狩立・日ノ峯ダム", "伊岐佐ダム", "井手口ダム", "矢筈ダム", "嘉瀬川ダム", "都川内ダム", "有田ダム", "竜門ダム", "深浦ダム", "岩屋川内ダム", "横竹ダム", "中木庭ダム"]
			}
		},
		{
			"ken": "熊本県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/4301/ipDamGaikyo_pc4301_pg1_fw0.html",
				"dam_name": ["下筌ダム", "竜門ダム", "緑川ダム", "市房ダム", "石打ダム", "氷川ダム", "上津浦ダム", "亀川ダム", "路木ダム"]
			}
		},
		{
			"ken": "大分県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/4401/ipDamGaikyo_pc4401_pg1_fw0.html",
				"dam_name": ["耶馬溪ダム", "松原ダム", "大山ダム", "ななせダム", "野津ダム", "稲葉ダム", "黒沢ダム", "床木ダム", "安岐ダム", "行入ダム", "青江ダム"]
			}
		},
		{
			"ken": "宮崎県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/4501/ipDamGaikyo_pc4501_pg1_fw0.html",
				"dam_name": ["祝子ダム", "松尾ダム", "渡川ダム", "綾南ダム", "瓜田ダム", "岩瀬ダム", "綾北ダム", "田代八重ダム", "立花ダム", "長谷(補助)ダム", "広渡ダム", "日南ダム", "沖田ダム"]
			}
		},
		{
			"ken": "鹿児島県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/4601/ipDamGaikyo_pc4601_pg1_fw0.html",
				"dam_name": ["鶴田ダム", "川辺ダム", "西之谷ダム", "大和ダム"]
			}
		},
		{
			"ken": "沖縄県", "Children": {
				"url": "https://www.river.go.jp/kawabou/html/list/7/4701/ipDamGaikyo_pc4701_pg1_fw0.html",
				"dam_name": ["福地ダム", "新川ダム", "安波ダム", "普久川ダム", "辺野喜ダム", "漢那ダム", "羽地ダム", "倉敷ダム", "金武ダム", "座間味ダム", "金城ダム", "我喜屋ダム", "大保ダム", "儀間ダム"]
			}
		}
	]

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

2021, Children, CSV, go, HP, html, https, jp, kawabou, ken, lis, quot, river, url, www, サーバー, ダム, ため, データ, どこ, ところ, ファン, ブロック, 一部, 中止, , , 以前, 全国, 北海道, , 取得, 可能性, 可視, 各地, 国土交通省, 好評, 構造, 正直, 状況, , 記事, 負荷, 貯水, 追記, 道北, , 高知県,

asyncとawaitとthenの関係と使い道。

2021.01.27

Logging

asyncとawaitとthenの関係と使い道は?まず、関係性はこの3つでまぁ一つの役割を果たすと考えても良いかもしれません。どんな時に使うかは、例えば、innerHTMLに計算した値を渡したいとか…。いや違うな。同期処理として使うのが正解ですね。尚、asyncとawaitで同期処理とする。

ちなみにIE11では動かない処理なので氣をつけてご使用ください。今どき、IE11なんてと思うかもしれないけど、使っている人がいるから・・・。

document.getElementById("btn").addEventListener("click", async (e) => {
	test1();
	test2();
	test3();
	await test1();
	await test2();
	await test3();
});

function test1() {
	return new Promise(resolve => {
		setTimeout(() => {
			console.log("btn = 1");
			resolve('1');
		}, 3000);
	});
}
function test2() {
	return new Promise(resolve => {
		setTimeout(() => {
			console.log("btn = 2");
			resolve('2');
		}, 2000);
	});
}
async function test3() {
	return new Promise(resolve => {
		setTimeout(() => {
			console.log("btn = 3");
			resolve('3');
		}, 100);
	});
}

IE11を使っているパターン、例えば社長や上司がシニア世代だったりするとIE11をいまだに使っていたりする。そもそもWindows10にIE11がインストールされている時点で悪だ・・・と思う開発者もいるはずです。そろそろマイクロソフト、IE11なんてものを強制的に削除するようなバージョンアップをして戴きたいと思ってます。それぐらい問題だと。あと、IE11で引っかかったことがあります。新しいブラウザでは下記のコードをHTMLに記入すると察してくれてjsファイルを読み込んでくれるが、IE11は違うのだ。

<script src="./assets/js/common.js"></script>

これじゃ読み込んでくれない。厳密に書かないとファイルを読み込んでくださらない。やっぱ早くIE11の撲滅を願う。

<script type="text/javascript" src="./assets/js/common.js"></script>

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

'src', addEventListener, assets, async, asyncとawait, await, await test, common.js&quot, document.getElementById, gt, innerHTML, lt, quot, quot;btn, quot;text, resolve, setTimeout, then, 撲滅, ,

Yahoo japanサイトのコロナ情報リンク集です。好評に付きVer2。

2020.12.21

Logging

Yahoo japanサイトのコロナ情報リンク集です。好評に付きバージョン2を
作成しました。見た目はこんな感じです。県名をクリックするとYahoo!japanのコロナサイトの
画面が開きます(遷移します)。ほんとは、Yahoo!データをウェブスクレイピングしようと思ったのですが、別にそこまでする必要はないかなと思いとどまり、いまに至っています。
データは国もJSONで公開していますのでわざわざ作ることもないのですけど、自分が見やすいように、時間があれば改善していきます。

追記:時間があったので改善しました。

https://zip358.com/tool/COVID-19-japan/

var ken_json = {};
fetch("./assets/js/ken47.json").then(response => response.json()).then((data)=>{
	let ken = [];
	for (const key in data) {
		ken.push("<a href='#' onClick='c19(\"" + "https://hazard.yahoo.co.jp/article/covid19" + data[key].roman +"\")' onmouseover='c19_f(\"" + data[key].roman.toUpperCase() + "\",\"red\")'' onmouseout='c19_f(\"" + data[key].roman.toUpperCase() + "\",\"#fff\")'>" + data[key].name + "</a>");
	}
	document.getElementById("covid19-link-list").innerHTML = ken.join(",");
	for (const key in data) {
		document.getElementById(data[key].roman.toUpperCase()).setAttribute("fill","#fff");
	}
});

function c19(url){
	window.open(url,"_blank");
}
function c19_f(kenid,color){
	document.getElementById(kenid).setAttribute("fill",color);
}	
{
	"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"
	}
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

19, 2, 358, 47, assets, com, covid, fetch, gt, https, JAPAN, JS, json, ken, quot, response, then, tool, var, ver, www, Yahoo, zip, ウェブ, クリック, こと, コロナ, サイト, スク, そこ, データ, バージョン, ピング, ほんと, リンク集, レイ, わざわざ, 作成, 公開, , 好評, 必要, 情報, 感じ, 改善, 時間, 画面, 県名, 自分, 見た目, 追記, 遷移,

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"
	}
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

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, コード, こちら, コロナ, サイト, ソース, それ, まとめ, リンク, , 単位, 土方, 情報, , 配信,

物理的ルーターがIPv6だと。

2020.12.12

Logging

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

物理的ルーターがIPv6で通信しているとcomposerがインストール出来ず、エラーを出力することがある。(virtualBOXの話)今どき、IPv4ってどうなのかと思ったけど、そういう事らしいのでネットワーク設定から物理的ルーターの設定までIPv4に統一するべしです。VPSを使用している人はそこのところは問題ないとは思うものの、例えばAWSやGCPなどを使用している場合はそこも関係してくる場合があるかもしれないので、注意してください。

これが分からずに20分間、PHP.iniの設定やモジュールが足りないのかななど違うことで、探っていました。なんだか、サーバで同じ間違いをまた繰り返しそうなのでメモとして残しときます。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

-r, 0, 036, 07, , 1545, 228516, 27, , 37, 384, 39, 4, 4488, 46, 56153228907, 59, 6, 62, 63, 7, 756890, 76181, 885, , 9024, af, cbf, ce, com, composer-setup, copy, corrupt, echo, ee, else, EOL, fc, file, getcomposer, hash, https, if, installer, IPv, org, php, quot, sha, unlink, verified, ルーター,

Hallo worldの定番。

2020.12.11

Logging

<?php
print("Hello world");

「こんにちは世界」がコンピューター言語の参考書にもっとも記載されている言葉だと思います。誰がこれを始めたのか自分は知らないのですが、定番中の定番ともいえる言葉です。プログラマーなら誰しも知っているだろうなと思います。

いままで、プログラマーという職業は嫌煙されていましたが今でなりたい職業の中に入ってきました。これも時代の流れなのかもしれませんが実際、プログラマーってデジタル土方さんなんですよね。これは今でもそうだと思います、人がコードを入力して書いているわけですから・・・・。近い将来、人工知能が簡単なアルゴリズムなら書いてくれるとは思います。いまでも自らをコードを自己進化して成長する人工知能は存在します。

ただ、自己進化と口頭で言ったことからプログラムが出来る人工知能は未だ存在しません。ただ簡単なこと、例えばデザインをHTML化してくれるサービスは存在していて精度もなかなか良いです。またロゴを生成してくれる人工知能も存在していますが、やはりこれ以上の難しいことは人工知能は出来ません。

なので今後、20?30年はプログラマーという職業はなくならないと思っています。もっともらしい例を出すと電子書籍が登場しても本はなくならなかったという事です。今のところですけどね、遠い将来は消えているかもしれませんが。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

Hallo, Hello, html, lt, php, print, quot, world, アルゴリズム, いま, コード, こと, これ, コンピューター, サービス, デザイン, デジタル, プログラマー, プログラム, 世界, , , 人工, , 入力, 参考書, 口頭, 土方, 嫌煙, 存在, 定番, 実際, 将来, 成長, 時代, 未だ, 知能, 簡単, 職業, 自ら, 自分, 自己, 言葉, 言語, 記載, , 進化,

文字の置き換えはよく使うjavascript「吾輩は猫である。」

2020.12.06

Logging

文字の置き換えはよく使う。いろいろな参考書にも文字の置き換えは出てくる基本中の基本だ、そしてコレは結構使うことがある、とくに商品名を整理するときなど、連番に命名を置き換えるなどに使用することがある。EC系のシステム開発ではデーターベースへ製品名(product name)を登録するときなどによく使うのである?が、製品名や商品番号が整っていないのは、よくあることだ、だがしかしコレが中小企業の現実なのである。

この頃、再帰処理を使うことが少なくなってきて、何でも良いから再帰処理に当てはまる題材をじぶんに課すべきだと思う今日このごろです?

<p>吾輩は猫である、名前はまだない。</p>
<p>吾輩は猫である、名前はまだない。</p>
<button class="btn btn-primary" id="btn" type="button">名前はまだない?</button>
<script>
	document.getElementById("btn").addEventListener("click",(e)=>{
		var object= document.querySelectorAll("p");
		for (const key in object) {
			
			if (object.hasOwnProperty(key)) {
				const element = object[key];
				(element).innerText = (element).innerText.replace("名前はまだない。","名前は猫はちだ。");
			}
		}
	});
</script>

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

btn, btn-primary, button, class, EC, gt, ID, javascript, lt, name, product, quot, type, いろいろ, こと, コレ, システム, じぶん, データー, とき, ベース, 中小企業, 今日このごろ, 使用, 再帰, 処理, 参考書, 名前, 吾輩は猫である, 命名, 商品, 基本, 整理, 文字, 現実, 番号, 登録, , 製品, 連番, 開発, , 題材,

外部VPSサーバーからさくらレンタルサーバーのDBに接続する方法。

2020.12.04

Logging

外部VPSサーバーからさくらレンタルサーバーのDB(データベース)に接続する方法は下記のコードだけでは上手く動かない。だけど、tmpファイルを生成時にパーティションにu+xの権限を与えればこのコードは要件をみたします。因みにプロセスが残ったままになるので接続が終わったら、プロセスを削除してあげてください。なのでどのプロセスを削除する機能として追加しないと使えないかな?、時間があれば完成したコードをアップします。

なお、変数の初期値はご自身で入れてください。あとポート開放expectが入っていない場合はyumなどでインストールする必要もあります。

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

<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.5.2/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.0/css/all.min.css">
	<link rel="stylesheet" href="assets/css/style.css">
	<title>ssh sqli</title>
</head>

<body>
	<?php
	print ssh_sqli_connect();
	?>
	<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.5.2/js/bootstrap.min.js"></script>
</body>

</html>
<?php
function ssh_sqli_connect()
{
	global $dblink,$dbname,$sshuser, $sshhost, $sshpassword,$host,$sshport;
	$ret = null;
	$cmd = "#!/usr/bin/expect -f
set timeout 3
expect -c \"spawn ssh -f -N -L $sshport:$host:3306 $sshuser@$sshhost -oStrictHostKeyChecking=no
expect \\\"$sshuser@$sshhost's password:\\\"
send \\\"$sshpassword\\n\\\"
\"
";

	$tmpfname = tempnam(sys_get_temp_dir(), 'ssh');

	$handle = fopen($tmpfname, "w");
	fwrite($handle, $cmd);
   	shell_exec("sh $tmpfname");
	sleep(3);
	$dblink = db_connect();
	try{
		for($id = 1 ;$id<=99;$id++){
			$ret = $dblink->query("SELECT * FROM $dbname.X.xtbl where $dbname.X.xtbl.id=$id;");
			if ($cnt = (int) mysqli_num_rows($ret)) {
			  $row = mysqli_fetch_assoc($ret);
			  print ($row["id"].", ".$row["name"]);
			}
		}
	}catch(PDOException $e){
		echo "失敗: " . $e->getMessage() . "\n";
	}

	fclose($handle);
	unlink($tmpfname);

	db_close();
	return "未完成";
}

function db_connect()
{
	global $dblink, $host, $user, $password, $dbname,$sshport;
	try {
		$dblink = new  mysqli("127.0.0.1", "$user", $password, $dbname ,$sshport);
		//$dblink->set_charset("utf8");
		return $dblink;
	} catch (PDOException $e) {
		echo "接続失敗: " . $e->getMessage() . "\n";
	}
}

function db_close()
{
	global $dblink;
	$dblink->close();
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

8, charset, db, DOCTYPE, en, expect, gt, head, html, lang, lt, meta, name, quot, tmp, UTF-, vie, VPS, yum, アップ, インストール, コード, ご自身, サーバー, さくら, データベース, パーティション, ファイル, プロセス, ポート, まま, レンタル, 下記, 初期, 削除, 場合, 変数, 外部, 完成, 必要, 接続, 方法, 時間, 権限, 機能, 生成, 要件, 追加, 開放,