/// BANGBOO BLOG ///

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31

February 10, 2021

Python
おッPythonやるのか?

ファイル拡張子oppython.py デフォUTF-8、全部オブジェクト(list,dict,set等のミュータブルなら参照になる点に注意、必要ならcopy())
#コメント、ドキュメントストリング(三連引用符):"""そのまま表示""" print mymod.__doc__で見れる
変数型不要:p = 500 * num、でもキャストは必要、定数はない
文字繰り返し、キャスト:"文字列" * 4 + str(p) + "Hi\nお元気ですか?\nSee u"
raw文字列でescしない:print(r"インストール先は c:\\code\python\bin です")
 正規表現のrも同意 re_result = re.match('hel', r'hellow python, 123, end.' )
  if re_result: #None以外という意味で、Noneはいわゆるnull、Pythonにnullはない
文字数:len("東京都")→3
文字列[開始:終了]→→ str = "Flower" print(str[1:4]) → low
文字列 % (値1, 値2, ...)→→ num= "10進数では %d 、16進数では %x " % (num, num)
"xxxx{index:書式指定子}xxxx".format(値)→→ "名は{:<8s}で年は{:>3d}で".format(name, age)
f"xxxx{値:書式指定子}xxxx"→→ f"名は{name:<8s}で年は{age:>3d}で" 
0/空の文字列''/値なしはfalse、Noneは? x = None x is None→→true?
//→除算切り捨てし整数、**→べき乗
関数宣言はdef kansu(): で中で宣言する変数はローカル変数
 関数外で宣言された変数はグローバル変数でどの関数の中でも扱えるようになる
 なお関数内でもglobal henでグローバル変数を宣言できる Pythonでのグローバル(global)変数の宣言方法 | UX MILK
返り値複数はcsvでタプルになる、リストが楽か? return a,b → (a, b) あるいは return [a, b] → [a, b]
def func(a, b):
return a, b
result = func()
 result[0]がa、result[1]がb
try/exceptを関数内で設定することも、逆に関数呼び出し時にも使用ができる、else, finally, raiseも使う、エラーが出ても止めたくない場合は try-except Exceptions as e、逆にexceptを入れなければ止まるので安全
try:
get_all_transfer(project_id)
excerpt Exception as e:
print(e)
置換は左辺が要る? a = a.replace('x','')
とほほのPython入門 - リスト・タプル・辞書 - とほほのWWW入門 (tohoho-web.com)
Pythonの辞書とリストとクラス 複数情報の受け渡し|みはみ|note
リストa=[1,2,3]はmap(), filter(), reduce()等が使える
 a=a.append()とかa=a.extend()は値がないんで駄目、単純にappend(b)やextend(b)で左辺不要
 取得:a[0]、for v in a:
 リストの合体:list_a += list_b
セット型set={1,2,3}は重複や順序や添字の無いリスト、set(list)でキャストし重複を無くせる、ミュータブルは格納できない
 取得 for v in a:
tuple→タプルは定数リスト、更新無しならリストより速い a = 1,2,3 a = (1, 2, 3)
 取得:a[0]、for num in a:
dict→辞書は連想配列みたいな{a:1,b:2}はitems(), keys(), valus(), iteritems(), get()を使える
 Python | 辞書に含まれるすべてのキーと値を取得する (javadrive.jp)
 取得:dict_a['key1']、for k in dict_a.keys(): for v in dict_a.values(): for k, v in dict_a.items():
 dictの合体:dict_a.update(dict_b)
クラス→例えば●●クラスを宣言しsampleインスタンスを生成し、getter/setterで変数に入れて置く
 取得:sample.key
BigQuery→別名を付ければ名前で取得できるが、インデックスでも取得できる(これ何?)
 取得:for row in query_job: →row[0], row["t"]
lambdaは無名関数?
str_w = input('何か入力してください-->') #入力させた値を取れるが数字もstr
__iter__()はnext()を持つオブジェクトを返し、next()は次の要素を返し、最後に達するとStopIteration例外を返す?
yield はイテレータを返すジェネレータを定義?
@デコレータは関数を実行する前後に特殊な処理を実行したい場合?
withで終了処理を指定できる、ファイル読込とその後の処理とか
assertや__debug__はテストで機体通りかを確認する?
passは中身の無い関数やクラスを作成しkara.p=1で粋なり属性追加等ができる
execは引数の文字列をPythonとして実行 exec "print 'Hello'"
delはオブジェクトを削除 del x, y, z
継承やオーバーライド class MyClass2(MyClass):
多重継承class MyClassC(MyClassA, MyClassB): で纏めて使えるようになる
class MyClass:
    """A simple example class"""  # 三重クォートによるコメント
    def __init__(self):  # コンストラクタ
        self.name = ""
    def __del__(self): #インスタンスが消滅する際に呼出でコンストラクタ
        print "DEL!"
    def __str__(self): #文字列化
        return "My name is " + self.name
    def getName(self):  # getName()メソッド
        return self.name
    def setName(self, name):  # setName()メソッド
        self.name = name
class MyClass2(MyClass):
    def world(self):
        print "World"
class MyClass3(MyClass):
    def hello(self):  # 親クラスのhello()メソッドをオーバーライド
        print "HELLO"
a = MyClass()  # クラスのインスタンスを生成
a.setName("Tanaka")  # setName()メソッドをコール
print a.getName()    # getName()メソッドをコール
print a  #=> My name is Tanaka 文字列化
b = MyClass2()  #継承
b.hello()    #=> Hello
b.world()    #=> World
c = MyClass3()  #オーバーライド
c.hello()    #=> HELLO
super()を使ってオーバーライドする
 super()は基底クラスのメソッドを継承した上で処理を拡張
 super().__init__(x、y)が使える
with構文で処理の前後で__enter__、__exit__を使う
 __enter__メソッドで事前処理
 __exit__メソッドで事後処理
if __name__ == "__main__":
 モジュール時の勝手実行を抑える
  import helloの時hello.py 内部での __name__ は "hello" 
  python hello.pyのような実行時hello.py の内部の __name__ は "__main__"
from math import pi, radians→mathモジュールから特定のオブジェクト(関数/変数/クラス)をimpo(math.piみたいに書かず省略できる)
import urllib.error→urllibパッケージからerrorモジュールをimpo、パッケージはフォルダ
import numpy as np→別名でしか使えなくなるnp.array()とかで
 モジュール=ファイル名.pyでファイルをimpoしている
from {another_file} import {ClassName}
 another_file.pyがファイル名
 class ClassNameがクラス名
from {パッケージ:ディレクトリ} import {モジュール:ファイル}
 ちゅー書き方もできるらしいが、どっち?
impo順:標準ライブラリ>サードパーティライブラリ>ローカルライブラリ(自作のライブラリ)

関数や変数:小文字スネークケース(sample_func)
クラス名、例外、型変数:キャピタルパスカルケース(SampleClass)
定数名:大文字アンダースコア区切り(SAMPLE_CONST)
モジュール名:小文字(samplemodule, sample_module)
パッケージ(フォルダ)名:小文字。アンダースコア非推奨(samplepackage)

インデントは半角スペース4つ
1行半角で79文字以内
トップレベルの関数やクラスは2行開ける
クラス内部では1行ずつ開けてメソッド定義
ドックストリングでクラスや関数についてコメントする(慣習的にダブルクォート)
 コード中は処理についてのコメントをなくし関数化とdocstringで参照するように
 「コメント(#)とdocstring(""")の違いは?」コメントとdocstringについて
 [Python]可読性を上げるための、docstringの書き方を学ぶ(NumPyスタイル) - Qiita

デバッグの方法案
print(type(v)) でどんなメソッドを持っているか等を探る
print(v) をコマンド前後や流れで沢山仕込みでどこでエラーが出ているか探す
is not subscriptableのエラー 添字不可エラーでリストでないのにリストとして入れようとしている

※参照になりコピーされない、必要ならコピー(値を入れた時点で参照が外れるので実際問題少ない?)
a = []
b = a
b.append(1)
print(a) #[1]
https://qiita.com/ponnhide/items/cda0f3f7ac88262eb31e
https://nishiohirokazu.hatenadiary.org/entry/20120125/1327461670

環境変数を扱う
 import os
 print(os.environ["HOME"]) ホームディレクトリ、LANGでja_JP.UTF-8とか
 os.environ["PHASE"] = "staging" 環境変数に代入できるのは文字列だけ
 del os.environ["PHASE"] 削除
コマンドラインの引数を扱う
 python3 sys_arg_test.py a 100
  dst_prj = sys.argv[1] (aが入っている)
  sys.argv (['sys_arg_test.py','a','100']

Pythonのリストと文字列を相互に変換する方法まとめ | HEADBOOST
→リストをStrに変換してSQLにする場合For文が良い(Pythonの書式とSQL書式のコンビなので丁寧に対処するため)
i = 0
v = "["
for s in list_v:
    i += 1
    if i > 1:
        v += ","
    v += "'" + s + "'"
v += "]"
SQL = "insert into aaa (aaa) value ({v})"

※テキスト選択
 Shift↑or↓ で行全体
 home(+fn)で行頭、end(+fn)で行末移動

【基礎一覧】Pythonの基本文法を全て解説してみた!【初心者】 (suwaru.tokyo)
Python基本文法まとめ - Qiita
とほほのPython入門 - とほほのWWW入門 (tohoho-web.com)
Python入門 ~Pythonのインストール方法やPythonを使ったプログラミングの方法について解説します~ | Let'sプログラミング (javadrive.jp)
Welcome to Python.org

HTMLの中に少し埋め込めず、基本的にプログラムの中にHTMLを埋め込む:CGI(Perl然)
 さくらインターネットでPython CGI (mwsoft.jp)
WSGI Python で WSGI (Web Server Gateway Interface) に従ったシンプルな Web サーバで Hello World - Qiita
Python用Webサイト用途フレームワーク:Flask(軽量)、Django
 WSGI について — Webアプリケーションフレームワークの作り方 in Python (c-bata.link)
 GCPでどう使うかは不明だがホスティングは↓
 ウェブ ホスティング | Google Cloud 静的ウェブサイトのホスティング  |  Cloud Storage  |  Google Cloud

str.split() 区切り文字で分割しリスト等に入れる Pythonで文字列を分割(区切り文字、改行、正規表現、文字数) | note.nkmk.me
print('Sam' in 'I am Sam') # True 任意の文字列を含むか判定: in演算子 Pythonで文字列を検索(〜を含むか判定、位置取得、カウント) | note.nkmk.me
==============
ここで動かせるgoogle colaboratory→ Colaboratory へようこそ - Colaboratory (google.com)

コラボラトリはマークダウン Qiita マークダウン記法 一覧表・チートシート - Qiita
半角スペース2個で改行
#の数で見出し
*で箇条書き
数字と.で番号を振る、- でリスト
* or - or _ を3つ以上で水平線
[ ]でチェックボックス、[x]でチェック
| td | td | td |でテーブル
**aaa**で太字、*aaa*で斜体
~~aaa~~で打消し線
[タイトル](URL)でリンク
```でコードの挿入、`でインライン挿入
> or >> で引用
 [^1]で注釈
\バックスラッシュでマークダウンのエスケープ

==============
宗教論争(事実は同じでも他人の認知は違うので意味なし
if self.flag_ok == 1 and self.mode == '1'
↓一見で分からんなら変数名を工夫してこうやんな
if self.file_verify_completed and self.mode == GRANT_PERMISSION:

マジックナンバーを使わない(数字の方が曖昧性が無い場合も)
STATUS_ERROR = -1
STATUS_SUCCESS = 0
self.status_error = STATUS_SUCCESS

初期値をエラー値にし、業務判定エラーでステータスを設定したらreturnで抜ける
def exFunction(self):
self.status_error = STATUS_ERROR
try:
if XX = AAA:
self.status_error = STATUS_XX_ERROR
retrun
self.status_error = STATUS_SUCCESS
retrun
except:
~エラー処理、ステータスは変更しない

エラーメッセのハードコーディングを避ける方法(ハードが場所と内容が分かり易いかも)
MSG_ERROR_OLD_EMAIL = "Error: 旧メール%sです\n"
e_message_list.append(MSG_ERROR_OLD_EMAIL % (old_email))
self.error_message = '\n'.join(e_message_list)


ケチって分厚い本1冊にしたが全然進まぬ、薄い奴星e、?チッPython、誰がJSONじゃ~い、チェーンソー魔わすっぞ

続編、、モジュールとかmportとか、
/// BANGBOO BLOG /// - Python Python

Posted by funa : 07:30 PM | Web | Comment (0) | Trackback (0)


December 25, 2020

Promise
仕事は炎上芸なり~と勤しむ炎上芸人にも分かるように解説をさせて頂きたく候
(勤しむところはソコではない)

///promise/async/await 非同期関数
【ES6】 JavaScript初心者でもわかるPromise講座 - Qiita
https://rightcode.co.jp/blog/information-technology/javascript-promise
https://rightcode.co.jp/blog/information-technology/javascript-async-await
http://www.tohoho-web.com/ex/promise.html
https://sbfl.net/blog/2016/07/13/simplifying-async-code-with-promise-and-async-await/
https://qiita.com/niusounds/items/37c1f9b021b62194e077
https://qiita.com/soarflat/items/1a9613e023200bbebcb3
非同期関数は処理の順序を制御できない問題があった、そこでPromise
Promise オブジェクトは then(ok_callback, ng_callback) というメソッドを持ちます。
then() はPromise が成功または失敗になるまで処理を受け流し、
処理を.then()で繋げ順番を確保することが可能
成功時に ok_callback を、失敗時に ng_callback をコールバック関数として呼び出します
.then() は第一引数に成功時のコールバック関数、第二引数に失敗時のコールバック関数
.catch(ng_callback) は、.then(undefined, ng_callback) と同じ意味
.catch() は処理中に発生した throw をキャッチできる
ES2018(ES9) では、.finally() がサポートされました
function aFunc3(data) {
    return new Promise(function(okCallback, ngCallback) {
        setTimeout(function() {
            if (Math.random() < 0.30) {
                ngCallback(new Error('ERROR!'));
            } else {
                okCallback(data * 2);
            }
        }, Math.random() * 1000);
    });
}
function sample_finally2() {
    aFunc3(100).then((data) => {
        console.log(data);
        return aFunc3(data);
    })
    .then((data) => {
        console.log(data);
        return aFunc3(data);
    })
    .then((data) => {
        console.log(data);
         throw new Error('ERROR!!!');
    })
    .catch((e) => {
        console.log("catch");
        console.log(e);
    })
    .finally(() => {
        console.log('*** Finally ***');
    });
}
//200 400 800 catch Error:ERRROR!!! *** Finally ***
Promise.all() は配列で指定された全てのPromiseタスクを待ち全てが完了した時点で .then()を呼ぶ
Promise.race()ならいずれかのPromise
function sample_all() {
    p1 = taskA();
    p2 = taskB();
    Promise.all([p1, p2]).then(() => {
        console.log("taskA and taskB are finished.");
    });
}
ES2017 では、async/await がサポートされました
async と await を用いることで、Promise に対応した非同期関数を、同期関数の様にシンプルに呼び出すことが可能となります
同期関数の様に呼び出したい非同期関数を呼び出す際に await をつけます。await を呼び出す関数に async をつけます
async function sample_async_await_with_catch() {
    var val = 100;
    try {
        val = await aFunc3(val);
        console.log(val);
        val = await aFunc3(val);
        console.log(val);
        val = await aFunc3(val);
        console.log(val);
    } catch (e) {
        console.log(e);
    }
}

■コールバック関数
広い定義でいうと「高階関数に渡すための関数」
「関数を受け取る関数」は「高階関数」、つまりhello()がコールバック関数
// 関数を2回実行する関数!!
function doTwice(func) {
  func(); // 1回目Hello!
  func(); // 2回目Hello!
}
// あいさつするだけの関数
function hello() {
  console.log('Hello!');
}
// あいさつを2回実行する
doTwice(hello);

========================================
もっと詳しく、もっと分かり易く、どう使うか↓

https://knowledge.sakura.ad.jp/24890/
https://jsprimer.net/basic/async/
https://dev.classmethod.jp/articles/javascript-asynchronous-processing/
■処理の繋がり
1)コールバック関数
 ある関数の処理が終われば次のコールバック関数を呼ぶという指定がそれ
 歴史的にはエラーファーストコールバック(のルール)
  処理が失敗した場合は、コールバック関数の1番目の引数にエラーオブジェクトを渡して呼び出す
  処理が成功した場合は、コールバック関数の1番目の引数にはnullを渡し、2番目以降の引数に成功時の結果を渡して呼び出す
  fs.readFile("./example.txt", (error, data) => {

2)Promise(非同期処理に対するPromise→順番を合わせる意味では同期処理ではと思う?JSはシングルスレッドかつ非同期という糞?仕様)
 ある関数の処理が終わればPromiseオブジェクトを返す
 JSがシングルスレッドだが 処理を一定の単位ごとに分け処理を切り替えながら実行する並行処理(concurrent)の仕様のため 順序を考慮する必要がある
  非同期処理の実行中にとても重たい処理があると非同期処理の切り替えが遅れる

Promiseオブジェクトは3つの内部状態を持ちます。
 pending(保留): まだ非同期処理は終わっていない(成功も失敗もしていない)
 fulfilled(成功): 非同期処理が正常に終了した
 rejected(拒否): 非同期処理が失敗した
  初期状態はpendingで、一度fulfilledまたはrejectedになったらそれ以降は状態は変わらず、非同期処理の終了時に返す値もそれ以降は変わらない

Promiseのコンストラクターは関数を引数に取って、その関数がさらに2つの関数を引数に取る
 1番目の関数(resolve)に引数を渡して実行すると状態がfulfilledになり、引数の値はPromiseオブジェクトが保持する値になる
 2番目の関数(reject)に引数を渡して実行すると状態がrejectedになり、引数の値はPromiseオブジェクトが保持する値になる
 関数が例外を投げた場合も状態がrejectedになり、投げた値がPromiseオブジェクトが保持する値になる、throwする値をrejectedに渡して実行した時と同じ

then()は2つの関数を引数に取り、Promiseの状態がfulfilledになったら1番目の関数が、rejectedになったら2番目の関数が実行されます。
 then()の1番目の引数が関数でなければidentity function(入力値をそのまま返す関数)が代わりに使われます
 2番目の引数が関数でなければthrower function(入力値を例外として投げる関数)が代わりに使われます
  catch()は1番目の引数にidentity functionを指定したthen()と同じ

上の挙動をオレオレPromiseをYakusokuで作っているので分かり易い https://knowledge.sakura.ad.jp/24890/

なお、本質としてはコレ、下記ソースが決まりの流れ、ひな形としてヤリ慣れるしか
1)時間が掛かる処理をPromise化して順序立てよう
2)成功と失敗のコールバックを指定しよう

//処理にコールバック関数を入れて成功と失敗時の型で終える
function dummyFetch(cmt, callBack) {
    setTimeout(() => {
        if (cmt.startsWith("/success")) {
            callBack(null, { body: `Response body of ${cmt}` });
        } else {
            callBack(new Error("Bad"));
        }
    }, 1000 * Math.random());
}
//プロミスを入れるためラッパーを関数にかます
function aaaFilePromise(cmt) {
  return new Promise((resolve, reject) => {
    dummyFetch(cmt, (err, data) => {
      if (err) {
        reject(err); // 失敗: 内部状態をrejectedにする
      }
      else {
        resolve(data); // 成功: 内部状態をfulfilledにする
      }
    });
  });
}
//プロミスチェーンでのフロー
aaaFilePromise("/success/passwd")
  .then((data) => { // 読み出しに成功したらresolve()に渡した値が引数として渡される
    console.log("1", data);
    //return 'next';//テキストがあってもなくても次のthenに行く、省略でもテキストでも第一引数関数に行く成功側
    return aaaFilePromise("/etc/text");//エラーで次のthenの失敗側の第二引数関数にきっちり行く
  })
  .then((data) => {
    console.log("2", data);
    return aaaFilePromise("/success/shadow1");
  }, (data) => {
    console.log("2e", data);
    return aaaFilePromise("/success/shadow2");
  })
  .then((data) => {
    console.log("3", data);
    return aaaFilePromise("/etc/shadow");
  })
  .catch((err) => { // reject()に渡した値が引数として渡される
    console.log("error", err);
  });

then()/ catch()は、引数で渡された関数の戻り値から新たにPromiseオブェクトを作り、そのオブジェクトを返します。そのためメソッドチェーンが可能
  引数に渡した関数の戻り値がPromiseオブジェクトの場合はそのオブジェクトをそのまま返す、そうでなければ戻り値をPromiseで包んで返す
 エラーでキャッチに飛ぶ訳ではなく次のthen第2引数関数に飛んでいる、省略でcatchに行っているように見えるだけ

dexieやPWAでの提供があり使う(処理を順序立てて使うようプログラムを組む時に
dexie: db.schedule.where('site').equals('sche').first().then(function(records) {
pwa: caches.keys().then(function(keyList){
return Promise.all(keyList.map(function(key){

3)async / await
promiseは順番決めができたがasync/awaitは順番を扱う処理もできる
setTimeout/setIntevalがプロミスチェーンだけでは時間を止められない
 シングルスレッドから似非スレッドで分離し非同期になるから、awaitを入れると同期する↓
const wait = (sec) => {
  return new Promise((resolve, reject) => { setTimeout(resolve, sec*1000);  });
};
async function arrKick_async(arr) {
    for(let i=1; i<=num_arr; i++){
      arr = await kickPromise(arr);
      await wait(2);
    }
}
arrKick_async(arr);

========================================
JSネイティブとPromiseとasyncが混ざった場合は同期しない、then()すら超えてくる↓

4)コールバック地獄
結局コールバック地獄が扱いやすい(スレッドの切り替えがなければ同期ができる)、最近のJSフレームワークは全部Promise化しているらしいが

例)キャッシュを保存し、そのステータスを取るようにAsyncやPromiseで保存待ちの順番をにしても、待たない

//隙間がないと1度エラーだとエラーになりっぱなし
let num_cache;
num_cache = getCacheStatus();
if(num_cache == 0 || !num_cache){
num_cache = getCacheStatus();
if(num_cache == 0 || !num_cache){
num_cache = getCacheStatus();
if(num_cache == 0 || !num_cache){
num_cache = getCacheStatus();
if(num_cache == 0 || !num_cache){

//setTimeoutで隙間があっても関数スレッドの返り値を代入するスレッド切替時に、返り値を待つスレッドの方は次の処理に進んでしまいIF判定ができない
let s = setTimeout(function(){
let num_cache1 = getCacheStatus();
if(num_cache1 == 0 || !num_cache1){
s = setTimeout(function(){
let num_cache2 = getCacheStatus();
if(num_cache2 == 0 || !num_cache2){
s = setTimeout(function(){
let num_cache3 = getCacheStatus();
if(num_cache3 == 0 || !num_cache3){
s = setTimeout(function(){
let num_cache4 = getCacheStatus();
if(num_cache4 == 0 || !num_cache4){

//Func返り値やPromiseやAsyncでのスレッドの切り替えがないDOMの判定であれば上手くいく
let s = setTimeout(function(){
getCacheStatus();
if(document.getElementById('mes_filenames').innerHTML == 'none'){
s = setTimeout(function(){
getCacheStatus();
if(document.getElementById('mes_filenames').innerHTML == 'none'){
s = setTimeout(function(){
getCacheStatus();
if(document.getElementById('mes_filenames').innerHTML == 'none'){
s = setTimeout(function(){
getCacheStatus();
if(document.getElementById('mes_filenames').innerHTML == 'none'){
s = setTimeout(function(){
getCacheStatus();
if(document.getElementById('mes_filenames').innerHTML == '<?php echo $lang_page->install_none; ?>'){

function getCacheStatus(){
let num_caches = 0;
let num_success = 0;
caches.keys().then(function(keyList){
  return Promise.all(keyList.map(function(key){
caches.open(key).then(function(cache) {
cache.matchAll().then(function(response) {
document.getElementById('mes_filenames').innerHTML = '';
let s;
let o;
for(const value of response){
s = value.status;
o = value.ok;
document.getElementById('mes_filenames').insertAdjacentHTML('afterbegin', value.url + '<br>');
if(s == '200' && o){
num_success++;
}
num_caches++;
}
if(num_caches > 0){
document.getElementById('mes_progress_rate').innerHTML = 'Progress: ' + num_success / num_caches * 100 + '%';
}else{
document.getElementById('mes_filenames').innerHTML = 'None';
}
});
});
  }));
});
return num_caches;
}
===============
thenの入れ子だと親の部分だけ先に進んでしまう、入れ子ダメで親子を作れば親→子の一方方向で子で終わるトーナメント構造で(上がらない)
test1().then((result) => {
test2().then((result) => { //fuok });
})then(function() これは入れ子

test1().then((result) => {
test2().then((result) => {
//fuok
})then(function(){ //fuok2 }); これでトーナメント構造
})catch(function(e)

promiseチェーンでthen毎にに欲しい引数を出すが、複数であればそれらの引数をthenに渡せない、下記1は駄目
 1)thenで一つの引数になるようにロジックを組む(thenのトーナメント構造、一階層上で変数に入れる等)
}).then(function(response){
return [response.json(), arr_del];
}).then(function(v) {
json = v[0]; arr = v[1];
 2)callbackとresolveに配列を使うとOK、オブジェクトでもいいかも
function dummyFetch(cmt, callBack) {
if(Array.isArray(cmt){
var p = cmt[0];
var s = cmt[1];
}else{
var p = cmt;
var s = 1;
}
setTimeout(() => {
        if (p.startsWith("/success")) {
var r = [p, ++s];//これ不可[p, s++]
callBack(null, r);
        } else {
            callBack(new Error("Bad"));
        }
    }, 1000 * Math.random());
}
function aaaFilePromise(cmt) {
  return new Promise((resolve, reject) => {
    dummyFetch(cmt, (err, data) => {
      if (err) {
        reject(err);
      }
      else {
        if(Array.isArray(data){
var p = data[0];
var s = data[1];
}else{
var p = data;
var s = 1;
}
resolve([p, s]); // 成功: 内部状態をfulfilledにする
      }
    });
  });
}
===============
Promise化していない関数を使いたいが、そのまま使うかthen化できるようにするか?
 1)次thenに進みたい元Funcの処理としてresolveの返り値に入れる、ダメなら省略可だがreject()に渡しcatchする
 2)次thenには適当でもいいのでreturnで進む
function test1 () {
  return new Promise((resolve, reject) => {
    const a = 1;
    const b = 2;
    resolve([a, b]);
  })
}
test1().then((result) => {
  console.log(result[0]); // 1
  console.log(result[1]); // 2
  return 'go next';
}).then(function(){

エラーハンドリングしたい、よくわからんが下記で動作に違いがでた、rejectはJSがエラーを吐いた
 1)catchさせるにはthrow new Errorし、alertを出す
 2)catchはしないが次のthenには移動させないためreturn false
}).then(function(json){
if(json.init == 'Not appropriate access'){
throw new Error('Server warning');
}else if(json.init == 'No data'){
//reject("initiate!");
return false;
}else{
resolve(json);
}
}).catch(function(error){
alert('Ooops:  ' + error);
});
Promise.allを使って、3つのpromiseを同時に実行、allはすべての非同期処理がresolveされたタイミングで結果を返
Promise.all([test1, test2, test3]).then(function() {
    console.log("Fourth");
もっと簡単に async, await, Promise - Qiita

■Javascript
https://www.bangboo.com/cms/blog/page_325.html

Posted by funa : 01:06 AM | Web | Comment (0) | Trackback (0)


April 21, 2020

Dexie
Indexeddbを使うならラッパーが要るやろ、とオモて、溺死やったらコレ便利やんってちゃうか、とオモて、知らんけど

■構造 DB > Table > kvs > record
(db=)schedule_db > schedule(=table) > kvs(Key=自動採番:Value=json=record)

kvsはid++が先頭に来ずでこう→ 1:"{"name":"aaa",reg_date":"20201027_11:57:24","id":1}"

var db = new Dexie("schedule_db");
db.version(1).stores({
schedule: '++id,name,reg_date'
});

■操作
var db = new Dexie("schedule_db"); schedule_dbというDBがセットされ
schedule: '++id,name,key,reg_date' テーブルscheduleにカウントアップKey:JSON{id,name,key,reg_date}が入る
もしschedule: 'name,key,reg_date'ならnameが自動で一番最初のカラムだからキーになる
キーの値が同じだとAddができない

stores()で一番最初に来るのが「主キー」
put()は追加しあれば更新、add()は追加のみで同キーがあればエラー
 put()はupdateとしてDB上上書きされるように見えるがループすると全データが出てくる、謎
first()やlimit()やlast()で欲しいレコードを取得
toArray()ではobjが返るがobjは配列で引数0をつけてアクセス obj[0]
get('aaa')はkey=aaaの値を持つ最初の行、get({key: "sss", value: "ccc"})で条件付可
delete()の返り値Promiseに削除件数が入っている

■削除のレベルは行、表、DB
行削除 db.schedule.where({id: id}).delete().then (function(records){
表削除 trancateで db.schedule.clear(); コンソールには反映されていないがレコード削除済
 db.table(storeName) で操作あるいはtables ->だめだった
 表を複数持てる
db.version(1).stores({
    genres: '++id,name',
    albums: '++id,name,year,*tracks',
    bands: '++id,name,*albumIds,genreId'
});
db.delete() DBを消せる(その後新たに再作成できる)

■insert
db.schedule.add({name: "aaa", key: "bbb", reg_date: getCurrentTime()}).then (function(id){
return db.schedule.get(id);
}).then(function (schedule) {
alert ("Date was set at " + schedule.reg_date);

■select
db.reserve.each(function(records){
if(records == null || records == ''){
alert ("No data found");
}else{
records.json;

toArrayは複雑になる、eachの方がよいかも、toArrayとeachの入れ替えてのselect発行が基本できるみたい
db.reserve.where({flg_del: 2}).toArray(function(records){
records.forEach(function(record){//obj.forEach直で行ける
Object.keys(record).forEach(function(key) {//直で行けずObject.keys().forEach()で
let val = this[key];
if(key == 'json'){
let v = JSON.parse(val);//直で行けずパースが必要
Object.keys(v).forEach(function(k) {
let v = this[k];
console.log(k, v);
}, v);
}
}, record);
});

複雑なものはOr句で出せる
db.reserve.where('reg_date').below(getCurrentTime()).or('flg_del').equals(2).limit(3).each(function(records){
console.log('List: ' + JSON.stringify(records));

And句はfunctionを取るが簡単な感じがする
db.reserve.where('datetime').below(display_expire_date).and(item => item.flg_del == 2).desc('datetime').limit(display_ex).each(function(records){

複数条件はwhereにオブジェクトとして記載するがbelow等のフィルターにつながらずエラー、シンプルならokだが
db.reserve.where({datetime, flg_del: 2}).below(display_expire_date).limit(display_ex).each(function(records){
複数条件にフィルターをつけるにはwhereに配列で記載するが一つはbelow、一つはequalsでフィルタが複数でうまくいかない、シンプルならokだが
db.reserve.where(["datetime", "flg_del"]).below([display_expire_date, 2]).limit(display_ex).each(function(records){

先頭行
db.schedule.where('name').equals('aaa').first().then (function(records){

x↓ダメ??
db.schedule.where('name').equals('aaa').toArray(function(records){
alert(records.reg_date);

x↓ダメ??
db.schedule.get({name: "aaa", key: "bbb"}).then (function(records){
alert (JSON.stringify(records));
for (let i in records) {
alert(i + ' item has ' + records[i].reg_date);
}

■Insert and select(キーのidを使う)
db.schedule.add({name: "ver1.0", key: document.getElementById("inputKey").value, value: document.getElementById("inputValue").value, reg_date: getCurrentTime()}).then(function(){
db.schedule.get('2').then(function(records){
alert(JSON.stringify(records));
}).catch(function(error) {
alert ("Ooops: " + error);
});
}).catch(function(error) {
alert ("Ooops2: " + error);

■Update
putは存在があれば更新、なければ挿入
db.schedule.put({key: "bbb", reg_date: set_date}).then (function(){
return db.schedule.get('bbb');
}).then(function (schedule) {
alert ("Date was set at " + schedule.reg_date);

keyが出せる場合はupdate()
db.friends.update(2, {name: "Number 2"}).then(function (updated) {

トランザクションや細かな変更はmodify()
db.friends.where("shoeSize").aboveOrEqual(47).modify({isBigfoot: 1});
 modify推奨?→ https://dexie.org/docs/Collection/Collection.modify()

■Delete
db.schedule.where({name: "aaa"}).delete().then (function(){
return db.schedule.toArray();
}).then(function (records) {
if(records == null || records == ''){
alert ("No data found");
}else{
alert (JSON.stringify(records));
}

■Where句
db.friends.where("shoeSize").between(40, 45).count(function(count) {
[HTML5] IndexedDBでデータの保存や読み込みを行う - Dexie.js編 (katsubemakito.net)
Dexie.jsとTypeScriptでIndexedDBを操作する - noxi雑記 (hateblo.jp)

■アクセス
indexeddbは該当DBにどこからアクセスできるか>同一ドメイン、ディレクトリでじゃない
保存場所
C:\Users\<ユーザ>\AppData\Local\Google\Chrome\User Data\Default\IndexedDB
C:\Users\<ユーザ>\AppData\Roaming\Mozilla\Firefox\Profiles\XXXXX.default\storage\default

■課題
SWで外部JSを扱うにはSW内に importScripts('dexie.js'); で埋め込む
SyntaxError: Unexpected token o in JSON at position 1 はオブジェクトが返っている
JSONはオブジェクトで扱うのが楽 JSON.stringify(records)とJSON.parse(records)で変換
console.log('json: ' + JSON.stringify(json));
for(i = 0; i < json.length; i++){
if(json[i] != null) {
console.log('id: ' + json[i].id);
下のようなロジックはあるテーブルのSELECTループ中に他のテーブルにアクセスする入れ子なのでエラー「NotFoundError: Failed to execute 'objectStore' on 'IDBTransaction': The specified object store was not found.」→配列に入れてIndeDBの問い合わせを一旦完了し、配列のループでIndedbを操作
self.addEventListener('sync', function(event){
db.que.each(function(records){
if(event.tag.startsWith('post-data:' + records.tag)){
event.waitUntil(postDataSW(db));
}
});
function postDataSW(){
db.reserve.where({flg_server: 2}).toArray(function(records){
DevTools failed to load SourceMap: Could not load content~のエラーが出た
 効果あるか不明だがdexieの最終行のコレを削除した、文字コードがUTF8に変えたりも //# sourceMappingURL=include.prepload.js.map

■関連JS、Javascript
JSでAタグリンクを挿入するにはinsertAdjacentHTMLがよい
生成したタグを追加する前に掃除するにはdocument.getElementById('xx').textContent = null;

■テスト
https://www.bangboo.com/indexeddb/indexeddb_dexie_form.html
https://www.bangboo.com/indexeddb/test/indexeddb_dexie_form.html (ディレクトリ違い)

Posted by funa : 12:00 AM | Web | Comment (0) | Trackback (0)


April 20, 2020

PWA

■PWA
https://digital-marketing.jp/seo/what-is-progressive-web-apps/
https://developers.google.com/web/fundamentals/architecture/app-shell?hl=ja
https://qiita.com/kimamula/items/4e25b8d2caca314f9dd2
https://html5experts.jp/osamum_ms/25709/
Service Worker, App Shell Model, PRPL Petternなどを駆使したGoogleが提唱するProgressive Web Apps
HTML / JS / CSS だけでほぼ構成、モバイルApp的なWebが提供できる
SW(JS)がブラウザとサーバの間に位置し、データを取ったり渡したりブラウザの影/裏側で動く、サーバと考えてしまうと分かり易い?
App Shell Modelで側(画面テンプレート)をプッシュしておくと早い(JSレスポンス悪すぎるからコレってな)

PRPLは以下の略
 Push: 最初のURLルートに不可欠なリソースを Pushする。
 Render: 最初のルートを Renderする。
 Pre-cache: 残りのルートをPre-cache(事前キャッシュ)する。
 Lazy-load: オンデマンドで残りのルートをLazy-load(遅延読み込み)する。

/// Service Worker
訪問がない状態でのバックグラウンド同期、プッシュメッセージ
データの更新を集中的に受信して複数ページがデータの一部を利用(ブラウザにインストールするプロキシ、コンテンツの管理やキャッシュ管理を行える)
https://developer.mozilla.org/ja/docs/Web/API/Service_Worker_API
https://qiita.com/kei4eva4/items/fa5f99211e45b7ca6f6e
 →正確にはバックグラウンド同期では無い>periodic background syncはユーザに粘着可で無くなりそう
 Periodic Background Sync 及び Web を Install するということ | blog.jxck.io
 スコープへアクセスがあった場合にキャッシュの更新はできる、あるいは
 syncをオフ時に仕込んでおけばオンライン時にバックグラウンド同期は可能
 beacon apiを実行させると離脱時にサーバに通信も可能


Webページとは別にバックグランドで実行するスクリプト(マルチスレッドになると思う)
ブラウザでキャッシュ操作ができる、容量もあり強力、データ期限や破棄に注意
 DOMに直接アクセスできない
 ブラウザを開いていなくても動作可能
 プログラム可能なネットワークプロキシとして動作可能
 HTTPS必須(またはlocalhost)
ネットワークに依存しない、早い(阿部寛はもっと早い)、プッシュ通信、ホームに追加
 
/// プッシュ配信
https://liskul.com/push-notification-25520
https://www.fenrir-inc.com/jp/boltzengine/
https://pushnate.com/labs/pushnate/webpush-case-guide

事前のコンセントがなくいきなり「プッシュ通知を有効にしますか」と出てくるのは駄目
ユーザーに何の通知をするかを知らせたい
通知から訪れたときの表示と挙動を決めておく
セグメントを分けて送りたい場合はセグメントの情報をどうやってブラウザからたどってくるか
スマホではアプリのインストールが必要だが、Webプッシュはブラウザさえあれば通知ができる
https://webtan.impress.co.jp/e/2018/12/06/31214
通知の許可のダイアログを出す前にダイアログで説明
https://push.appirits.com/webpush/

過去評価の高かったボケが、1日1つプッシュ通知で配信
1日1回、時間帯としては「20時前後」に4回に分けて(通常19:50、20:00、20:10、20:20)配信
年末年始やGWだけは、昼と夜に(1日2回)
DAUに15〜20%くらい影響がでます。「プッシュしないとアプリを開かない人」が一定数いる
アクティブ度、アプリのバージョン、端末のOS、属性(男女)などで、セグメント配信
休眠ユーザーだけにプッシュ1万人に1人くらい(0.01%)しか起動せず難しい
https://appmarketinglabo.net/bokete-push/

配信方法は現在ではChromはGCMを、FirefoxはSimplePushサーバを利用
 受信する端末ごとに異なるメッセージを送るにはGoogle Firebaseが使われる様である
 https://android.googleapis.com/gcm/send https://updates.push.services.mozilla.com/push/
その許可を得たプッシュのエンドポイントを使用し配信
GCMの場合1度の送信で1000デバイスまで同時に指定できる、FirefoxのSimplePushでは1デバイスでの送信
デスクトップ/Webの場合はデスクトップに通知される(Win10の場合?Win7でも通知が来る)
https://qiita.com/zaru/items/f6e821052abb1b18bb0b
https://techblog.asahi-net.co.jp/entry/2018/09/28/173705
 ここにブラウザのベンダーの提供サービスを通じてとある(モバイルはコレしか)
 サーバーからブラウザを通じてデスクトップ通知する方法(Push API を利用) – ラボラジアン (laboradian.com)

/// 結局
キャッシュを弄くってオフラインでもゴニョゴニョできる、先読みも可、プッシュ通知も可、モバイルAppぽく
 →G suiteのOfficeアプリがオフラインでもサクサク、メール受信通知もできるGoogleのG suite用みたいなもんか
 →PCよりスマホを売りたい、通信量でも儲けたいfbgcp、個人情報を取りたいので、モバイル優先、モバイルっぽくWeb、これはi-modeやね

UR evil.

■どのようにPWA化するのか
https://techblog.asahi-net.co.jp/entry/2018/07/06/145931
https://techblog.asahi-net.co.jp/entry/2018/08/10/175407
 1)Service Worker(PWAで必要な処理を記述するJavaScriptファイル)
 2)Manifest(PWAの仕様について記述するJSONファイル)
 3)アイコン…ショートカットアイコン、プッシュ通知時のアイコンや起動画面で配置する画像

navigator.serviceWorker.register('/servicew.js').then JSファイルを登録(中に下記を入れ込む)
 //キャッシュ動作部分
 ├addEventListener('install' キャッシュのインストール
 ├addEventListener('activate' アクティベート
 └addEventListener('fetch' オフラインでもアクセスの際にクライアントが呼んでキャッシュ取得
 //通知部分
 ├addEventListener('push で通知を受ける
 └addEventListener("notificationclick で通知クリック時の挙動
Notification.requestPermission(function(status) { 通知許可は登録JS外でOK

キャッシュはリンク先も保持する?、、、→せえへんけど?
ブラウザのURLの鍵アイコンをクリックすると通知許可を含めて設定ができる(デフォルトの確認、許可、ブロック)
 デフォルトとブロックの時は「Push通知On」のボタンを表示 → ボタンを押すとダイアログで何が通知されるか表示しOKボタンを押せる
 許可状態のときは「Push通知Off」のアイコンを表示
 キャッシュ優先のsw.jsだと更新ボタンでもキャッシュのまま、Cookieの中のサービスワーカーを削除

Service Workerキャッシュ戦略>保存日はindexedbに置き、HTMLの有効期限は1日にする
 ※参考まで、なおindexeddbは永続データで大きくなりすぎたら使用に応じて自動的に削られる仕様だったかと
https://qiita.com/tiwu_official/items/47e8a7c3e6f2d57816d7

https://techblog.asahi-net.co.jp/entry/2018/09/28/173705
受信する端末ごとに異なるメッセージを送るにはGoogle Firebaseが使われる様である

 トークンを発行し端末とトークンを紐付け配信サーバに記録
 配信サーバでメッセージを作り、個別トークンに対しメッセージ通知
  JSONを送るがトークンを持っているもののみ通知が発火?

Notifications APIを見てみよう
https://developer.mozilla.org/ja/docs/WebAPI/Using_Web_Notifications
https://developer.mozilla.org/ja/docs/Web/API/Push_API
https://developer.mozilla.org/ja/docs/Web/API/ServiceWorkerRegistration/pushManager

モバイルでなくPCへの通知自体はServiceWorkerが不要、下記2ステップでOK(ブラウザに許可を入れるのが必要)
 Notification.requestPermission(function(status) { 許可を取り
 var n = new Notification(theTitle,options); 通知を送る

カレンダーをサブカレンダー(o)化しPWAでオフライン対応(機内モード)
 キャッシュするよう指定しても現アクセス分の有効時間のキャッシュの影響か直ぐにはオフライン化はしないようだ(反映に~30分掛かることがある)
  一度オフライン時にアクセスしエラーが出た上、ネットワークが回復すると自動にキャッシュされる
   エラーを出さずに一度通常表示をするだけではキャッシュされなかった
   アンドオイドでは通知も来る(1:準備ができるとChromeでページが読み込まれます→2:ページを表示できます)
 ServiceWorker内ではLocalStorageはセキュリティを理由らしいが使えない
  IndexedDBは使えるらしいが、、、→使えんかった、よく分らん→ラッパー要るやろでOK
 SWをインスコしたディレクトリへのアクセスでSWが動く、SWJS自体へのアクセスではない
 PHPでJSを吐いてもOK js_serviceworker.phpとかでheaderをJavascriptとして

https://webtan.impress.co.jp/e/2019/08/26/33636
JavaScriptを使えば、ページをリロードせずにブラウザのURLバーの内容を変更できるのでSPAでも戻るが使える
history.pushState(null, "Page 2", "/page2.html");
https://webtan.impress.co.jp/e/2019/09/02/33637
Fetch APIを使用してリクエストをハイジャックしたりレスポンスを変更または改ざん出来る
https://qiita.com/propella/items/6500f76c9c1521878a6b
https://developers.google.com/web/fundamentals/primers/service-workers?hl=ja
SWが分かりやすい
ServiceWorker, Cache API を使用して 4万件のアセット永続化を試した話 | 株式会社ノックノート (knocknote.co.jp)

キャッシュを解析してどれ位まで保持してるか、URL等々も確認もできる
 if(status ==200 && ok){ //okはtrue/falseが入るが文字にはなれずboolean
キャッシュ削除もできるが、Indexeddbで管理をするし、SW1発目ではインスコだけで動作しない等で扱いは手間

Sync(まだ非標準)
通信がオフからオンに変わった時点で発火。バックグラウンドで何かを実施する、indexeddbにデータを貯めオンでサーバに送る等を行う
https://qiita.com/horo/items/28bc624b8a26ffa09621
Periodic background syncはメールクライアントの受信ボックス更新のように、バックグラウンドで定期的にタスクを実行
ユーザのIPを定期的に確認しトラックできる安全性、バッテリやリソースやギガ消費などの問題がある
AddtoHomeやサイトエンゲージメントが高いや普段使いのネットワーク等で発火が判断される
https://blog.jxck.io/entries/2020-04-23/periodic-background-sync.html

WORKBOX(google)のsyncは仕様が違う?分からん
エクスポネンシャルバックオフ(補足: 最大再試行回数に達するまで、指数関数的に増加する待機時間で操作を再試行する手法 – 1秒、2秒、4秒、8秒、16秒...とシステムに負担をかけない)を採用
syncイベントはユーザがアプリケーションから離れた時にも送られます
テスト時はインターネットを遮断するか(オフライン)、ウェブサーバーを落としてください。Chrome DevToolのOfflineモードは使用しないでください!Devtoolのofflineチェックボックスはページからのリクエストのみに影響があります。サービスワーカーのリクエストは成功してしまいます

/// 開発上の注意
FetchAPIは404や500エラーをthenで受け取れない
 JS送り側>サーバ側>JS受け と丁寧に開発を
  SWからDOMは弄れない→sync全体描画やpostMessageやnew Responseの検討?
JSONの値はダブルコーテーションで括る必要がある
 header("Content-type: application/json; charset=UTF-8");
 echo '{ "response": "no data" }';
JSONでレコード数がある場合は[]で括る必要がある
 echo '[{ "response": "1" },{ "response": "2" }';
PHPではPOSTデータを$_POSTで受け取れるのは「application/x-www-form-urlencoded」又は「multipart/form-data」のみ
 file_get_contents('php://input')で受け取る
 $contents = json_decode(file_get_contents('php://input'), true);
モバイルだとhttp://でアクセスしているかどうか分かりにくいが、https://でしか動作しない

/// mmm
キャッシュが強い(失敗すれば手動でCookie/Serviceworker削除、くせ強でユーザに古いページを見せ続けるかも)
 どの範囲をキャッシュするか、キャッシュページの案内方法(お気に入りに入れる?)をどうするか
 SinglePageAppなら枠だけキャッシュさせて後は外部JSでいけるが
  工夫を考える:転送、外部JS、IFRAME、AJAX、サーバサイド、Refer、new Response等々

データもキャッシュする場合は2パターンかな、Pros cons、データをIndexeddbに持つ形ならモバイルApp的SinglePageApp的
┏online
┃1)DLしたキャッシュを表示(最新情報が届かない、だが何をキャッシュしているか分かる、サブサイト化でバックアップ用途)
┃ 普段使わないとキャッシュ更新を忘れる、SWがDL中のものを反映し表示するのに時間が掛かる(時々転送やIFRAME系でDL?)
┃2)最新を表示、裏でDLを実施(最新を表示しているので通常利用できる、DL頻度を下げたりProxy/キャッシュで動作が分からないところがある?)
┃ 何をキャッシュしているか不明、(バックアップサイトを持たず一体で便利だが、頻繁にキャッシュ全更新しがち、動作不明なことがある)
┗offline
 キャッシュを表示

Notification API(デスクトップ通知)
デスクトップ通知スケジューラー (bangboo.com)
Cache API(スケジュールのオフライン化)
https://pimpub.jpn.org/aaaaaa/o/install.php
Service worker API - Sync(バックグラウンド同期)
オフライン予約システム (bangboo.com)

Posted by funa : 06:00 PM | Web | Comment (0) | Trackback (0)


April 1, 2020

G Suite -> Google workspace - GWS
https://www.softbank.jp/biz/cloud/google/gsuite/
中途半端に移行するよりGsuite強制だと社員が勝手に使うシャドーITをなくせる
影響力のある社員の抵抗がないように、部長の関心協力→Topからのメッセージ
 デモを実施する(利点、コラボレーション、使い方)
戦略・組織の把握>パイロットユーザ(全社員の5%をGoogleガイド)>エバンジェリスト公募>全社
 画面や機能がどんどん変わる、また簡単になっていく、カチッと決め打ちはしにくい
 Gmail (アーカイブして検索で、容量無制限)
 カレンダー (会議スケジューリングのお勧めがある)
 Hangouts Chat (1to1かグループでチャット、共同編集、Voiceがあれば電話も、Botも)
 ハングアウトMeet (ビデオ通話)
 ドライブ (同時編集ができる、ここでドキュメントを作ると相互最新更新)
  ドキュメント (Word/PDF/html/txt等読込書出、AIで画像やグラフやデザインをクリックだけで、無制限変更履歴)
  スプレッドシート (Excelを変換して使う等 https://support.google.com/docs/answer/9331167?hl=ja )
  スライド (ブラウザでプレゼンテーション、PPT等から変換可、オフライン化も可だが問題がありそう)
 Currents (Google+社内SNS、フォロー、投稿、サークル、コミュニティ)
 フォーム (アンケート、クイズ/テスト、連絡先を含め申し込み欄)
 Keep (メモ:音声入力や写真も、リマインダー、Gmailユーザ共有)
 Jamboard (ホワイトボード、複数個所やマルチデバイスやGsuite連携)
 サイト (一般公開HP、イントラ)
 Apps script (aka GAS、マクロ、https://tonari-it.com/google-apps-script-manual/ )
 Cloud Search (Gsuite以外にもコネクタでAWSやMS系、Jira、Sap、Salesforce等も検索可)
 Vault (元が消されても全データ保存されている、管理者)
 管理コンソール (ユーザグループ管理/SSO/MFA、監査ログ、MDM、セキュリティ系レポート、移行ツール/API/Oauth/OpenID)
https://gsuite.google.co.jp/intl/ja/features/ 無料試用14日間

///Google Admin 管理コンソール
上ナビのタスクにダウンロード等がある
"ダッシュボード" ?
"ユーザ"でリストをCSVでDLし、一括アップロードもできる
 メールアドレス確認のメールが来ていた
"グループ"はグループオーナ/管理者/メンバー/組織全体/外部でアクセス管理
"組織部門"をツリー状に作成できる
"リソース管理"でビルディング/会議室/設備等々を設定
 カレンダーでの会議室の自動予約キャンセル(使われていない会議室が解放)
"ディレクトリ設定"で連絡先の共有、外部ディレクトリ共有の設定
"デバイス管理"でモバイル/Chromeデバイス/ブラウザ/Googleミーティングハード/エンドポイント/Jamboard
 よく分からない
"アプリ"で全ユーザONかOffか/SAMLアプリの追加
"セキュリティ"で2段階認証/アラートセンタ/ルール/PWポリシー/安全性の低いアプリへ接続/PW忘れのアカウント復元/PW強度監視/従業員IDでログイン時本人確認/3rdパーティSSO設定/Android用EMMプロバイダトークン/高度な保護機能/Context aware access/セッション時間/Cloud ConsoleとCloud SDKのセッション/OAuthのユーザーデータへのACL/API許可
"レポート" ?
"お支払い"で課金の管理、ユーザ数x費用/ドメイン登録費用/G Suite Enterprise/Voice Standard/Cloud Identity
"会社プロフィール"で管理者ID/サポート連絡先/タイムゾーン/即時か計画リリース/Googleからのお知らせ/ロゴ設定/追加ストレージ/コンプラ連絡先/データリージョン米か欧/会社自体のアカウント/カスタムURL
"管理者ロール"で特権/ヘルプデスク/サービス/ユーザ/モバイル等の権限者を設定
"ドメイン"でドメイン契約の設定/他のドメインで使用するためのドメインのホワイトリスト
"データ移行"でO365/Exchange等のメール/カレンダ/連絡先を移行できる
"サポート"でチャットできる
どうやってサポート?リモート?ファイル共有はできるのか?
ファイルが保存されているかどうか分かりにくい
保存が遅い場合も、待ってもう一度確認、全ての操作が記録されているはず

Gmailヘルプ https://support.google.com/?
各アプリでもヘルプ?があるので確認できる、FAQみたいなのも表示される
設定ギア>ここでほぼ設定している
Gmail
 迷惑メール/削除したメールは、[ゴミ箱] に 30 日間保存され、その後完全に削除
 メールはスレッドにまとめられ[削除] するとスレッド全体が削除
 Gmail で使用できる検索演算子 https://support.google.com/mail/answer/7190?hl=ja
 不要ラベル、Keyラベル等を付けて移動してもいいかも?
マイドライブ
 組織内でもグループ内でもWeb公開もURLでも編集やコメントも細かく共有設定ができる
 ファイルとしてDL、それをマイドライブにアップしG suite化できる
ドキュメント
 提案モードで修正→ツール>編集の提案の確認orチェック で承認ができる
スライド
 プレゼンター(マウス↓でメニュー表示、ノートや質問)、オンラインプレゼンは不可
コレクション
 +のURLのみ集められる?モバイルやPCは駄目かも
Keep
 メモの共有を外部にするとメールが送信
カレンダー
 デスクトップ通知は各種許可設定があり調べよ、Chromeの機能 chrome://flags/#enable-native-notifications

何をサルベージできるのか不明:メールログ、Vaultで削除ファイルは見れる?

G-suiteはオフラインでも使える
 管理者側設定:許可設定
 ユーザ側設定:オフライン許可設定

O365とのプロコン
 G-suiteは少し安い、使用が簡単だがプア、共有や共同編集に優位、オフラインで機能が弱い

■アカウント
GWSアカウント
GWSグループメール
 GWSメーリングリスト(ML間のみで連絡できる)
個人gmailアカウント(Googleアカウント)
GWS以外のメール(メールボックス)※独自ドメインでのGoogleアカウントを作成すればいい
 独自ドメインでGoogleアカウントを取得する方法 (infact1.co.jp)
Gmailアカウントの作成方法と注意点:Tech TIPS - @IT (itmedia.co.jp)

■Gmail 自動振り分け(迷惑メールのブロック)
設定ギア>全て表示>フィルタ関連のタブ
含むの項目使いやすい(特殊文字を省いて半角スペース区切りでキーワード網羅がいい、subject等は括弧や特殊文字で思うように行きにくい)
 各項目間はAnd条件:あいうえお かきくけこ
 各項目でORやAND指定ができる:あいうえお OR かきくけこ
 覚えておきたいGmailの絞り込み条件指定方法|フィルタ利用時には検索演算子を使おう (keizokuma.com)
 フィルタや自動化ルールで正規表現を使用する - 検索広告 360 ヘルプ (google.com)
 gmailのフィルタ機能は超便利 - 愚鈍人 (hustle.ne.jp)

■Google spreadsheet
Googleスプシのvlookupは一番左の列のみしか検索しない仕様
アプリでシートを読み込むなら名前付き範囲が便利、文字列を変えず範囲を扱えメンテフリーになるから

/// Connected sheetsのデータ漏洩問題、というかスプシ自体ザル
Connected sheetsを閲覧するだけならBQ権限不要でスプシへの閲覧共有だけで良い
 BQ権限保持者でデータロードが必要だが、誰かが一度ロード済みでキャッシュがあれば他人はBQ権限不要ということ
  抽出シートに保存しておいた場合のみでなくBQ連携画面だけでも見れてしまう
   時間制限設定ができるか、GWS制御設定があるかは分らんがリスクは大きい
  スプシに参照権限だけだとConnected sheetsのBQリロード更新はできない
抽出シートの別のセルに転記するにはスプシへの編集権限が必要
スプシの編集権限があればBQのクエリが編集できる

●BQ権限で管理ができず、スプシデータ削除やスプシ権限の厳格な管理が必要

/// 特定のデータだけ共有
スプシ設定のIMPORTRANGE関数で共有したいデータだけ別のシートに反映させ、別シートのみ共有できる
 >スプシの参照権限だけでBQ権限がなくても閲覧可能、関数からのアクセス許可は必要(両方オーナならポチるのみ)
  >閲覧共有のないスプシでさえ、URLとシート名があれば、importrangeを仕込めば見れそうなところまで行けるのが危険

■Google Form
回答で保存先スプレッドシートを指定できる https://www.infact1.co.jp/staff_blog/webmarketing/43713/

■GAS
doPostとdoGetが使えるがほとんど何もできない? GASをWeb公開して実行(doPostとdoGet) | アンクルエンジニアの気づき (uncle-atsushi.com)

■Googleデータポータル(データスタジオ > Looker studio)
ディメンション:未集計の値、指標を出す項目
指標(metrics):集計、sumとか、ディメンションを計るという位置づけ
データを統合:複数の表を各種joinする
フィルタ:ディメンション等の条件で絞る
コントロール:プルダウン等の操作系を作る、適応するには適応したいものを含めて、配置>グループ
 事前にScheduledQueryでBQに表を日次で整備しておく等もあり
 表の指標に先月とのdiffを計算 ROUND(costThisMonth - NARY_MAX(costMonthAgo, 0), 0)
  ヌルぽなら0に変えて引く
 棒グラフは期間のディメンションにperiod、ディメンションにperiod、指標にcost等でsumになる、並び替えをperiod
 デカい表でもデフォルトのデータソース更新は12時間ごとで使用に耐えるかも、joinもできそうで中間テーブルを作る意味はどこにある?集計やカラム数の調整のパフォーマンス向上はどれほど?
 →サマって中間テーブルを作った方が制御やパフォーマンスが良い(無いとつらい)
 →固定値等の素のデータをDataStudioは扱えないと思われ、SQLで定義しバッチでDB table保存しておくこと(viewはダメぽ)
Data Studio でフィルタパラメータを URL 指定する方法 | by Masahiro Yasuda | google-cloud-jp | Medium
 HTML等にembedする際にURL引数で操りやすくなる
レポートを埋め込む - Looker Studioのヘルプ (google.com)
 [ファイル] > [レポートを埋め込む] > [埋め込みを有効にする] 設定

PARSE_DATE("%Y%m", period)でテキストをLookerStudio上で日付扱いにでき指標にできる
期間比較を使い前年対比のグラフを出したいのだがBQ側でDateである必要がありそう(日付形式がyyyy-mm-dd等で決まっているようだ)
 期間のディメンションを設定することで日付カラムの指定ができる
  デフォルトの日付範囲や比較期間が設定できるようになる
ソースの型を変更した等の小さな変更でもソースを選択しなおし再接続すること

BQのデータ取得はページの作成者:オーナでの認証、サービスアカウントでの認証、閲覧者での認証の3種類から選択できる
 オーナにBQ権限があればいいか、SAか、各閲覧者か、決められる。ページの共有も要るが

■サービスアカウントでのGWSドライブやGAS利用
GWSのテナント設定で許可ドメインは一つだけ設定できる
 それ以外のドメインはGWSテナントに入れない
テナント内にサブ組織を作成し、そのサブで共有ドライブを外部共有可にする
 全ての外部共有を許可するのでセキュリティ問題が残る
GWSのドメイン委任設定をSAのクライアントIDに対して設定
 テナント全体のアカウントでGWSアクセス可になってしまう
SAのグループがアクセス可能なOUを作りOU内で共有ドライブを作成
 これは良さそう

■Zapier
IFTTTみたいなやつ、アプリ間連携が簡単にできる
ドキュメントがあるのかないのか、全然見つからないので自分で検証が必要、簡単だが手間
少し値を変えれば保存されるので弄る前にコピーをしコピーを弄る
Zap上のGoogleSpreadsheetのIDは行番号を含む行作成時のユニークID、他の行が削除され行番号がずれるとIDが取得できなくなる、RowID(他の行が削除されても参照が維持される)かRowNumber(行番号で再度他のカラムで検索すれば新たに参照可)を使いたい

■Slack
ChannelにJoin
スレッド返信(@メンションを付けた方がいい?)
リアクションでアイコン返信
メッセージ編集や削除
ブックマーク
ダイレクトメッセージ:
 新規メッセージで相手を選んで送信
 @メンションを付けてチャンネルに投稿するメッセージとは異なる
```で挟むと囲み線、`で囲むと囲み線で赤字
 うまくいかんときは文字を選択し右クリックで</>□等で
>>>を付けると引用
検索オプション
 in:channel from:userid
ナビを常時表示:サイドバーopen(?)
https://dekiru.net/category/service-software/slack/

Posted by funa : 12:01 AM | Web | Comment (0) | Trackback (0)


March 1, 2020

CSS Grid

[B! css] 2022年のモダンCSS改 (hatena.ne.jp)

中央揃え
.container{
  display: flex;
  justify-content: center;
  align-items: center;
}
.container{

  display: grid;
  justify-content: center;
}

アンカーリンク移動をスムーズにする
html {
  scroll-behavior: smooth;
}

スクロールで位置をずらすトップからのマージン
section {
  scroll-margin-top: 60px;
}

すりガラス
.box{
  backdrop-filter: blur(8px);
  background-color: rgba(255, 255, 255, 0.5);
}

1行でも両端ぞろえ
th{
  text-align-last: justify;
}

ナビがfixedの場合の本部のスクロール連動をなくす
.navi{
  overscroll-behavior-y: contain;
}

++++++++++++++++++
2020-03-01 wrote
Gridは悪名高いテーブルレイアウトと考え方がまるで同じ
CSSの方が糞であったであろう、テーブルこそが発明でしょうに、セマンティック?
containerにdisplay: grid か flex か table を指定するので直接の要素には混在不可、入れ子なら可
https://ics.media/entry/15921/

■CSS grid
https://qiita.com/kura07/items/e633b35e33e43240d363
https://qiita.com/kura07/items/486c19045aab8090d6d9
 ページ全体のレイアウト、グリッドレイアウト
 コンテナを作り、グリッドに名前を付けて、割り当てる
 <section class="container">
  <div class="visual">(メインビジュアル)</div>
  <div class="number">(数字)</div>
  <div class="expression">(テキスト)</div>
  <div class="other">(3枚の写真)</div>
 </section>

 .container {
  display: grid;

  grid-template:
   "visual number expression" 1fr
   "visual other other" 220px /
   40% 120px 1fr;
 }

 .visual {
  grid-area: visual;
 }


 @media (max-width: 800px) {
  .container {
   grid-template:
   "visual visual" 100vw
   "number expression" 1fr
   "other other" auto /
   120px 1fr
  }
 }

■Flexbox
https://www.webcreatorbox.com/tech/css-flexbox-cheat-sheet
https://qiita.com/junya/items/7762da8052d86462f232
 縦横揃え、可変サイズ、でも複数配置が駄目、1行の並び
  justify-content
  align-items
  flex-grow
  flex-shrink

 .container {
  display: flex;
  justify-content: center;
  align-items: center;
 }

■display: table / display: table-cell
https://techacademy.jp/magazine/19415
https://app.codegrid.net/entry/css-table-1
https://www.yoheim.net/blog.php?q=20150102
https://nxpg.net/blog/tech/?p=10764
CSSのvertical-alignが効かない縦並び(display:gridの中にdisplay:tableの中にdisplay:table-cell)
#container{
 display: grid;
 grid-template-rows: 25px 1fr;
 grid-template-columns: 300px 1fr 200px;
}
#column_right{
   grid-row: 2;
 grid-column: 3 / 4;
 display: table;
}
#area{
 background-color: #eee;
 width: 150px;
 height: 150px;
 text-align: center;
 display: table-cell;
 vertical-align: middle;
}
<div id="container">
  <div id="navi_left">...</div><div id="navi_right">...</div>
  <div id="contents">...</div><div id="area">...</div>
</div>

■Float
 テキストの回りこみ
 .leftBox {
     width: 45%;
     float: left;
 }

Floatレイアウト
https://www.bangboo.com/cms/blog/page_18.html
Padding/Float/Height100%の問題
https://www.bangboo.com/cms/blog/page_184.html

■object-fit
 画像の比率
 img {
  object-fit: cover;
 }
 .image1 {
  object-position: 30% 40%;
 }

■その他
spanタグにline-heightを設定しても行間は設定できない、display:block;を追加するか親で設定する
ボックス要素のセンタリング(中のテキストは左寄せ)
 <div style="width:500px"><div style="text-align:left; display:inline-block;">
 https://qiita.com/KAMEch/items/b52c5e23212b8fef81a7
 https://www.granfairs.com/blog/staff/centering-by-css

リストのマーカの位置に迷った
ulのpadding-leftが外側からマーカの右側迄の距離で15pxとかは必要
liのpadding-leftはマーカの右からから先頭文字までの距離で0px等で良い
https://maku77.github.io/web/layout/list-margin.html


2019見直したいCSS,Javascript
https://speakerdeck.com/tonkotsuboy_com/2019nian-madenijian-zhi-siteokitai-cssjavascriptfalseshou-fa

Posted by funa : 03:03 AM | Web | Comment (0) | Trackback (0)


January 21, 2020

Update your home page

そもそも下手糞魂、 BRF BANGBOO のトレーナを思い出したわSince 1992

■Web系通信系
/// WebRTC
リアルタイムにブラウザ間P2Pで送受信
ウェブブラウザ間のボイスチャット、ビデオチャット、ファイル共有が可能

/// Service Worker
訪問がない状態でのバックグラウンド同期、プッシュメッセージ
データの更新を集中的に受信して複数ページがデータの一部を利用
https://developer.mozilla.org/ja/docs/Web/API/Service_Worker_API
 →下記PWAで詳しく

/// Fetch API
jsのXMLHttpRequestに変わる非同期通信の手段、ServiceWorkerで使われる

/// Beacon API
window.onunload/window閉じる際に非同期HTTP通信を確実実行するAPI
統計情報等

■PWA
Progressive Web Apps
https://www.bangboo.com/cms/blog/page_333.html


■ユーザーエージェント(UA)凍結・非推奨
https://forest.watch.impress.co.jp/docs/serial/yajiuma/1229968.html
https://anond.hatelabo.jp/20200120125002

■文化を屠殺する
https://b.hatena.ne.jp/entry/s/anond.hatelabo.jp/20200311165317

■堕落したウェブはまだ直せる
https://japan.cnet.com/article/35133798/

表示はHTMLでやり、処理はサーバー側でやる
表示はメディアであり、処理はコンピューティング、そういうタイプで

==========


https://twitter.com/ken1kuroyama/status/1220258901850869760
トライアルは乗ったことがないが、コレは分かりやすいな
ヒザを緩めてから足ピンしながらチンコをハンドルに擦り上体反るんやな
MXとは逆やからこういうムーブは普通体が反応せえへん、

Posted by funa : 12:20 AM | Web | Comment (0) | Trackback (0)


November 22, 2019

Cloud 9

無料でクラウドを喰らう
AWS https://aws.amazon.com/jp/free/?all-free-tier.sort-by=item.additionalFields.SortRank&all-free-tier.sort-order=asc
GCP https://cloud.google.com/free/docs/gcp-free-tier?hl=ja
Azure https://azure.microsoft.com/ja-jp/free/
あくまでインフラだな、ソフトウェアレイヤーの人は自分でやる必要あるのか?マネジドでリソースが足りてると余計

=================================
■AWS
VPC(仮想Privateクラウド)>ELB(ロードバランサ)>EC2(仮想サーバ)x2>ElastiCache(インメモリ)>RDS(RDBZ)>S3(ストレージ)>Redshift(分析)
 EC2は機能毎、S3は変換前とRedshift変換後の前後、Rout53でラウンドロビン、動画配信、SageMaker/Deep learning ami

■ユーザ管理、セキュリティ
https://www.tdi.co.jp/miso/aws-day1-security-1
https://qiita.com/14kw/items/07d693a072ae0e99cf34
https://www.ashisuto.co.jp/security_blog/article/201902-aws.html

///ログイン
https://aws.amazon.com/jp/
チュート https://aws.amazon.com/jp/getting-started/tutorials/

///MFAの設定
Google 認証システムをモバイルにインスコ
モバイルに出た6桁を入力、30s後にでる6桁を入力(エラーなら削除しQR読み直してやりおなす)

///EC2
キーunco.pemでインスタンスを作成
ロードバランサーyarichinの設定

///その他
RDSのDBインスタンスyoshiwaraを作成 (ID:chinco/kintama)
ElastiCacheのインスタンスformsof48を作成
S3のインスタンスomekoを作成

■無料でやりたいが足がでるのでは
https://www.ryotaku.com/entry/2019/03/12/172937
https://dev.classmethod.jp/cloud/aws/overall-summary-about-aws-free-tier/

各サービスで有料等があるので要注意、1ヶ月750時間、複数インスタンス、ElasticIP割り当て、ビリング確認、予算、アラート通知

■AI Tensorflow は?
https://aws.amazon.com/jp/tensorflow/
https://aws.amazon.com/jp/machine-learning/
https://aws.amazon.com/jp/machine-learning/amis/
SageMaker/Deep learning ami?無料じゃむりそう

=================================
■GCP
https://www.bangboo.com/cms/blog/page_347.html

=================================
■Azure
12 か月間 最初の30日間¥22,500分
https://portal.azure.com
ホーム>無料使用版>取り消し


ロードバランサの自動セッション維持(クッキー、URL、HTTPヘッダー)の具合を見たかったが、
https://www.fujitsu.com/jp/products/network/security-bandwidth-control-load-balancer/ipcom/material/data/1/2.html


大体の設計をして設定を詰めていく流れでいいのかね、使いたいサービス重点で
きちんと動けば気持ちいいかな、箱庭的な雰囲気もある

Posted by funa : 09:42 PM | Web | Comment (0) | Trackback (0)


January 1, 2019

Adobe Sensei

安定性がない、AI系操作で画像が大きく、メモリと仮想メモリに余裕がないと落ちる
日本語フォントは魅力的だが、俺的機能的にはCreativeSuiteで充分だったかも

オブジェクト選択ツール
 人物や動物などの被写体の周りを矩形か投げ縄で囲むだけで選択、自動調節で境界削除がよいようだ
プロパティパネル
 「背景を削除」をクリックするだけで、レイヤーマスク付きで被写体を切り抜く
被写体を選択
 選択範囲>被写体を選択
コンテンツに応じた移動ツール http://shuffle.genkosha.com/software/photoshop_navi/cs6_features/8160.html
 D&Dで移動すれば移動と同時に移動元を埋める(移動用途)
パッチ https://www.vanfu-vts.jp/blog/2014/05/photoshop
 D&Dすればドロップ先の画像でドラッグ元を埋める(消す用途)
マッチフォント
 画像からフォントを検索できる
ワープツール
 メッシュポイント変形
アートボード https://helpx.adobe.com/jp/photoshop/how-to/creating-multiple-banners-photoshop.html
 モバイルやPC等各デバイスごとの画像を一括管理
3Dオブジェクト https://www.pc-koubou.jp/magazine/24943
 3DCGみたいだ、3Dマテリアルスポイトもコレ用みたい
プリセットパレット/Adobe Fontsの充実
 プリセットは質向上、フォントはAdobe謹製やお気に入りやフィルタリング検索
変形時の縦横比固定
 Shiftキーが不要に(反対操作に

////Font
A-OTF 見出ゴMB31 Pr6N
A-OTF 見出ミンMA31 Pr6N
源ノ角ゴシック JP Heavy
TBカリグラゴシック Std E

TA-rb
TA-方縦M500
TA-candy
VDL ロゴJrブラック
TA-F1ブロックライン
かづらき SP2N
RoぶらっしゅStd
VDL 京千社

////人物切抜き
http://ess-graphics.com/blog/2016/11/kirinuki/
https://design-trekker.jp/design/photoshop/photoshop-clipping-hair/
http://photoshopvip.net/new-cropping
 クイック選択ツール(ブラシ系の選択、はみ出たところはAlt+で消す)等で大体選択
 選択範囲>選択とマスク
 境界線調整ブラシツールで足したり、引いたりを太さや表示透明度を調整しながら行う
 ↓旧ver
https://liginc.co.jp/web/design/photoshop/37657/
https://sitebk.com/photoshop/hair-clippings/
 クイック選択ツール(ブラシ系の選択、はみ出たところはAlt+で消す)等で大体選択
 境界線を調整

////Creative Cloudでアドベと契約(ちぎり)
https://www.adobe.com/jp/creativecloud/plans.html

既存の Creative Suite 製品のインストールは、Creative Cloud のデスクトップアプリケーションのインストールの影響を受けません。例えば、Photoshop CS6 永続ライセンス版を Photoshop CC と同じコンピューターにインストールして使用することもできます。
ライセンス認証は 1 ライセンスにつき 2 台のコンピューターに制限されています。これらのデバイスで同時にソフトウェアを使用することはできません。

CSとCCの並行可能、PCにインスコしてHDDがクラッシュしてももう一台にインスコできる、それもクラッシュすれば一度解約?
https://helpx.adobe.com/jp/creative-cloud/faq.html

ライセンス認証解除(ログアウトするだけ)
https://helpx.adobe.com/jp/download-install/kb/activate-deactivate-products.html
体験版またはサブスクリプションを解約
https://helpx.adobe.com/jp/manage-account/using/cancel-subscription.html

年契約の分割月払いなので、解約しようとすると違約金が発生する
 違約金は残っている期間の50%を一括
 なおクーリングオフで契約から14日は無料で解約可、ということは

////LightroomとLightroom classicの違い
Lightroomはクラウド使用なので画像UPが必要、Windows7非対応、モバイル端末使用向き
クラシックはPCローカル操作、Windows7対応

========================
■ILLUSTRATOR CS2 がWINDOWS10でフリーズする件
https://p2bco.net/26122020-10490.html

Window左下のスタートボタン ⇒ 「設定」

「設定」 ⇒ 「時刻と言語」 ⇒ 左側にある「言語」 ⇒ 右の「優先する言語」の「日本語」

右の「優先する言語」の「日本語」 ⇒ 「オプション」 ⇒ 左の「Microsoft IME」入力方式エディター

左の「Microsoft IME」入力方式エディター ⇒ 「オプション」 ⇒ 「全般」

「全般」 ⇒ 「以前のバージョンの Microsoft IME を使う」をオンにする

========================
■Flash廃止
基本はHTML5、WebGL、WebAssemblyで作り直すがIEモードでFlashが使えるようにできる

●MS
https://blogs.windows.com/japan/2020/09/14/update-adobe-flash-end-support/
Microsoft Edge では Internet Explorer モードで実行する場合に、Adobe Flash Player をラグインとして読み込みできるようにいたします。本質的に、Internet Explorer 11 でもプラグインを使用できるようになります。マイクロソフトが提供する Adobe Flash Player からの移行後は、サードパーティ製プラグインの扱いとなるため、マイクロソフトのカスタマー サポートの対象外

2021 年 1 月より、Adobe Flash Player は既定で無効化され、2020 年 6 月にリリースされた KB4561600 よりも古いバージョンはすべてブロック、「Update for Removal of Adobe Flash Player」という更新プログラムが提供される予定、サポート終了前にお使いのシステムから Adobe Flash Player を削除したい場合は、2020 年秋の Microsoft Update カタログにて公開されるこの更新プログラムをご利用ください。この更新プログラムは永久的で、アンインストールできませんのでご注意ください。

●IM
https://product.intra-mart.support/hc/ja/articles/360030883894-2021-1-11%E4%BB%A5%E9%99%8D-Adobe-Flash-Player-%E3%81%8C%E5%88%A9%E7%94%A8%E3%81%A7%E3%81%8D%E3%81%AA%E3%81%8F%E3%81%AA%E3%82%8A%E3%81%BE%E3%81%99-%E5%90%8C%E3%83%84%E3%83%BC%E3%83%AB%E3%82%92%E5%88%A9%E7%94%A8%E3%81%97%E3%81%9F%E5%BC%8A%E7%A4%BE%E8%A3%BD%E5%93%81%E3%81%AE%E4%B8%80%E9%83%A8%E7%94%BB%E9%9D%A2%E3%82%82%E5%88%A9%E7%94%A8%E3%81%A7%E3%81%8D%E3%81%AA%E3%81%8F%E3%81%AA%E3%82%8A%E3%81%BE%E3%81%99

Adobe Flash Playerの実行をブロックされないようにホワイトリストに記載することで動作するものと考えられます(1,2の対応が必要です)。
 1. Adobe Flash Player の入手が可能である2020年内中に Adobe Flash Player インストーラを入手してください。
  上記のSandbox環境に入手した Adobe Flash Player をセットアップします。
 2. 以下の回避方法を Adobe社 の法人サポートご加入のもと対応してください。
  ・管理者がエンタープライズ向け機能を有効化し利用のブロックを停止してください。
  ・エンタープライズ向けの機能として、Adobe Flash Player 有効サイトのホワイトリストの指定可能としてください。
  ・ホワイトリストは Adobe Flash Player の設定ファイル(mms.cfg) に記載してください。
  参考:https://www.adobe.com/content/dam/acom/en/devnet/flashplayer/articles/flash_player_admin_guide/pdf/latest/flash_player_32_0_admin_guide.pdf 

インストールされてるバージョンはここで分かる
 https://get.adobe.com/jp/flashplayer/about/
インストール場所
 C:\\Windows\\System32\\Macromed\\Flash
mms.cfg(なければ~テキストで作成可)
 C:\\Windows\\System32\\Macromed\\Flash あるいは  C:\\Windows\\SysWOW64\\Macromed\\Flash

●Adobe
https://www.adobe.com/content/dam/acom/en/devnet/flashplayer/articles/flash_player_admin_guide/pdf/latest/flash_player_32_0_admin_guide.pdf
Insterllerの確保できない(WinではFlashプリセットされており、WinUpdateで更新をする)
 C:\\Windows\\SysWOW64\\Macromed\\Flash
 どれか不明 GetFlash.exe, FlashUtilnn‐n_ActiveX.exe, FlashUtilnnn_Plugin.exe, FlashUtilnnn_Pepper.exe, or FlashPlayerUpdateService.exe, install_flash_player_active_x.msi, install_flash_player_11_activeX.msi

●IEでFlashを一時停止して問題なく使用ができるか確認
    メニューバーの[ツール]→[アドオンの管理]を選択します。
    [アドオンの管理]画面が表示されます。
    [Shockwave Flash Object]を選択し、[無効にする]をクリックします。

●JavascriptがFlash Flashを実行できるJavaScriptライブラリ
JavaScript製FlashPlayer「swf2js」swfをそのままHTML5に変換。 - Qiita
HTML5でFlashを実行できるJavaScriptライブラリまとめ | hifive開発者ブログ (htmlhifive.com)
等々

Posted by funa : 11:11 AM | Web | Comment (0) | Trackback (0)


August 11, 2018

Summer time blues

多言語でシステムを作ってたつもりだが、時間について意識してなかったかも。
面倒だが時間ができれば要チェックだ。サマータイム

■国際時間
■サーバーマシン
■クライアントマシン
■ローカル時間

http://blogos.com/article/316473/
https://blogs.msdn.microsoft.com/nakama/2018/08/11/timezone/
http://novtan.hatenablog.com/entry/2018/08/10/201046

1)ブログは投稿時間が手入力の選択制になっていた
2)DBには何の時間を入れている?サーバーの時間か?DBサーバの時間?
3)cronは時間を記載しているだけだから、サーバーの時間か?
4) バッチスケジュールの破綻
  実施タイミングは3amとかそれぞれの地域で違う
   日本案の2hrsは特殊、通常1hr
  開始日は22hrsになる バッチが走るキック時間が無くなる
   例:3/15 3amが5amに飛ぶ、3時4時がない
  終了日は26hrsになる バッチ2回走るかも
   例:10/25 5amなると思うと3amに戻る、3時4時が2回くる
   1回目はJST Daylight Time(DT),2回目はJST Standard Time(ST)と区別が必要
5)サーバ間の時間の統一、特に異業者間
6) クライアントから時間をサーバに送るアプリ(Webだとあんまりない?)
7) DBへの記録形式、アプリで生成する時間、テキスト記録系の時間は注意
8) 時系列、並び順(特に終了日は2回同じ時間が来るから)
  UTCで全て記録して、表示時にはアプリに持たせたロケールを使う
   日時の手入力だが夏時間を選択できるようにする?ロケールでUIF変えるの?

   OSのロケールは使わず独立させたいなぁ
   入力者と表示者のロケールが違う可能性、何を優先させるか、選択性


//// Active Directoryメモが見つかった AD
■ユーザ
AGDLP:アカウント(A)をグローバルグループ(G)に追加し、グローバルグループをドメインローカルグループ(DL)に追加して、ドメインローカルグループにアクセス許可(P)を下記ツールで
  「Active Directoryユーザーとコンピューター」管理ツールADUC
  「Active Directory管理センター」管理ツール
  「csvde」コマンド(コマンドプロンプトから実行)
  「ldifde」コマンド(コマンドプロンプトから実行)
  「dsadd」コマンド(コマンドプロンプトから実行)
  「New-ADUser」コマンドレット(Windows PowerShellから実行)

管理者グループおよびアカウント
  Enterprise Admins (フォレスト ルート ドメインにのみ存在)
  Domain Admins (すべてのドメインに存在)
  Schema Admins (フォレスト ルート ドメインにのみ存在)
  Group Policy Creator Owners (フォレスト ルート ドメインにのみ存在)
  Administrators グループ
  Administrator アカウント
  DS Restore Mode Administrator (ディレクトリ サービス復元モードでのみ使用可能。 ドメイン コントローラのローカル アカウント)

管理者アカウントの種類
  ローカルadmin=Server(ローカル コンピュータのすべての機能に無制限にアクセス
  ドメインadmin=AD(ドメイン、保護されていない場合はフォレスト全体の全機能
  フォレストadmin=forestRoot,AD(Enterprise Adminsグループは、フォレスト全体の全機能、証明機関のインスコでフォレスト内の任意のユーザーのふりができます)

通常ユーザとadminのユーザ名を変え切り替えてもらう

■オブジェクト
  グループ
  コンピューター(自動作成)
  OU
  グループポリシー(ユーザーやコンピューターへの設定を一元的に管理)
  プリンタ(プロパティのセキュリティタブでディレクトリに登録チェックをつけるとADへ登録される)
  共有フォルダ(フォルダ共有後にADUCで登録)
  サイト(ドメインコントローラー同士で複製が15s後に起こる範囲、外は3hr後)

■シェアポイント
AD
├ADグループ
│└ADユーザ
│ └AD社外ユーザ

└──SharePointグループ(SharePoint内でのみ使用可)

SPのアクセス管理はADユーザでもADグループでもSPグループでも良い
社外ユーザもAD(orLDAP/DB etc.)に入れれば使える
社外管理にはブラウザに証明書をインストールしたり、モバイルはVPNで社内からアクセスしたり

AD社外ユーザの注意点
 アクセス範囲を決め特定のフォルダやイントラサイトしか無理にする
 ほぼSharePoint用?
 SPをDMZに置く等の物理的に設計する?

※忘れかけ、セキュリティグループとディストリビューショングループ
SGはフォルダへの権限等用、グループメール付SGやメール無しの種類がある
DLはグループメール用
OUはグループポリシー用

Active Directoryオブジェクトの種類と効果的な活用方法:基礎から分かるActive Directory再入門(9) - @IT (atmarkit.co.jp)
Windowsのグループアカウントの種類を知る:Tech TIPS - @IT (atmarkit.co.jp)

=========================
Win10 ゲーミング設定
https://chimolog.co/bto-gaming-pc-settings/

ChromeにはServiceWorkersの無効化を
https://qiita.com/rana_kualu/items/52d8cb7b200d6fefddc8
https://www.google.com/search?q=chrome+flags+service+worker

Posted by funa : 06:42 PM | Web | Comment (0) | Trackback (0)


Navi: <  1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13  >
PhotoGallery


TWITTER
Search

Mobile
QR for cellphone  QR for smart phone
For mobile click here
For smart phone click here
Popular Page
#1Web
#2Hiace 200
#3Gadget
#4The beginning of CSSレイアウト
#5Column
#6Web font test
#7Ora Ora Ora Ora Ora
#8Wifi cam
#9みたらし団子
#10Arcade Controller
#11G Suite
#12PC SPEC 2012.8
#13Javascript
#14REMIX DTM DAW - Acid
#15RSS Radio
#16Optimost
#17通話SIM
#18Attachment
#19Summer time blues
#20Enigma
#21Git
#22Warning!! Page Expired.
#23Speaker
#24Darwinian Theory Of Evolution
#25AV首相
#26htaccess mod_rewite
#27/// BANGBOO BLOG /// From 2016-01-01 To 2016-01-31
#28竹書房
#29F☆ck CSS
#30Automobile Inspection
#31No ID
#32Win7 / Win10 Insco
#33Speaker
#34Arcade Controller
#35Agile
#36G Suite
#37Personal Information Privacy Act
#38Europe
#39Warning!! Page Expired.
#40GoogleMap Moblile
#41CSS Selectors
#42MySQL DB Database
#43Ant
#44☆od damnit
#45Teeth Teeth
#46Itinerary with a eurail pass
#47PHP Developer
#48Affiliate
#49/// BANGBOO BLOG /// From 2019-01-01 To 2019-01-31
#50/// BANGBOO BLOG /// From 2019-09-01 To 2019-09-30
#51/// BANGBOO BLOG /// On 2020-03-01
#52/// BANGBOO BLOG /// On 2020-04-01
#53Windows env tips
#54恐慌からの脱出方法
#55MARUTAI
#56A Rainbow Between Clouds‏
#57ER
#58PDF in cellphone with microSD
#59DJ
#60ICOCA
#61Departures
#62Update your home page
#63CSS Grid
#64恐慌からの脱出方法
#65ハチロクカフェ
#66/// BANGBOO BLOG /// On 2016-03-31
#67/// BANGBOO BLOG /// From 2017-02-01 To 2017-02-28
#68/// BANGBOO BLOG /// From 2019-07-01 To 2019-07-31
#69/// BANGBOO BLOG /// From 2019-10-01 To 2019-10-31
#70/// BANGBOO BLOG /// On 2020-01-21
#71Bike
#72Where Hiphop lives!!
#73The team that always wins
#74Tora Tora Tora
#75Blog Ping
#76無料ストレージ
#77jQuery - write less, do more.
#78Adobe Premire6.0 (Guru R.I.P.)
#79PC SPEC 2007.7
#80Google Sitemap
#81Information privacy & antispam law
#82Wifi security camera with solar panel & small battery
#83Hope get back to normal
#84Vice versa
#85ハイエースのメンテ
#86Camoufla
#87α7Ⅱ
#88Jack up Hiace
#89Fucking tire
#90Big D
#914 Pole Plug
#925-year-old shit
#93Emancipation Proclamation
#94Windows env tips
#95Meritocracy
#96Focus zone
#97Raspberry Pi
#98Mind Control
#99Interview
#100Branding Excellent
Category
Recent Entry
Trackback
Comment
Archive
<     May 2024     >
Sun Mon Tue Wed Thi Fri Sat
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Link