OKAMOTO Wataru

WP Multibyte Patch を有効にしていれば、日本語ファイル名のメディアファイルはよしなに名前を変えてくれます。ですが、有効にしていなかった場合 <img src="https://example.com/wp-content/uploads/スクリーンショット.png" > みたいなタグを書き出してくれることがあって、ちょっと哀しいことになることがあったんです。スクリーンショット.png だけを%エンコードして出力したいなーってときにサクッと書いたプラグインがこちらになります。image-url-encode.php<?php/*Plugin Name: Image URL EncoderPlugin URI: http://digitalcube.jpDescription: 本文中の日本語画像URLを%エンコードするAuthor: DigitalcubeVersion: 1.0Author URI: http://digitalcube.jpCopyright 2021 Digitalcube (email : info@digitalcube.jp)This program is free software; you can redistribute it and/or modifyit under the terms of the GNU General Public License as published bythe Free Software Foundation; either version 2 of the License, or(at your option) any later version.This program is distributed in the hope that it will be useful,but WITHOUT ANY WARRANTY; without even the implied warranty ofMERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See theGNU General Public License for more details.You should have received a copy of the GNU General Public Licensealong with this program; if not, write to the Free SoftwareFoundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA*/$image_url_encode = New imageUrlEncode();add_filter( 'wp_get_attachment_url', [ $image_url_encode, 'image_url_encode' ] );add_filter( 'the_content', [ $image_url_encode, 'the_content' ] );add_filter( 'the_content_feed', [ $image_url_encode, 'the_content' ] );class imageUrlEncode{    public function __construct()    {    }    public function image_url_encode( $image_url )    {        return preg_replace_callback(            '#[^/]+$#',            function ( $matches ) { return urlencode( $matches[0] ); },            $image_url        );    }    public function the_content( $content )    {        $image_urls = [];        // <img src>        if ( preg_match_all( '#<img [^>]*src=[\'"]([^\'"]*)[\'"][^>]*>#', $content, $image_srcs, PREG_SET_ORDER ) )        {            foreach ( $image_srcs as $image_src )            {                $image_url = trim( $image_src[1] );                $image_url_encode = $this->image_url_encode( $image_url );                if ( $image_url !== $image_url_encode )                {                    $image_urls[$image_url] = $image_url_encode;                }            }        }        // <img srcset>        if ( preg_match_all( '#<img [^>]*srcset=[\'"]([^\'"]*)[\'"][^>]*>#', $content, $image_srcsets, PREG_SET_ORDER ) )        {            foreach ( $image_srcsets as $image_srcset )            {                $image_srcs = explode( ',', $image_srcset[1] );                foreach ( $image_srcs as $image_src )                {                    $image_url = trim( preg_replace( '# [^ ]+$#', '', $image_src ) );                    $image_url_encode = $this->image_url_encode( $image_url );                    if ( $image_url !== $image_url_encode )                    {                        $image_urls[$image_url] = $image_url_encode;                    }                }            }        }        // replace        if ( count( $image_urls ) > 0 )        {            $content = str_replace( array_keys( $image_urls ), $image_urls, $content );        }        return $content;    }}

[WordPress] 日本語ファイル名でアップロードした画像を%エンコーディングしたい

Bot とかで大量に問い合わせフォームにリクエストしてくる人がいて困りますよね。POSTリクエストにリファラとして自ドメインが設定されていない場合は、ブラウザ経由ではなく、直接叩いてるんだろうと仮定してブロックしちゃうのも良いかもしれません。Nginx で設定するなら、こんな感じ    location ~* ^/contact {        valid_referers server_names;        set $allowed 1;        if ( $invalid_referer ) {            set $allowed 0;        }        if ( $request_method != 'POST' ) {            set $allowed 1;        }        if ( $allowed = 0 ) {            return 404;        }Nginx の if 文では複数の条件を書くことができない、else を使用することができないという縛りがあるので、上記のような記述方法になります。valid_referers server_names; は、リファラチェックして自ドメインからのリクエストじゃない場合は $invalid_referer に 0 をセットします。$allowed という変数を 1 で初期化しておいて。$invalid_referer だったら 0 をセットする。$request_method が POST 以外だったら 1 をセットする。これで $allowed が 0 なら、「許可されていないリファラがセットされている、かつ、POSTメソッドでのリクエスト」ということになるので、404 を返します。

[nginx] 問い合わせフォームへのPOSTリクエストにリファラが設定されていない場合ブロックする設定

auth_key と text, source_lang, target_lang を指定して GET or POST するだけ参考: https://www.deepl.com/docs-api/introduction/シェルスクリプトdeepl.sh#!/bin/shDEEPL_API_URL="https://api-free.deepl.com/v2/translate"YOUR_API_KEY="__DEEPL_API_KEY_HERE__"SOURCE_TEXT="I'm a lumberjack and I'm OK.I sleep at night, I work during the day.He's a lumberjack and he's OK.He sleeps all night and he works all day.I cut down trees, I eat my lunch.I go to the lavatory.On Wednesdays I go shopping and have buttered scones for tea."curl -s ${DEEPL_API_URL} \  -X POST \  -H "Content-Type: application/x-www-form-urlencoded" \  -d "auth_key=${YOUR_API_KEY}" \  -d "text=${SOURCE_TEXT}" \  -d "source_lang=EN" \  -d "target_lang=JA" \| jq .translations[].textPythondeepl.pyimport requestsDEEPL_API_URL = 'https://api-free.deepl.com/v2/translate'YOUR_API_KEY = '__DEEPL_API_KEY_HERE__'SOURCE_TEXT = """I'm a lumberjack and I'm OK.I sleep at night, I work during the day.He's a lumberjack and he's OK.He sleeps all night and he works all day.I cut down trees, I eat my lunch.I go to the lavatory.On Wednesdays I go shopping and have buttered scones for tea."""params = {    "auth_key": YOUR_API_KEY,    "text": SOURCE_TEXT,    "source_lang": 'EN',    "target_lang": 'JA'}request = requests.post(DEEPL_API_URL, data=params)result = request.json()print(result["translations"][0]["text"])Node.jsdeepl.jsconst request = require('request');const deepl_api_url = 'https://api-free.deepl.com/v2/translate'const your_api_key = '__DEEPL_API_KEY_HERE__';const source_text = `I'm a lumberjack and I'm OK.I sleep at night, I work during the day.He's a lumberjack and he's OK.He sleeps all night and he works all day.I cut down trees, I eat my lunch.I go to the lavatory.On Wednesdays I go shopping and have buttered scones for tea.`;const params = {    url: deepl_api_url,    method: 'POST',    headers: {        'content-type': 'application/x-www-form-urlencoded'    },    form: {        auth_key: your_api_key,        text: source_text,        source_lang: 'EN',        target_lang: 'JA'    },    json: true}request.post(params, function(error, response, result){    console.log(result.translations[0].text);});PHPdeepl.php<?php$deepl_api_url = 'https://api-free.deepl.com/v2/translate';$your_api_key = '__DEEPL_API_KEY_HERE__';$source_text = "I'm a lumberjack and I'm OK.I sleep at night, I work during the day.He's a lumberjack and he's OK.He sleeps all night and he works all day.I cut down trees, I eat my lunch.I go to the lavatory.On Wednesdays I go shopping and have buttered scones for tea.";$header = [    'Content-Type: application/x-www-form-urlencoded',];$content = [    'auth_key'    => $your_api_key,    'text'        => $source_text,    'source_lang' => 'EN',    'target_lang' => 'JA',];$params = [    'http' => [        'method'  => 'POST',        'header'  => implode("\r\n", $header),        'content' => http_build_query($content, '', '&'),    ]];$request = file_get_contents(    $deepl_api_url,    false,    stream_context_create($params));$result = json_decode($request);echo $result->translations[0]->text;実行結果私は木こりですが、大丈夫ですよ。夜は寝て、昼は働く。彼は木こりであり、彼はOKだ。彼は夜も寝るし、昼も働く。木を切って、お昼を食べて。お手洗いにも行く。水曜日には買い物に行き、紅茶にバター入りのスコーンを食べる。

DeepL API の使用方法

WordPress でサイト運営しているとデータが溜まってきて、SQLクエリのパフォーマンスが落ちることがありますよね。そういう時は、RDS の Performance Insights や、MySQL の スロークエリログ を駆使して、ボトルネックになっているクエリを特定する必要があります。wp_postmeta.meta_value が検索条件に含まれる場合例えば以下のようなクエリがボトルネックになっていると判明した場合SELECT post_id, meta_value FROM wp_postmeta WHERE meta_key = '_wp_attached_file' AND meta_value = ?これは attachment_url_to_postid() が発行しているクエリーです。テーマやプラグインで、画像URLからポストIDを取得するために多発しているのかもしれません。例えば以下のようなクエリがボトルネックになっていると判明した場合SELECT wp_posts.ID FROM wp_posts INNER JOIN wp_postmeta ON ( wp_posts.ID = wp_postmeta.post_id ) WHERE 1=1 AND ( wp_postmeta.meta_key = ? AND wp_postmeta.meta_value = ? ) AND wp_posts.post_type = 'post' AND wp_posts.post_status = 'publish' GROUP BY wp_posts.ID ORDER BY wp_posts.post_date DESC LIMIT 0,10これは Advanced Custom Fields プラグインなどを導入すると、発行されがちなクエリです。これらのクエリは wp_postmeta テーブルにレコードが増えると実行に時間がかかるようになります。wp_postmeta テーブルの meta_value にはインデックスが貼られていないため WHERE の中に meta_value が存在するとクエリのパフォーマンスが落ちてしまいがちです。この場合は、思い切って meta_value にインデックスを貼ってしまうのも手です。CREATE INDEX key_value ON wp_postmeta(meta_key,meta_value(255));wp_posts.guid が検索条件に含まれる場合例えば、以下のようなクエリがボトルネックになっていると判明した場合SELECT ID FROM wp_posts WHERE post_type = ? AND guid = ?これは S3 Uploads というプラグインが多く発行しているクエリーです。attachment_url_to_postid() と同様にメディアファイルのURLからポストIDを取得するために使用されています。wp_posts テーブルの guid にインデックスが貼られていないために、パフォーマンス劣化の原因になることが多いです。この場合も、思い切って guid にインデックスを作成してしまいましょう。CREATE INDEX type_guid ON wp_posts(post_type,guid);このように、ボトルネックになっているクエリを特定して対処することで、あなたの WordPress の速度改善が簡単に行えます。また、RDSのインスタンスタイプを一つ落としてもちゃんと動くようになるかもしれません。

[WordPress][MySQL] クエリパフォーマンスが落ちてきたときに設定すると良いインデックス

WordPress 管理画面に対して IP 制限を行っている場合に、テーマエディターやプラグインエディターなどでファイルを編集しようとすると「致命的なエラーをチェックするためにサイトと通信できないため、PHP の変更は取り消されました。」と表示されて編集できないことがあります。このチェックをしてエラーメッセージを出しているのは wp-admin/includes/file.php のこの部分https://github.com/WordPress/WordPress/blob/master/wp-admin/includes/file.php#L550-L633WordPress は、まずループバックチェックをする対象のURLを決定します。ループバックチェック対象のURLは、プラグインかテーマの編集いずれかによって変わります。プラグイン編集中の場合は /wp-admin/plugin-editor.php?plugin=${plugin}&file=${file}テーマ編集中の場合は /wp-admin/theme-editor.php?theme=${stylesheet}&file=${file}それ以外の場合は /wp-admin/wp-admin/includes/file.php#L550-L563        // Attempt loopback request to editor to see if user just whitescreened themselves.        if ( $plugin ) {            $url = add_query_arg( compact( 'plugin', 'file' ), admin_url( 'plugin-editor.php' ) );        } elseif ( isset( $stylesheet ) ) {            $url = add_query_arg(                array(                    'theme' => $stylesheet,                    'file'  => $file,                ),                admin_url( 'theme-editor.php' )            );        } else {            $url = admin_url();        }次に、その URL に対してサーバから wp_remote_get() で HTTP リクエストが行われます。wp-admin/includes/file.php#L571-L574        $url                    = add_query_arg( $scrape_params, $url );        $r                      = wp_remote_get( $url, compact( 'cookies', 'headers', 'timeout', 'sslverify' ) );        $body                   = wp_remote_retrieve_body( $r );        $scrape_result_position = strpos( $body, $needle_start );なお WordPress 管理画面に BASIC 認証が設定されている場合に関しての考慮は wp-admin/includes/file.php#L536-L539 で行われているので安心です。wp-admin/includes/file.php#L536-L539        // Include Basic auth in loopback requests.        if ( isset( $_SERVER['PHP_AUTH_USER'] ) && isset( $_SERVER['PHP_AUTH_PW'] ) ) {            $headers['Authorization'] = 'Basic ' . base64_encode( wp_unslash( $_SERVER['PHP_AUTH_USER'] ) . ':' . wp_unslash( $_SERVER['PHP_AUTH_PW'] ) );        }話がずれましたが wp_remote_get() の結果に $needle_start ("###### wp_scraping_result_start:$scrape_key ######") が含まれない場合は、管理画面へのループバックチェックが失敗したとみなされて、エラーとして処理されます。wp-admin/includes/file.php#L586-L595        if ( false === $scrape_result_position ) {            $result = $loopback_request_failure;        } else {            $error_output = substr( $body, $scrape_result_position + strlen( $needle_start ) );            $error_output = substr( $error_output, 0, strpos( $error_output, $needle_end ) );            $result       = json_decode( trim( $error_output ), true );            if ( empty( $result ) ) {                $result = $json_parse_failure;            }        }wp-admin/includes/file.php#L619-L632        if ( true !== $result ) {            // Roll-back file change.            file_put_contents( $real_file, $previous_content );            wp_opcache_invalidate( $real_file, true );            if ( ! isset( $result['message'] ) ) {                $message = __( 'Something went wrong.' );            } else {                $message = $result['message'];                unset( $result['message'] );            }            return new WP_Error( 'php_error', $message, $result );        }なので、WordPress 管理画面に IP制限を設定している場合は、自分のサーバのIPアドレスからのリクエストも許可するように設定しましょう。AutoScaling などで、サーバのIPが固定できない場合は wp-admin/plugin-editor.php , wp-admin/theme-editor.php へのリクエストのみ IP 制限をかけないようにするか、そもそも WordPress 管理画面からテーマやプラグインの編集をしないようにしてください。サーバ管理してる身としては「WordPress 管理画面からテーマやプラグインの編集をしないように」してもらった方がトラブルも少ないのでありがたいです。現場からは以上です。

[WordPress] 「致命的なエラーをチェックするためにサイトと通信できないため、PHP の変更は取り消されました。」

メモです。Fluentd の連携先としてメールしか選べないシステムだったので...Amazon Linux2 への fluentd のインストールcurl -L https://toolbelt.treasuredata.com/sh/install-amazon2-td-agent4.sh | shsudo td-agent-gem install fluent-plugin-mail/etc/td-agent/td-agent.conf<source>  type tail  path /var/log/php-fpm/error.log  tag php-fpm.error  pos_file /var/log/td-agent/php-fpm-error_log.pos  format none  read_from_head true</source><source>  type tail  path /var/log/php-fpm/www-error.log  tag php-fpm.www-error  pos_file /var/log/td-agent/php-fpm-www-error_log.pos  format none  read_from_head true</source><match **>  @type copy  <store>    @type stdout    @id @all.logging  </store>  <store>    @type relabel    @label @handle.error  </store></match><label @handle.error>  <filter **>    @type record_transformer    <record>      host ${hostname}    </record>  </filter>  <filter **>    @type grep    <regexp>      key message      pattern /Fatal error/i    </regexp>  </filter>  <match **>    @type mail    host localhost    port 25    from no-reply@example.com    to alert@example.com    subject "PHP Fatal Error"    out_keys host, message  </match></label>source は /var/log/php-fpm/error.log と /var/log/php-fpm/www-error.logstdout と @handle.error に copy@type record_transformer で host レコードを追加@type grep で Fatal error が含まれる行だけを抽出@type mail でメール送信

[fluentd][Amazon Linux2] php-fpm のエラーログに Fatal Error が出現したらメール送信する

弊社では以前から Backlog と Typetalk で社内業務を管理してます。参考: 創業時から15年間「徹底したリモートワーク」を追求する企業の取り組み、コミュニケーションの要は「Backlog」とても便利なのですがヌーラボアカウントの所属組織が違う Backlog と Typetalk を連携することができません(2021年4月現在)。昔は別組織の Backlog と Typetalk を連携できたのに、今は自組織の Backlog プロジェクトとしか連携できなくなってしまったんです。自組織の Backlog は大体ブラウザで開いてますが、他組織の Backlog は開いてないことが多いので、他組織の Backlog とこそ連携してほしい。（お客様の Backlog に入って進めているプロジェクトもあるので、結構他組織の Backlog プロジェクトも多いんです）なければ作ればいいということで Backlog の Webhook と Typetalk のボットを使って、Backlog に課題立てられたりしたら、Typetalk に通知する仕組みを Lambda + API Gateway で実装しました。Backlog の Webhook を受け取って Typetalk のボットに渡すこの部分は Lambda で実装しました。こんな感じです。特に追加の npm パッケージは使ってないので handler.js 一つでいいです。参考: Backlogから送信されるPOSTリクエストの内容〜Webhook〜handler.js'use strict';const https = require('https');function unescapeHTML(str) {    return '> ' + str.replace(/&lt;/g,'<')              .replace(/&gt;/g,'>')              .replace(/&amp;/g,'&')              .replace(/[\n\r]+/g, "\n> ");}function is_object(mixedVar) {    //  discuss at: https://locutus.io/php/is_object/    // original by: Kevin van Zonneveld (https://kvz.io)    // improved by: Legaev Andrey    // improved by: Michael White (https://getsprink.com)    if (Object.prototype.toString.call(mixedVar) === '[object Array]') {        return false    }    return mixedVar !== null && typeof mixedVar === 'object'}async function sendRequest(opts,replyData){    // https://ky-yk-d.hatenablog.com/entry/2018/07/16/011748    return new Promise(((resolve,reject)=>{        let req = https.request(opts, (response) => {            response.setEncoding('utf8');            let body = '';            response.on('data', (chunk)=>{                body += chunk;            });            response.on('end', ()=>{                resolve(body);            });        }).on('error', (err)=>{            reject(err);        });        req.write(replyData);        req.end();    }));};module.exports.helloTypetalk = async (event) => {    const { queryStringParameters, body } = event;    // event.body をパースする    return new Promise( (resolve, reject) => {        try {            resolve({                topicId: queryStringParameters.topicId,                typetalkToken: queryStringParameters.typetalkToken,                body: JSON.parse(body)            });        }        catch (err) {            reject(err);        }    })    // Backlog から受け取った情報をいい感じに編集する    // 参考: https://qiita.com/rekooom/items/455c1e8ec247e3cb8abb    .then(data => {        const { project, content, createdUser, notifications } = data.body;        // 課題キー        let keyId = content.key_id ? `${project.projectKey}-${content.key_id}` : project.projectKey;        if (is_object(content.comment) && content.comment.id) {            keyId += `#comment-${content.comment.id}`;        }        // 通知タイプ        let notificationType = '';        switch(data.body.type) {            case (1): notificationType = '課題を追加'; break;            case (2): notificationType = '課題を更新'; break;            case (3): notificationType = '課題にコメント'; break;            case (14): notificationType = '課題をまとめて更新'; break;            case (17): notificationType = 'お知らせを追加'; break;            case (5): notificationType = 'wiki を追加'; break;            case (6): notificationType = 'wiki を更新'; break;            case (7): notificationType = 'wiki を削除'; break;            case (8): notificationType = 'ファイルを追加'; break;            case (9): notificationType = 'ファイルを更新'; break;            case (10): notificationType = 'ファイルを削除'; break;            case (11): notificationType = 'Subversion にコミット'; break;            case (12): notificationType = 'Git にプッシュ'; break;            case (13): notificationType = 'Git リポジトリを作成'; break;            case (15): notificationType = 'プロジェクトに参加'; break;            case (16): notificationType = 'プロジェクトから脱退'; break;            case (18): notificationType = 'プルリクエストを追加'; break;            case (19): notificationType = 'プルリクエストを更新'; break;            case (20): notificationType = 'プルリクエストにコメント'; break;            case (22): notificationType = '発生バージョン/マイルストーンを追加'; break;            case (23): notificationType = '発生バージョン/マイルストーンを更新'; break;            case (24): notificationType = '発生バージョン/マイルストーンを削除'; break;            default: notificationType = '何をしたかわからないけど、なにかを実行';        }        notificationType = encodeURIComponent(`${createdUser.name} さんが ${notificationType}しました。`);        // タイトル        let summary = content.summary ? content.summary : (content.name ? content.name : (content.repository ? content.repository.name : ''));        let title = encodeURIComponent(`${keyId} ${summary}`);        // メッセージ内容        let message;        if (content.comment) {            message = is_object(content.comment) && content.comment.content ? content.comment.content : content.comment;        } else {            message = content.description ? content.description : (content.name ? content.name : '');        }        message = encodeURIComponent(unescapeHTML(message));        // お知らせした人        let notify = '';        notifications.forEach(notification => {            const { user } = notification;            if (notify) { notify += ', '; }            notify += user.name;            if (user.nulabAccount) { notify += ` (@${user.nulabAccount.uniqueId})`; }        });        if (notify) {            notify = `\n` + encodeURIComponent(`お知らせした人: ${notify}`);        }        data.postDataStr = `${notificationType}\n${title}\n\n${message}${notify}`;        return Promise.resolve(data);    })    // Typetalk ボットを叩く    .then(data => {        const contentBody = `message=${data.postDataStr}`;        const options = {            host:  'typetalk.com',            port:   443,            path:   `/api/v1/topics/${data.topicId}`,            method: 'POST',            headers: {                'Content-Type': 'application/x-www-form-urlencoded',                'Content-Length': Buffer.byteLength(contentBody),                'X-TYPETALK-TOKEN': data.typetalkToken            }        };        return sendRequest(options, contentBody);    })    .then(body => Promise.resolve({        'statusCode': 200,        'body': JSON.stringify(body)    }))    .catch(err => {        console.log(err);        return Promise.reject({            'statusCode': 500,            'body': JSON.stringify(err)        });    });};Serverless Framework で API Gateway を用意するserverless.yml は、こんな感じで大丈夫です。参考: Serverless FrameworkでAPIGateway・Lambda・DynamoDBを構築するserverless.ymlservice: backlog-gateway# You can pin your service to only deploy with a specific Serverless version# Check out our docs for more detailsframeworkVersion: '2'provider:  name: aws  runtime: nodejs14.x  lambdaHashingVersion: 20201221  timeout: 300  memorySize: 256# you can overwrite defaults here  stage: prd  region: us-west-2# you can add packaging information herepackage:  exclude:    - package.json    - package-lock.json    - event.jsonfunctions:  helloTypetalk:    handler: handler.helloTypetalk    timeout: 30    events:      - httpApi:          path: /typetalk/post          method: postこれで https://example.execute-api.us-west-2.amazonaws.com/typetalk/post みたいな感じの Webhook 用 URL ができます。やったね。あとは Typetalk のトピック設定でボットを追加してあげて、Backlog のプロジェクト設定の「インテグレーション」で Webhook を追加すれば良いです。Backlog に Webhook として登録するURLは https://{API Gateway のドメイン}/typetalk/post?topicid={トピックID}&typetalktoken={Typetalk Token} となります。クエリストリングは以下の通りです。{トピックID}: Typetalk ボットの「メッセージの取得と投稿の URL」の /topics/ 以降の数値{Typetalk Token}: Typetalk ボットの「Typetalk Token」良い Typetalk を！

[Backlog][Typetalk][Lambda] 所属組織が違う Backlog と Typetalk を連携する

必要な npm パッケージは aws-sdk, file-type, piexifS3.getObject でデータ取得して、file-type で JPEG 画像かチェックして、piexif で EXIF を削除して、S3.putObject で書き戻す感じです。const AWS = require('aws-sdk');const FyleType = require('file-type');const piexif = require('piexif');const removeExif = (region, bucket, key) => {    const S3 = new AWS.S3({region: region});    return Promise.resolve({Bucket: bucket, Key: key})    .then(params => S3.getObject(params).promise())    .then(data => new Promise(async (resolve, reject) => {        // mime type のチェック        const fileInfo = await FyleType.fromBuffer(data.Body);        if (fileInfo.mime === 'image/jpeg') {            data.ContentType = fileInfo.mime;            resolve(data);        } else {            reject(Error("It's not jpeg format."));        }    }))    .then(data => new Promise((resolve, reject) => {        // EXIF 情報の削除        try {            const newBody = piexif.remove(data.Body.toString('binary'));            resolve({                Bucket: bucket,                Key: key,                ContentType: data.ContentType,                Body: Buffer.from(newBody, 'binary')            });        }        catch (err) {            reject(err);        }    }))    .then(params => S3.putObject(params).promise())    .then(data => Promise.resolve(data))    .catch(err => Promise.reject(err));}Lambda ファンクションとして動くようにして、PUT のタイミングで EXIF 情報を削除するとか、Lambda@Edge で動くようにして EXIF 情報を秘匿するとかのサンプルにしてください。Lambda@Edge で画像ファイルに対するレスポンスを編集するためのサンプルとしては HM さんのも参考になるかもhttps://github.com/humanmade/tachyon

[AWS][nodejs] S3にある JPEG ファイルの EXIF 情報を削除して書き戻す

WordPress のメディアファイルは静的ファイルなので、WordPress のログイン・非ログインにより表示・非表示を制御するということができません。ただ会員制サイトとかだと、ログインしてない時に直接アクセスさせたくないとかって要望もあるので、対応できるようにしてみました。まず、WordPress がインストールされてるディレクトリに以下のファイルを作成します。uploads-files.php<?phprequire __DIR__.'/wp-load.php';if ( is_user_logged_in() ) {    $file = realpath( ABSPATH . sanitize_text_field($_GET['file']) );    // アップロードディレクトリ以下のファイルのみを対象にする    $upload_dir = wp_get_upload_dir();    if ( $file && strpos( $file, $upload_dir['basedir'] ) == 0 ) {        $mime_type = mime_content_type( $file );        // アップロードが許可されている mime type のファイルのみを対象にする        $allowed_mime_types = get_allowed_mime_types();        if ( in_array( $mime_type, $allowed_mime_types, true ) ) {            if ( $mime_type === 'image/svg' ) {                $mime_type = 'image/svg+xml';            }            header( 'Expires: 0' );            header( 'Cache-Control: must-revalidate' );            header( 'Pragma: public' );            header( 'Content-Length: ' . filesize( $file ) );            header( 'Content-Type: ' . $mime_type );            readfile( $file );            exit;        } else {            wp_die(                '403 Forbidden',                get_bloginfo('name').' - Forbidden',                ['response' => 403]            );        }    } else {        wp_die(            '404 Not Found',            get_bloginfo('name').' - Not Found',            ['response' => 404]        );    }} else {    wp_die(        '401 Unauthorized',        get_bloginfo('name').' - Unauthorized',        ['response' => 401]    );}そんで、Nginx の設定ファイルに以下の rewrite ルールを追加。合わせて /uploads-files.php に対して直接アクセスされないように internal に設定しておきましょうかね。nginx.confrewrite ^(/wp-content/uploads/.*)$ /uploads-files.php?file=$1 last;location = /uploads-files.php {    internal;    expires        off;    fastcgi_split_path_info ^(.+\.php)(/.+)$;    fastcgi_index index.php;    include       fastcgi_params;    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;    fastcgi_param PATH_INFO $fastcgi_path_info;    fastcgi_param PATH_TRANSLATED $document_root$fastcgi_path_info;}これで /wp-content/uploads/ 以下へのリクエストがくると /uploads-files.php で処理されるようになります。/uploads-files.php の中で WordPress にログインしているか( is_user_logged_in() )をチェックしているので安心ですね。

[WordPress] WordPress 非ログイン時に wp-content/uploads/ へのアクセスを拒否する

set $proxy_https '';if ($http_x_forwarded_proto = 'https') { set $proxy_https 'on'; }if ($http_cloudfront_forwarded_proto = 'https') { set $proxy_https 'on'; }if ($scheme = 'https') { set $proxy_https 'on'; }rewrite ^(/[^/]+)/files/$ $1/index.php last;rewrite ^(/[^/]+)/[_0-9a-zA-Z-]+/files/$ $1/index.php last;if (!-e $request_filename) {    rewrite ^(/[^/]+)/[_0-9a-zA-Z-]+/wp-json/.*$ $1/index.php$is_args$args last;    rewrite ^(/[^/]+)/[_0-9a-zA-Z-]+(/wp-.*)$ $1$2 last;    rewrite ^(/[^/]+)/[_0-9a-zA-Z-]+(/wp-admin/.*\.php)$ $1$2 last;    rewrite ^(/[^/]+)/[_0-9a-zA-Z-]+(/.*\.php)$ $1$2 last;    rewrite ^(/[^/]+)/[_0-9a-zA-Z-]+/?.*$ $1/index.php$is_args$args last;}location ~ ^(/[^/]+)/.*$ { try_files $uri $uri/ $1/index.php$is_args$args; }location / { try_files $uri $uri/ /index.php$is_args$args; }location ~ \.php$ {    expires        off;    fastcgi_split_path_info ^(.+\.php)(/.+)$;    fastcgi_pass   phpfpm;    fastcgi_index  index.php;    fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;    fastcgi_param  HTTPS            $proxy_https  if_not_empty;    fastcgi_param  HTTP_PROXY       "";    include        fastcgi_params;    fastcgi_intercept_errors on;    fastcgi_connect_timeout  60;    fastcgi_send_timeout     180;    fastcgi_read_timeout     180;    fastcgi_buffers          16 16k;    fastcgi_buffer_size      32k;    fastcgi_busy_buffers_size 32k;    fastcgi_temp_file_write_size 256k;}

[WordPress][Nginx] サブディレクトリにサブディレクトリ型のマルチサイトWordPressを設置する際の Nginx 設定

CloudFront のログから特定の日時のものだけコピーしようとしても aws s3 sync だとディレクトリ単位でしかコピーできない。そんな時は、以下の感じで#! /bin/bashS3_BUCKET_NAME='__S3_BUCKET_NAME__'CF_DIST_ID='__CLOUDFRONT_DISTRIBUTION_ID_HERE__'BASEURL="s3://${S3_BUCKET_NAME}/CloudFrontLogs/"FILTER="${CF_DIST_ID}.2021-01-01for F in $(aws s3 ls $BASEURL/$FILTER | awk '{print $4}'); do  echo $F  aws s3 cp $BASEURL/$F .done

[AWS][S3] S3 から pprefix 付きでファイルをコピーする

公開されている記事のリストを取り出したいだけなら、wp-cli で wp post list --post_status=publish --format=csv すればいいだけなんですが、permalink が取れないんですよね..wp post list | WP-CLI Command | WordPress Developer Resourcespermalink も取り出したい場合は、こんな感じで csv に書き出せます#!/bin/bashWP_PATH="${1:-./}"WP="wp --path=${WP_PATH} --skip-plugins --skip-themes"POSTS=$(${WP} post list --field=ID --post_status=publish)for POST in ${POSTS} ; do    ${WP} eval "\$post=get_post(${POST}); echo \$post->ID.',\"'.\$post->post_date.'\",\"'.\$post->post_title.'\",'.get_permalink(${POST}).','.\$post->post_type.','.\$post->post_status.\"\\n\";"done

[WordPress] wp-cli とシェルスクリプトで WordPress の記事リストを作成

WordPress で特定の文言が含まれる投稿のリストを作成したい時ってありますよね。wp-cli を使って、こんな感じのシェルスクリプトを作ってやれば、なんとなく CSV ができます。#!/bin/bashKEYWORD="${1:-ハナクソ}"TABLE=$(wp eval 'global $wpdb;echo $wpdb->posts;')POSTS=$(wp db search "${KEYWORD}" ${TABLE} --one_line --table_column_once | grep ${TABLE} | awk -F ':' '{print $3}' | sort | uniq)echo "ID,post_date,post_title,permalink,post_type,post_status"for POST in ${POSTS} ; do  wp eval "\$post=get_post(${POST}); if (\$post->post_status !== 'inherit') { echo \$post->ID.','.\$post->post_date.','.\$post->post_title.','.get_permalink(${POST}).','.\$post->post_type.','.\$post->post_status.\"\\n\"; }"done

[WordPress] 特定の文言が含まれる投稿のリストを作成したい

WordPress への Sentry の導入がすごく簡単でした。用意されてるプラグインをインストールして有効化するだけ。Sentryまずサインアップしましょう。GitHub アカウントや Google アカウントでのサインアップもできます。サインアップしたらプロジェクト作りましょう。プラットホームは PHP と JavaScipt でWordPress への導入プラグインの新規追加から「wp-sentry-integration」を検索してインストールし有効化プラグイン有効化したら wp-config.php に以下を追加します。define('WP_SENTRY_DSN', 'https://xxxx@o000000.ingest.sentry.io/0000000');define('WP_SENTRY_PUBLIC_DSN', 'https://xxxx@o000000.ingest.sentry.io/0000000');WP_SENTRY_DSN と WP_SENTRY_PUBLIC_DSN に設定すべき値は、Sentry のダッシュボードでプロジェクトの「Settings」 - 「Client Keys (DSN)」から取得できます。PHPプロジェクトのキーを WP_SENTRY_DSN に、JavaScriptプロジェクトのキーを WP_SENTRY_PUBLIC_DSN にセットします。設定終わったら WordPress 管理画面の「ツール」-「WP Sentry Test」からエラーメッセージの送信テストができます。Sentry のダッシュボード見るとエラー発生したことが記録されてるよ、やったーSentry のダッシュボードで、Slack連携とか設定できるので安心ですね。

[WordPress] Sentry で開始する WordPress エラー監視

PrivateTmp が有効になっていると NewRelic Agent が以下のエラーを吐いてしまいます。warning: daemon connect(fd=6 uds=/tmp/.newrelic.sock) returned -1 errno=ENOENT. Failed to connect to the newrelic-daemon. Please make sure that there is a properly configured newrelic-daemon running. For additional assistance, please see: https://newrelic.com/docs/php/newrelic-daemon-startup-modesPrivateTmp を無効にするしか対処方法が無いみたい...# /usr/bin/mkdir -p /etc/systemd/system/php-fpm.service.d/# echo "[Service]" > /etc/systemd/system/php-fpm.service.d/privatetmp.conf# echo "PrivateTmp=false" >> /etc/systemd/system/php-fpm.service.d/privatetmp.conf# /usr/bin/systemctl daemon-reload# /usr/bin/systemctl restart php-fpm.service# /usr/bin/systemctl status php-fpm.service参考: Rlicでサーバが表示されない

Amazon Linux2 で NewRelic Agent からデータが送信されない

WordPress 管理画面のURL ( /wp-admin/* ) に IP 制限をかけている場合に、サイトヘルス機能で「サイトでループバックリクエストが完了できませんでした」というエラーが発生します。wp-admin/site-health.php のみ IP 制限を解除するようにすれば解決します。SiteGuard WP Plugin を利用している場合は、「管理ページアクセス制限」の設定画面を開き、「除外パス」の欄に site-health.php を追加すればOK。参考: サイトヘルスでエラー | WordPress.org

[WordPress] サイトヘルスで「サイトでループバックリクエストが完了できませんでした」と表示される

Amazon Linux2 なら yum で入れられるんですが、Amazon Linux だと、ちと大変Amazon linux2 の場合$ sudo yum install certbotAmazon Linux の場合GitHub からソースを clone してきた後、依存パッケージをインストール$ sudo git clone https://github.com/certbot/certbot.git /opt/certbot$ sudo easy_install pip$ sudo easy_install --upgrade pip$ sudo pip install virtualenv==15.1.0$ sudo pip install -U cryptography$ pip -V$ virtualenv --versionACME v2 API の endpoint に書き換えるすでに ACME v1 で証明書取っている場合は、/etc/letsencrypt/renewal/*.conf を書き換える必要があります。$ sudo find /etc/letsencrypt/renewal/ -type f -name '*.conf' -exec sed -i -e 's/acme-v01/acme-v02/g' {} \;--debug オプションつけて certbot-auto を起動して依存パッケージをインストールさせる$ sudo /opt/certbot/certbot-auto renew --debug --force-renewalSSL証明書の発行SSL証明書を発行したい場合は、certbot-auto コマンドで$ certbot certonly -t -d example.com \ -a webroot --webroot-path=/var/www/html \ --rsa-key-size 2048こんな感じで

[letsencrypt] Amazon Linux に ACME v2 API に対応した certbot client をインストールする

GitHub API v4 を使って、WordPress で GitHub のデータを取得する方法です。参考: GitHub API v4をPHPから呼んでみるv4 では GraphQL のクエリを含んだ JSON を POST する形になります。https://developer.github.com/v4/GraphQL のクエリ取得したいデータに合わせて GraphQL のクエリを作成しましょう。GitHub GraphQL API で、実際にクエリ作って確認することができます。僕は、release データからパッケージのダウンロード URL を取得したかったので、こんな感じで作りました。{  repository(owner: "getshifter", name: "shifter-github-hosting-plugin-sample") {    releases(last: 1){      edges {        node {          releaseAssets(last: 1) {            nodes {              downloadUrl              url            }          }          url          tagName          isPrerelease          publishedAt          updatedAt        }      }    }  }}結果{  "data": {    "repository": {      "releases": {        "edges": [          {            "node": {              "releaseAssets": {                "nodes": [                  {                    "downloadUrl": "https://github.com/getshifter/shifter-github-hosting-plugin-sample/releases/download/1.0.1/shifter-github-hosting-plugin-sample.zip",                    "url": "https://github-production-release-asset-2e65be.s3.amazonaws.com/205090003/f64b1a80-cd47-11e9-81c2-8e04f2876f81?....."                  }                ]              },              "url": "https://github.com/getshifter/shifter-github-hosting-plugin-sample/releases/tag/1.0.1",              "tagName": "1.0.1",              "isPrerelease": false,              "publishedAt": "2019-09-02T06:07:38Z",              "updatedAt": "2019-09-02T06:07:38Z"            }          }        ]      }    }  }}最終リリースパッケージをダウンロードするための URL が取得できたよートークンを取得するAPI v4 を叩くには、個人アクセストークンを取得する必要があります。アクセストークンの取得方法は、公式ドキュメントを参考にコマンドライン用の個人アクセストークンを作成するPOST するWordPress には wp_remote_post() という関数があるので、それを使いましょう。$query = '__GRAPHQL_QUERY_HERE__';$token = '__GITHUB_ACCESS_TOKEN_HERE__';$options = [    'method'  => 'POST',    'headers' => [        'Authorization' => 'bearer ' . $token,        'Content-type'  => 'application/json; charset=UTF-8',    ],    'body'    => json_encode(['query' => $query]),];$res = wp_remote_post( 'https://api.github.com/graphql', $options);if (200 !== wp_remote_retrieve_response_code( $res )) {    return new \WP_Error(        wp_remote_retrieve_response_code( $res ),        wp_remote_retrieve_body( $res )    );}$body = json_decode( wp_remote_retrieve_body( $res ) );return $body;簡単ですね。実際にこのコードを使って作った WordPress プラグインが以下になります。shifter-github

[WordPress] GitHub API v4を WordPress から呼んでみる

サイレントインストール用スクリプト#!/bin/bash# install newrellic agentexport NR_INSTALL_SILENT='1'export NR_INSTALL_KEY='__NEWRELIC_LISENCE_KEY_HERE__'/bin/rpm --quiet -Uvh http://yum.newrelic.com/pub/newrelic/el5/x86_64/newrelic-repo-5-3.noarch.rpm/usr/bin/yum -y install newrelic-sysmond/usr/sbin/nrsysmond-config --set license_key=${NR_INSTALL_KEY}/etc/init.d/newrelic-sysmond start/sbin/chkconfig newrelic-sysmond on/usr/bin/yum -y install newrelic-php5/usr/bin/newrelic-install install/bin/sed -i -e 's/PHP Application/__APPLICATION_NAME_HERE__/g' /etc/php.d/newrelic.ini/sbin/service php-fpm restart

[NewRelic] NewRelic Agent のサイレントインストール

lftp -p ${PORT_NO} sftp://${SFTP_USER}:DUMMY@${SFTP_SERVER} \ -e 'set sftp:connect-program "ssh -a -x -i ${SSH_KEY}"'lftp の mirror コマンド便利よね