Javascript DOM関連 メモ

・DOM、Node、Element

DOMは基本的なインターフェースの提供とツリー構造を作っている。

DOMを構成する単位がNodeで、Nodeは文字列やコメントなども含まれる。Nodeの中でタグの部分がElementと呼ばれる。

Elementは、階層でElement、HTMLElement、HTML*Element
のように継承しそれぞれインターフェースを持っている。

・型の調べ方

・タグ、要素

要素=<開始タグ 属性>内容<終了タグ>

・要素取得

HTML*Element = document.getElementById(id)
idで要素を取得

HTMLCollection = document.getElementsByTagName(name)
タグ名で要素を取得

HTMLCollection = document.getElementsByClassName(name)
classで要素を取得

NodeList = document.getElementsByName(name)
name属性で要素を取得

HTML*Element = document.querySelector(selectors)
CSSセレクターで要素(最初の1つ)を取得

NodeList = document.querySelectorAll(selectors)
CSSセレクターで要素(複数)を取得

・NodeListとHTMLCollection

NodeList: 取得後更新しない。
HTMLCollection: 取得後更新する。

for … of で回す

・要素取得(親子関係)

HTML*Element = el.parentNode
親要素

HTML*Element = el.firstElementChild
最初の子要素

HTML*Element = el.lastElementChild
最後の子要素

HTMLCollection = el.children
子要素リスト

HTML*Element = el.previousElementSibling
1つ前の要素

HTML*Element = el.nextElementSibling
1つ後の要素

・要素操作

HTML*Element = document.createElement(タグ)
指定タグで要素を作成

parentNode.insertBefore(newNode, referenceNode)
referenceNodeの前にnewNodeを追加

parentNode.appendChild(newNode)
最後にnewNodeを追加

parentNode.removeChild(childNode)
childNodeを削除

・内容操作

string = el.innerHTML
タグが解析される。

string = el.textContent / el.innerText
タグが解析されない。取得するとタグはなくなり、設定するとタグは文字列になる。

textContentと、innerTextの違い。
textContentは改行コードなどは維持され、innerText変換されるなどいくつかある。

・属性操作

string = el.getAttribute(name)
属性を取得

el.setAttribute(name, value)
属性を設定

el.removeAttribute(name)
属性を削除

bool = el.hasAttribute(name)
属性を持っているかどうか

・classList

string = el.className
classの確認

el.classList.add(name)
classの追加

el.classList.remove(name)
classの削除

el.classList.toggle(name)
classのOn/Off

bool = el.classList.contains(name)
class有無

課題ベースでの業務支援ツール作成 メモ

・なぜ課題ベースなのか。

課題なので完了が設定できる。課題が解決すれば完了。

べき論で進めてしまうと、なかなか完了しない。そもそもべき論を言い出した人に判断する能力がないことも多い。

・作業者、マネージャに困っていること(課題)を出してもらう。

ツールに求める機能とは聞かない。

・課題の振り分け

経営・管理レベルでの課題、作業レベルの課題に分ける。課題サイズと考えてもいい。

例えば、経営・管理レベルの課題では、
ある経営指標を導入したい。
作業レベルの課題では、
ある帳票の作成を自動化したい
など。

・プロジェクト化

経営・管理レベルの課題をプロジェクトとして管理する。

ひたすら小さな課題を解決することで改善活動としていいが、評価のタイミングが必要な場合などプロジェクト化する。

・作業レベルの課題をプロジェクトへ

プロジェクトを解決する中で一緒に解決できる作業レベルの課題を取り込む。

例えば、Aというプロジェクトではaという帳票を作り直す必要があり、aという帳票では作業レベルの課題があるので、その作業レベルの課題もこのプロジェクトで解決するという感じ。

・課題の分割

経営・管理レベルの課題、作業レベルの課題まとめて、1ヶ月程度の作業サイズに分割する。

内容 / 解決方法 / 完了条件 / 期日 / 作業者

例えば、ある指標の導入で半年程度の作業サイズなら、先ず、指標作成に必要なデータもとを確認する/2週間/Aさん担当のような感じ。

・課題の解決方法

業務フローの見直し、Webサービスの利用や機器の購入など手段を限定しない。

ただ、業務フローに手を出すためには、業務知識+関わる人との信頼関係がないと難しい。

PHP Vue.js MySQLから取得(JSON)+更新

PHP復習のため、
・PHPでのログイン+ログアウト
・Vue.jp→PHP→MySQLでの取得(JSON)+更新
を作成してみた。

config.php

index.php

json.php

login.php

logout.php

 

PHP ログイン処理

PHPほぼ忘れてしまったので勉強中。

 

PHP session メモ

セッションはクッキーと違いサーバーで値を管理し、識別用のPHPSESSIDのみクライアントに渡す。

***

・データがある場所

(1)ファイル(/var/lib/php/session)

session.gc_maxlifetimeを過ぎたあと、PHPにリクエストがあった場合、
(session.gc_probability / session.gc_divisor)の確率でGCが削除。

共有しているため違うアプリでGCが動くこともある。
必要なら、session.save_pathから個別に設定する。

(2)グローバル変数($_SESSION)

スクリプト終了時、ファイルに保存される。

(3)ブラウザクッキー(PHPSESSID)

ブラウザ閉じるまで保存される。

・session_start()

session_start()すると、
(3)がなければ割り当てる。既に存在する場合は再開する。
(1)のデータを(2)に格納。

スクリプトが終了すると、
(2)のデータを(1)に格納

(1)はスクリプトが終了されるまでロックされる。
必要なら、session_write_close()

・グローバル変数

session_start()しなくても(2)を変数としては使えるが、(1)には保存されない。

test1php

test2.php

エラーにはならない。この場合session_start()
しても結果は同じなので分かりづらい。

test2.php

この場合Noticeがでる。

・データ破棄

$_SESSION = array();
(2)を削除

session_destroy()にて
(1)を削除。(session_start()していないと削除できない)

・session_regenerate_id()

(1)の古いファイルは残したまま、新しいファイルが作成される。
(2)そのまま使える。
(3)は新しくなる。

PHP MySQLデータをJSONで書き出し

PHP久しいので近いうち復習する。

 

MySQL ダンプデータから行単位の抜き出し

間違えて削除した行を復旧するため、ダンプのバックアップデータから特定の行を抜き出すことになった。

条件が簡単なら、mysqldumpだけでもできる。

必要ならダンプデータを別環境にインポートし、
mysqldump -t -u user –where “xxx = xxx” database_name table_name > dump.sql

そして、書き出したファイルをインポート。

***

今回は子テーブルも削除されていてSQLを使いたいので、新しいテーブルにデータをコピーしそのテーブルを書き出すことに。

・(必要なら)ダンプデータを別環境にインポート

・スキーマコピー
create table AA like A

・データコピー
insert into AA select * from A where exists (
select * from B where A.ID = B.ID);
このような感じ(AテーブルをAAテーブルに書き出す時、Bテーブルに特定の値が含まれているかどうか)

・データ書き出し
mysqldump -t -u user database_name tmp_tbl > dump.sql
(Workbenchなら、Server>DataExportから)

・書き出したファイルでテーブル名などを修正してインポート。

CentOS(ConoHa) 初期設定 LAMP

久しぶりにConoHaにてCentOSのインスタンスを作成。

コントロールパネル

インスタンス作成時、SSH Keyだけ作成し、その他はデフォルトのまま。

左側メニューのサーバー>インスタンスのネームタグ
クリックすると詳細が見れるので、IPアドレスを確認する。

公開鍵で、TeraTermとWinSCPで接続できるように設定する。

Ubuntu セキュリティ関連設定

Apache

インストールされているか
yum list installed | grep httpd

インストール
yum -y install httpd

状態
service httpd status

起動(初期設定ではスタートアップしない)
service httpd start
OR
systemctl start httpd

スタートアップ設定
systemctl enable httpd

パス
/var/www/html
/etc/httpd/conf/httpd.conf

ファイアーウォール設定
firewall-cmd –add-service=http –permanent
firewall-cmd –reload

PHP

・インストール

何が入っているか確認する場合。
yum list installed | grep php

PHP関連のパッケージを削除する場合。
yum remove php-*

個別で何が入るか。

yum -y install php
php.x86_64
php-cli.x86_64
php-common.x86_64
php-fpm.x86_64

yum -y install php-devel
php-devel.x86_64

yum -y install php-pdo
php-pdo.x86_64

yum -y install php-gd
php-gd.x86_64

yum -y install php-mbstring
php-mbstring.x86_64

yum -y install php-mysqlnd
php-mysqlnd.x86_64

yum install php-json
php-json.x86_64

実際は、
yum -y install php php-devel php-pdo php-gd php-mbstring php-mysqlnd
のようにする。

必要な場合下記等も追加。
php-xml.x86_64
php-xmlrpc.x86_64
php-pecl-mcrypt.x86_64
php-pecl-mysql.x86_64

・Apacheの再起動

systemctl restart httpd

MySQL

・MariaDBの削除
sudo yum remove mariadb-libs
sudo rm -rf /var/lib/mysql

・リポジトリの追加
sudo rpm -ivh http://dev.mysql.com/get/mysql57-community-release-el7-8.noarch.rpm

・MySQLのインストール
sudo yum install mysql-community-server

・バージョン確認
mysqld –version

・起動
sudo systemctl start mysqld.service

・自動起動
sudo systemctl enable mysqld.service

・rootのパスワード設定

pass=$(head /dev/urandom | tr -dc a-km-np-z2-9 | head -c 13); sudo mysql -u root -e “alter user root@localhost identified by ‘${pass}'”; echo $pass;

・文字コード変更

/etc/my.cnf
の中で以下のように修正。

[mysqld]
character-set-server = utf8
default_password_lifetime = 0

再起動
sudo systemctl restart mysqld.service

・MySQL Workbench

基本的に操作はWorkbenchから。

今回は外部にポート開けていないので、SSHポートフォワーディングで接続。

・Connection Method:Standard TCP/IP over SSH
・SSH Hostname:サーバーIPアドレス
・SSH User:root
・SSH Key File:鍵ファイル
・MySQL Hostname:127.0.0.1
・MySQL Server Port:3306
・Username:root
・Password:MySQLのrootパスワード

このような感じ。

WordPress

cd /var/www/html
sudo curl -LO http://ja.wordpress.org/latest-ja.tar.gz
sudo tar xzf latest-ja.tar.gz
sudo mv wordpress blog
cd blog
sudo cp wp-config-sample.php wp-config.php
sudo vim wp-config.php

以下を設定

define(‘DB_NAME’, ‘wpd’);
define(‘DB_USER’, ‘wpd_user’);
define(‘DB_PASSWORD’, ‘+6xya6=)RKn2+6xya6=)RKn2’);

apache用

sudo chown -R apache:apache /var/www/html/blog

最終処理

http://192.168.102.6/blog/wp-admin/install.php
にアクセス。

Visual Studio WebDeploy

今回はVPN環境で
サーバー:192.168.20.1
クライアント:192.168.20.3
となっている

サーバー側

・WebDeployをインストーラーから、完全でインストール

servermanager>管理>役割と機能の追加>役割ベースまたは機能ベースのインストール
IIS>管理ツール>管理サービス
IIS>Webサーバー>アプリケーション開発
ASP.NET 4.7
の2つインストールする。

inetmgr>サイトインスタンス(Default Web Site)右クリック>展開
・Web配置による発行の有効化

接続するためのURL
を保存しておく

inetmgr>サーバーインスタンス>管理サービス
・リモート接続を有効にする
・Windows資格情報のみ
・IPアドレスを指定(192.168.20.1)
を選択し、開始する。

firewall.cpl>詳細設定>受信の規則>新しい規則
ポート:8172/TCP
スコープ:192.168.20.0/24

クライアント側

インスタンス右クリック>発行>IIS>Web配置
を選択する。

・サーバー:https://192.168.20.1:8172/msdeploy.axd
(接続するためのURLのホスト部をVPNのIPアドレスに変更)

・サイト名:Default Web Site/app
(サーバー側と合わせる)

・ユーザー名、パスワードはWindowsユーザー

Windows ユーザー関連

ファイル名を指定して実行

・ユーザーアカウント
netplwiz
control userpasswords2

・ローカルユーザーとグループ
lusrmgr.msc

・ユーザーアカウント(コントロールパネル)
control userpasswords

コマンド

・ユーザーネーム確認
cmd>echo %username%
cmd>whoami

PowerShell

・ユーザー一覧
ps>Get-WmiObject Win32_UserAccount

・別ユーザーで実行
ps>Start-Process -FilePath ‘Powershell.exe’ -Credential ‘xxx’

コマンド(net user)

・ユーザー一覧
net user

・ユーザー情報
nset user xxx

・ユーザー追加 (ここではusrを追加)
net user usr /add

・パスワード設定
net user usr 1234

・ユーザー削除
net user usr /delete

・ゲストユーザーの有効化
net user guest / active:yes

コマンド(net localgroup)

・管理者グループ追加
net localgroup administrators usr /add

・グループ一覧
net localgroup

・グループの情報
net localgroup “xxx”

ビルトインアカウント

・SYSTEM
・LOCAL SERVICE
・NETWORK SERVICE

3つともビルトインアカウントで、OSがプロセスを起動するのに利用。
SYSTEMはAdministratorsグループと同等、残り2つはUsersグループと同等。

・ALL APPLICATION PACKAGES
・制限されたすべてのアプリケーションパッケージ

ストアアプリ(AppContainer)用のグループ。

・CREATOR OWNER

仮想ユーザであり、実際に作成したユーザーに対する権限を与える。

・TrustedInstaller

システムで重要なファイルを管理するためのグループ。

アクセス許可の継承

フォルダ右クリック>プロパティ>セキュリティ
グレーになっているチェックは上位フォルダからの継承。

基本的には上位フォルダの権限を継承していて、例えば別の場所で作成したフォルダでも移動すれば、移動先の権限が適用される。

フォルダ右クリック>プロパティ>セキュリティ>詳細設定>アクセス許可

・継承の無効化

上位フォルダから継承しているアクセス許可を削除する。全てのアクセス許可を削除か、現在継承しているアクセス許可を変換して現在のオブジェクトに適用する。

・子オブジェクトのアクセス許可エントリすべてを …

チェックすると、現在の設定を下位フォルダに再度継承させる。
(常チェックされているわけではなくチェックしたときに1度実行する)