狛ログ

オフィス狛 技術部のJoeです。

数か月前になりますが、Apache HTTP Web Server 2.4系における複数の脆弱性に対応した Apache HTTP Web Server 2.4.41 が公開されました。
https://www.apachelounge.com/

担当したプロジェクトのWindows Serverがアップデート要のバージョンであったため、Apacheのアップデートを行ったのですが、「インストーラーをダウンロードして実行」のように簡単にはいかなかったので、備忘も兼ねて記事にしてみました。

アップデートを実施した環境は以下になります。
※OSやバージョンにより手順が異なる場合があるのでご注意ください。
OS：Windows Server 2012 R2
Apache：2.4.29 → 2.4.41

Apacheのアップデート

①Apacheのダウンロード

下記サイトよりダウンロードします。
https://www.apachelounge.com/

[手順]
左のメニューから「Downloads」を選択
→ ビルドバージョン（VCxx、VSxx など）を選択
→ 対象のApacheバージョンを選択してダウンロード

※ビルドバージョンの「VCxx、VSxx」は、ビルドされたVisual Studioのバージョンになるので、ご利用の環境により選択してください。
・VC14：Visual Studio C++ 2015
・VC15：Visual Studio C++ 2017
・VS16：Visual Studio C++ 2019

②アップデート前Apacheバックアップ

アップデート前の「Apache24」フォルダを別の場所へバックアップしておきます。
※アップデート後に、ソースや設定ファイル等を移行します

③コマンドプロンプト起動（管理者）

コマンドプロンプトを管理者として実行します。

④Apacheアンインストール

コマンドプロンプトで下記のコマンドを入力し、Apacheを停止してアンインストールします。

cd [Apacheのインストール先フォルダ]\bin
httpd -k shutdown
httpd -k uninstall

⑤Apacheフォルダ配置

上記①でダウンロードしたファイルを解凍した新しいバージョンの「Apache24」フォルダを、Apacheのインストール先フォルダに配置します。（旧バージョンのフォルダはバックアップしているので、私はこのタイミングで削除しました）

⑥インストール

コマンドプロンプトで下記のコマンドを入力し、Apacheをインストールします。

cd [Apacheのインストール先フォルダ]\bin
httpd -k install

⑦設定ファイル反映

ソースや設定ファイルを、アップデート後の「Apache24」フォルダに移行します。

⑧Apacheスタート

コマンドプロンプトで下記のコマンドを入力し、Apacheをスタートします。

cd [Apacheのインストール先フォルダ]\bin
httpd -k start

⑨バージョン確認

コマンドプロンプトで下記のコマンドを入力し、Apacheをスタートします。

cd [Apacheのインストール先フォルダ]\bin
httpd -v

以下のように出力され、正しくアップデートされました。

C:\Program Files\Apache Software Foundation\Apache24\bin>httpd -v
Server version: Apache/2.4.41 (Win64)
Apache Lounge VC14 Server built:   Aug 12 2019 10:48:01

⑩サービスの設定を確認

Apacheの自動起動などを設定している場合は、念のためサービスで設定を確認しておきます。


以上でアップデートが完了になります。

オフィス狛 技術部のKoma（Twitterアカウントの中の人＆CEO）です。

iOSに限ったことではないですが、
クライアントアプリとバックエンド（API）のバージョンの整合性を取るの面倒ですよね・・・・
バックエンドの都合で、どうしてもiOSを強制的にアップデートさせたい事もあります。

弊社の場合、プロジェクトにもよりますが、独自実装を行う方法と、プラグインを使う方法を使い分けています。
独自実装を行うのは、業務の兼ね合いだったり、バックエンド（API）の都合だったり、様々です。

今回はプラグインを使うパターンを説明します。
使うプラグインは「Siren」というものです。

ArtSabintsev/Siren

他のサイトなどで、導入方法は説明あるのですが、実用的な説明をしているものは少ないので、そこにポイントを絞って説明します。

と言っても・・・・・

let siren = Siren.shared
siren.presentationManager = PresentationManager(forceLanguageLocalization: .japanese)
siren.rulesManager = RulesManager(
    majorUpdateRules: Rules(promptFrequency: .immediately, forAlertType: .force), // A.b.c.d
    minorUpdateRules: Rules(promptFrequency: .immediately, forAlertType: .option), // a.B.c.d
    patchUpdateRules: Rules(promptFrequency: .daily, forAlertType: .option), // a.b.C.d
    revisionUpdateRules: Rules(promptFrequency: .weekly, forAlertType: .skip) // a.b.c.D
)
siren.wail()

これで終わりなんですけどね。
上記は、「AppDelegate」に記載します。

まずは、下記１行で、日本語化しています。

siren.presentationManager = PresentationManager(forceLanguageLocalization: .japanese)

次にRulesManagerを使って、複数パターンのルールを設定しています。
これで、バージョンアップの内容によって、アップデートの促し方を変えることが可能です。

コメントの「A.b.c.d」は、バージョン表示を示していて、大文字の部分が、変更となる箇所を表しています。
以下で細かく説明していきます。

メジャーアップデート（A.b.c.d）の時

例えば、現在使っているアプリのバージョンが「1.0.1.1」で、
App Storeにあるアプリのバージョンが「2.0.0.0」になっている場合です。

majorUpdateRules: Rules(promptFrequency: .immediately, forAlertType: .force), // A.b.c.d

この場合は、すぐにでもアップデートさせたいので、
promptFrequency: .immediately
で、アプリ起動時にすぐさまチェックし、
forAlertType: .force
で、アップデートを強制させています。
この時のダイアログ表示は、下記となります。

マイナーアップデート（a.B.c.d）の時

例えば、現在使っているアプリのバージョンが「1.1.0.0」で、
App Storeにあるアプリのバージョンが「1.2.0.0」になっている場合です。

minorUpdateRules: Rules(promptFrequency: .immediately, forAlertType: .option), // a.B.c.d

この場合も、出来ればすぐにアップデートして欲しいので、
promptFrequency: .immediately
で、アプリ起動時にすぐさまチェックしますが、
forAlertType: .option
で、アップデートはあくまで任意としています。
（まあ、毎回ダイアログが出るので、大抵の人はアップデートしてくれますけどね）
この時のダイアログ表示は、下記となります。

パッチアップデート（a.b.C.d）の時

例えば、現在使っているアプリのバージョンが「1.1.0.0」で、
App Storeにあるアプリのバージョンが「1.1.1.0」になっている場合です。

patchUpdateRules: Rules(promptFrequency: .daily, forAlertType: .option), // a.b.C.d

この場合も、出来ればすぐにアップデートして欲しいものの、
promptFrequency: .daily
で、チェック自体を１日に１回のみ行なって、
forAlertType: .option
で、アップデートもあくまで任意としています。
（この場合でも、大抵の人は2回目か３回目のダイアログ（つまり２日、３日目）ぐらいには、アップデートしてくれます）
この時のダイアログ表示は、下記となります。（マイナーアップデートと同じです。）

リビジョンアップデート（a.b.c.D）の時

例えば、現在使っているアプリのバージョンが「1.1.0.0」で、
App Storeにあるアプリのバージョンが「1.1.0.1」になっている場合です。

revisionUpdateRules: Rules(promptFrequency: .weekly, forAlertType: .skip) // a.b.c.D

この場合は、重要なアップデートではない事（少しの機能改善など）が多いので、
promptFrequency: .weekly
で、チェック自体を１週間に１回のみ行なって、
forAlertType: .skip
で、アップデート自体をスキップする事を可能としています。
（スキップの選択肢を出してしまうと、大抵の人はスキップして、アップデートしてくれません（泣））
この時のダイアログ表示は、下記となります。


以上となります。今回は、あくまで例として挙げましたが、
プロジェクトによって、色々な設定で組み合わせを試してみてはいかがでしょうか。

オフィス狛 技術部のHammarです。

AWSのCloudWatchはいろいろな統計やデータ解析にも非常に役立つので、AWS環境で開発されている方は頻繁に見る機会があると思いますが、基本的にはグラフを見ながら、この時間にCPU使用率が～とか、ネットワーク数が～と見たりすると思います。

ただ、グラフではなく、この期間のこのCPU使用率の「平均値」とか、ネットワーク入力数の「合計」とか見たい場合があり、それらの情報もCloudWatchで確認することができたので、備忘録として記載したいと思います。

ある期間のEC2のCPU使用率の平均値を知りたい場合

①CloudWatchメニューの「メトリクス」を選択

②「すべてのメトリクス」タブで対象のEC2インスタンスの「CPUUtilization」（CPU使用率）にチェックをいれる

③「グラフ化したメトリクス」タブの統計欄で「平均」を選択する

④「グラフのオプション」タブのウィジェットタイプで「数値」を選択し、値に「時間範囲の値」を選択する

⑤画面右上の表示範囲を設定する
　「カスタム」を選択して細かな期間で表示可能です。
例えば直近1ヶ月等の平均値を表示したい場合は「絶対値」タブで開始日時、終了日時を設定し、「適用」ボタンをクリックします。

以上の設定でEC2のCPU使用率の平均値が数値で表示されます。


同じような設定方法で、その他のメトリクスの期間内の合計や平均値の数値情報のみを取得することが可能ですので、グラフ以外の使い方として利用してみてはいかがでしょうか。

こんにちは、オフィス狛 モバイル開発担当 Aika-yuy です。
今回の投稿は、iOSアプリから AmazonConnectとLambdaで任意の番号に電話をかける方法をご紹介します。


前回までのLambdaからAmazon Connectで電話をかける方法です

①Amazon Connectで電話番号、お問い合わせフローの作成
②IAMでロールを作成
③Lambda関数の作成
④実行！！

今回の手順

①Amazon CognitoでiOSアプリからアクセス権限を作成
②CognitoのロールにLambdaのアクセス権限を追加
③iOSアプリにCognitoとLambda呼び出しの設定

①Amazon CognitoでiOSアプリからアクセス権限を作成

・TOP画面からCognitoを検索して選択

・Identity Poolを作成します

・新しいIDプールの作成

・任意の名前をつける
・認証なしのユーザーを許可にチェックして作成

・許可を押すと自動でロールが作成されます

・サンプルコードをコピーします(後ほどAppDelegateに貼り付け)

②CognitoのロールにLambdaのアクセス権限を追加

・IAMに移動します
・サイドメニューのロールを選択
・先ほど自動作成されたロールが一覧に表示されています
・Unauthの方をクリックして下さい

・インラインポリシーの追加を押して下さい

・サービスはLambdaを選択
・アクションはInvokeFunctionにチェックを入れて下さい
・ポリシーの確認ボタンを押します

・ARNの追加で以前に作った、LambdaFunctionのARNをペーストして下さい

・任意の名前をつけ、ポリシーの作成ボタンを押して下さい

・ポリシーが追加されていれば、完了です
・次はiOSアプリを作成していきます

③iOSアプリにCognitoとLambda呼び出しの設定

・今回は以下をpod installしました

pod 'AWSMobileClient', '~> 2.6.13'  # For AWSMobileClient
pod 'AWSCognito'
pod 'AWSLambda'

AppDelegateに先ほどのサンプルコードをそのまま貼り付けます

import AWSCognito//インポートを忘れずに

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
    var window: UIWindow?
    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        let credentialsProvider = AWSCognitoCredentialsProvider(regionType:.APNortheast1,identityPoolId:"identityPoolId")
        let configuration = AWSServiceConfiguration(region:.APNortheast1, credentialsProvider:credentialsProvider)
        AWSServiceManager.default().defaultServiceConfiguration = configuration
        return true
    }

viewControllerにボタンを押したらLambdaFunctionを叩くようにします

import AWSLambda//インポートを忘れずに

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    }
    @IBAction func callButtanTapped(_ sender: Any) {
        let lambdaInvoker = AWSLambdaInvoker.default()
        
        lambdaInvoker.invokeFunction("testCall", jsonObject: nil).continueWith(block: {(task:AWSTask) -> Any? in
            if let error = task.error {
                print("Error: \(error)")
                return nil
            }
            return nil
        })
    }
}

ボタンを押すと電話がかけられるようになりました！！！

オフィス狛 技術部のJoeです。

前回、moment.jsを記事にしたのですが、一部機能しか紹介できなかったので、便利だなと思った機能を追加でご紹介します。

日付時刻の比較、差分、タイムゾーンの変換は、前回の記事を参照ください。
node.jsでの日付時刻処理（moment.jsを使ってみる）

※下記の例は、moment.jsのバージョン「2.22.2」で取得した結果になります。
バージョンにより、メソッド名やオブジェクト名などが異なる場合がありますので、ご注意ください。
公式ドキュメント

【フォーマット（format）】

// フォーマットを指定
console.log(moment('2019-08-28 01:05:07').format('YYYY年MM月DD日(ddd) HH時mm分ss秒'));  // 2019年08月28日(Wed) 01時05分07秒

// 曜日を日本語表示する場合、事前にロケールを設定します
moment.locale("ja");
console.log(moment('2019-08-28 01:05:07').format('YYYY年MM月DD日(ddd) HH時mm分ss秒'));  // 2019年08月28日(水) 01時05分07秒

// フォーマットを指定して、momentオブジェクトが作成可能です
const date1 = moment("2019年08月28日(水) 01時05分07秒", "YYYY年MM月DD日(ddd) HH時mm分ss秒");
console.log(moment(date1).format('YYYY/MM/DD(ddd) HH:mm:ss'));  // 2019/08/28(水) 01:05:07

// フォーマットが英語表記の場合は、事前にロケールを変更します
moment.locale("en");
const date2 = moment("Fri Aug 28 01:05:07 am 2019", "ddd MMM DD HH:mm:ss a YYYY");
console.log(moment(date2).format('YYYY/MM/DD(ddd) HH:mm:ss'));  // 2019/08/28(Wed) 01:05:07

【加減算（add、subtract）】

// 加算
console.log(moment('2019-08-30').add(2, 'days').format('YYYY年MM月DD日(ddd)'));  // 2019年09月01日(日)

// 減算
console.log(moment('2019-08-01').subtract(2, 'days').format('YYYY年MM月DD日(ddd)'));  // 2019年07月30日(火)

// 加減算する値は、オブジェクトで指定可能です（ｘ年ｘヶ月ｘ日後など）
console.log(moment('2019-08-30').add({year :2, month :3, day :5}}).format('YYYY年MM月DD日(ddd)'));  // 2021年12月05日(日)

【開始・終了（startOf、endOf）】

// 年の開始の日
console.log(moment('2019-09-04').startOf('year').format('YYYY/MM/DD(ddd) HH:mm:ss'));  // 2019/01/01(火) 00:00:00

// 週の最後の日
console.log(moment('2019-09-04').endOf('week').format('YYYY/MM/DD(ddd) HH:mm:ss'));  // 2019/09/07(土) 23:59:59

【月の日数（daysInMonth）】

// 月の日数
console.log(moment("2020-02", "YYYY-MM").daysInMonth()) // 29

// 月末の日を取得しても同じです
console.log(moment("2020-02", "YYYY-MM").endOf('month').get('date'));  // 29

【期間内判定（isBetween）】

// 期間内の場合、trueを返します（デフォルトでは、指定した開始、終了と一致する場合、falseを返します）
console.log(moment('2019-10-19').isBetween('2019-10-19', '2019-10-25'));  // false
console.log(moment('2019-10-20').isBetween('2019-10-19', '2019-10-25'));  // true
console.log(moment('2019-10-25').isBetween('2019-10-19', '2019-10-25'));  // false

// 第３パラメータで判定基準（年、月など）を指定できます
console.log(moment('2019-10-20').isBetween('2019-09-19', '2020-11-25', 'month'));  // true
console.log(moment('2019-10-20').isBetween('2019-09-19', '2020-11-25', 'year'));  // false

// 第４パラメータで、指定した開始、終了を含む「[]」、含まない「()」を指定できます
console.log(moment('2019-10-19').isBetween('2019-10-19', '2019-11-25', null, '[]'));  // true
console.log(moment('2019-10-19').isBetween('2019-10-19', '2019-11-25', null, '(]'));  // false

【うるう年判定（isLeapYear）】

// うるう年の場合、trueを返します
console.log(moment("2020", "YYYY").isLeapYear());  // true
console.log(moment("2019", "YYYY").isLeapYear());  // false

【オブジェクトのコピー（clone）】

// 値渡しでコピーされます（参照渡しではないです）
const date1 = moment('2019-08-28 01:05:07');
const date2 = date1.clone();
// コピー元を更新
console.log(date1.year(2020).format('YYYY/MM/DD(ddd) HH:mm:ss'));  // 2020/08/28(Fri) 01:05:07
// コピー先は変更されない
console.log(date2.format('YYYY/MM/DD(ddd) HH:mm:ss'));  // 2019/08/28(Wed) 01:05:07

【ロケールをカスタマイズする】

ロケールを新たに定義して、カスタマイズすることが可能です。

// ロケール「ja」を継承して新規ロケール「my_ja」を定義
moment.defineLocale('my_ja', {
  parentLocale: 'ja',
});

// 定義を更新
moment.updateLocale('my_ja', {
  // 月（MMMM：1月、2月・・・）の定義を旧暦の月で更新
  months : ["睦月", "如月", "弥生", "卯月", "皐月", "水無月", "文月", "葉月", "長月", "神無月", "霜月", "師走"],
  // 週の最初を月曜日に更新
  week : { dow: 1 }
});

// 「my_ja」にロケールを変更
moment.locale("my_ja");

// ９月を旧暦で、周の最初を表示
console.log(moment('2019-09-04').startOf('week').format('YYYY年 MMMM DD日(ddd)'));  // 2019年 長月 02日(月)

// 2番目の引数としてnullを渡すと、定義したロケールを削除します
moment.updateLocale('my_ja', null);

日付時刻処理のライブラリは他に「dayjs」、「date-fns」、「luxon」などありますが、
「moment」は一番人気のライブラリなので、ぜひ使ってみてください。

こんにちは、オフィス狛 デザイン部のSatoです。

「複数ある画像ファイルをエクセルに貼り付けたものが素材画像として送られてきて困った！」
「このパワーポイントに貼り付けられたロゴを保存できたらいいんだけどなあ……」
こんな風にエクセルやワードやパワーポイントに貼り付けられた画像を書き出したい、しかし方法がわからないという風に悩んだことありませんか？
今回はエクセル、ワード、パワーポイントに貼り付けられた画像の保存方法を解説します。

保存したい画像が少ない場合は「図として保存」という機能を使うと簡単です
保存したい貼り付けられてる画像の上で右クリックします。 出てきたメニューから「図として保存」を選択しましょう！
保存名、フォルダ、形式を選択し、保存ボタンを押せば保存完了です。


また、保存したい画像が数枚ある場合は以下の方法が便利です。
(なお、下記の手順はMacOSでの手順です)
まず、保存したい画像のあるファイルを別名コピーします。ファイルの名はどのようなものでも大丈夫です。
コピーしたファイルの名前を変更して拡張子をzipにします。(警告メッセージが出ますが「".zip"を使用」を押してください)
こうして出来上がったzipを解凍し、
解凍したファイル内に、元のファイルごとに作成されるディレクトリがあり（*1）、その中の『media』というディレクトリに画像ファイルがまとめられています。

＊１）
「元ファイルがエクセルの場合は『xl』」、
「元ファイルがワードの場合は『word』」、
「元ファイルがパワーポイントの場合『ppt』」

しかし、稀にアーカイブユーティリティ（Macの場合ダブルクリックでzip解凍するとこのソフトで解凍してくれます）で解凍すると「.cpgz」という拡張子の謎のファイルが出来てしまいます。
cpgz形式のファイルをダブルクリックで解凍すると、zip形式のファイルが出来、それを解凍するとcpgz形式のファイルが……といった具合に無限ループを繰り返し、正しく解凍されません。

 調べたところ、cpgz形式のファイルが出来てしまうzipファイルはターミナルで「unzip」というコマンドを使って解凍するときちんと解凍できる、とのことだったので試してみました。
（UNIXコマンドと普段戯れていない私のような非エンジニアの方々は、デスクトップに解凍できないファイルを置いておくことを推奨します。【】の中のコマンドをC⌘でコピーして⌘Vでペーストすればなんとかなりますので……！）

デスクトップに解凍したいzipファイルを置いたので【cd Desktop/】とターミナルに入力し、エンターキーを押してデスクトップに遷移します。
（きちんと遷移したか不安な時は【ls】とターミナルに入力してみてください。 デスクトップに保存してあるファイル名がずらずらとターミナルに表示されるはずです！）
遷移後、【unzip （解凍できないファイル名）.zip】（unzipとファイル名の間の半角スペースは消さないでください！）とターミナルに入力し、エンターキーを押すと処理が走るので少し待ちます。
少し待つと解凍されたファイルがデスクトップにできています！ 手間はかかりましたが、どうにか保存できました！やったー！

zip解凍がうまくいかない場合にはターミナルでUNIXコマンドをぽちぽち打たなくてはいけないので、きちんとできてるのかが分かりにくいかったりと少しデザイナーにはハードルが高いですが、これら二つの方法でどうにか保存できます！
困った際は試してみてください！

オフィス狛 技術部のHammarです。

最近ASP.Netを主に触れているのですが、いつもテストサーバー（実際のWindowsServerのIIS上）で動作確認をしていました。が、いまさらながらローカル環境を作ってみようと思い、Dockerとwindows IISを利用して作ってみました。
基本的なプロジェクトの構成としてはローカルIISのwebサーバーとDockerの仮想DBとのデータのやり取りを実現するという内容になります。
ちなみに開発はweb画面からのアクセスではなくAPI開発で、下記のようにJSONでHTTPリクエストを行うという流れで今回やりました。

■環境

webサーバー：windows 10 IIS
DB：SqlServer（Docker）

■ローカル（winsows10）のIISを有効化する

まずはローカルのIISを有効化されているか確認する必要があります。
有効化されていない場合は下記手順で有効化します。

1. ①コントロールパネルを開く
2. ②プログラムを選択する
3. ③「プログラムと機能」のWindowsの機能の有効化または無効化を選択
4. ④「Windowsの機能」の一覧のインターネットインフォメーションサービスにチェックを入れてOKを選択
5. ⑤デスクトップ左下のWindowsボタンを右クリック⇒コンピュータの管理を選択選択
6. ⑥サービスとアプリケーションに「IISマネージャー」があることを確認する
7. ⑦ブラウザにhttp://localhost/ とURLを入力し、Enterを押すと以下画面が見れる

■DockerでローカルDB環境を作る

※Dockerが既にインストールされていることが前提となります
まずはdockerを起動しておきます。

次にdocker-compose.ymlファイルを作成し、使うDBの内容を記載します。
今回はSqlServerを使って開発したいので、下記のような記載になります。

・docker-compose.yml

version: '3'
services:
  db:
    environment:
      - MSSQL_SA_PASSWORD=password
      - ACCEPT_EULA=Y
      - MSSQL_PID=Developer
    image: microsoft/mssql-server-linux:2017-latest
    ports:
      - "1433:1433"
    volumes:
      - ./mssql/:/c/var/opt/mssql/

あとは、このdocker-compose.ymlファイルがあるディレクトリで
で仮想ローカルDBを作成します。
あとはSSMS等のツールを利用し、テーブル作成等細かな設定を行います。

■IISのルートディレクトリにビルドしたファイルを設置する

visual studioでビルドしたファイルを下記IISのルートディレクトリに設置します。
C:\inetpub\wwwroot

■IISのサイトを作成する

デスクトップ左下のWindowsボタンを右クリック⇒コンピュータの管理を選択し
サービスとアプリケーションの「IISマネージャー」を選択します。

※サイトの作成方法についてはいろいろなサイトで説明があるのでここでは割愛します。

■IISサイトのサービスを開始する

サイトの「Default Web Site」で右クリック→「Webサイトの管理」→「開始」をクリックしてサイトを起動します。

あとは、作成したサイトにPOSTMAN等のツールを利用して、HTTPリクエストを投げて、正常にHTTPレスポンスが返ってくればローカル環境完成となります。

細かな部分は省いたのでかなりざっくりとした記載になってしまいましたが、ローカルIISのwebサーバーとDockerの仮想DBでローカル環境作る場合に参考になればと思います。