neputa note

本記事の概要

個人的な趣味でスマホアプリの開発をやっている。

開発人口の少ない「Xamarin Forms」による超貧弱弱小アプリではあるが、一丁前にGoogleの「Admob」を使用した広告表示もしている。

今年2021年の初めにアプリをリリースした時点では、「Google Mobile Ads SDK」のバージョンが19→20への過渡期だった。

この時点ではバージョン19を使用した情報が得られたので、こちらのブログを参考に実装した。

AdMob In Xamarin.Forms – Display Google Ads In Your Mobile App

そして現在、狭いXamarin Formsの界隈にもバージョン20に対応した情報が出始めたのをキッカケに対応することにした。

この19→20において何が問題かというと結構な箇所で互換性が無くなることだ。

私は「バナー広告」と「Interstitial広告」を使用しているが、後者の「Interstitial広告」において丸っとコードを書き換える必要が生じる。

そこであれこれ調べていたところ、Marco氏という方が作成した「MtAdmob plugin for Xamarin（以降、「MarcTron.Admob」と表記）」なるものを見つけた。

marcojak/MTAdmob - github.com

ソースを見てみると実態としては「Xamarin.GooglePlayServices.Ads.Lite」と「Xamarin.Google.iOS.MobileAds」のラッパーであり、もちろん、それぞれ最新のバージョン（120.3.0.1 と 7.66.0）に対応している。

nugetパッケージで配布されており、導入および実装が非常に簡単なのが特徴。

以前に実装した方法ではカスタムレンダラーを作成したり実装に手間がかかったが、MarcTron.Admobでは各Platformに最低限の設定は必要なものの、ViewやViewModelにコードを書くだけでよい。

日本語の情報が見当たらなかったのでテスト広告を表示するサンプルを公開してみたい、というのが本記事の主旨。

本記事ではバナー広告とInterstitial広告を対象にしているが、MarcTron.Admob はリワード広告にも対応している。

iOSの開発環境が無いためコードを掲載するがデバッグは行っていない点にご留意いただきたい。

開発環境

言語

• C#

フレームワーク

• Xamarin Forms 5.0

プラグイン

• Prism 8.1 （MVVM開発用）
• MarcTron.Admob 1.6.7 （MtAdmob plugin for Xamarin）

IDE

• Visual Studio 2019 Community

手順

新規プロジェクト（AdmobTestとした）を作成する。

ちなみにプロジェクト作成には Prism テンプレートを使用している。

Getting started with Prism for Xamarin.Forms

Nugetパッケージのインストール

PCLおよび各Platformプロジェクト（Android、iOS）にNugetパッケージ「MarcTron.Admob」をインストールする。

readme.txt が表示されるのでDeepL翻訳にでも放り込んで一読するとよいかも。

iOSプロジェクトに「Xamarin.Google.iOS.MobileAds」と「Xamarin.Google.iOS.SignIn」の２つのNugetパッケージをインストールする。

iOSの方は確認できていないが、Marc氏のブログにこれらを入れないとアプリがクラッシュすると記載があった。

Androidプロジェクトの設定作業

テスト広告に使用するユニットIDは、公式に公開されているものを使用する。

Google AdMob テスト広告（Android）

AndroidManifest.xml

Android プロジェクトの Properties にある AndroidManifest.xml に下記を追加する。

<meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="ca-app-pub-3940256099942544~3419835294" />
<meta-data android:name="com.google.android.gms.version" android:value="@integer/google_play_services_version"/>
<activity android:name="com.google.android.gms.ads.AdActivity" android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize" android:theme="@android:style/Theme.Translucent" />

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

完成したAndroidManifest.xmlはこんな感じ。

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:versionCode="1" android:versionName="1.0" package="com.companyname.appname">
  <uses-sdk android:minSdkVersion="21" android:targetSdkVersion="29" />
  <application android:label="@string/app_name" android:icon="@mipmap/icon">
    <meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="ca-app-pub-3940256099942544~3419835294" />
    <meta-data android:name="com.google.android.gms.version" android:value="@integer/google_play_services_version"/>
    <activity android:name="com.google.android.gms.ads.AdActivity" android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize" android:theme="@android:style/Theme.Translucent" />
  </application>
  <uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
</manifest>

MainActivity.cs

OnCreate メソッドに下記１行を追加する。

MobileAds.Initialize(ApplicationContext);

完成した MainActivity.cs はこんな感じ。

using Android.App;
using Android.Content.PM;
using Android.Gms.Ads;
using Android.OS;
using Prism;
using Prism.Ioc;

namespace AdmobTest.Droid
{
    [Activity(Theme = "@style/MainTheme",
              ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize)]
    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            TabLayoutResource = Resource.Layout.Tabbar;
            ToolbarResource = Resource.Layout.Toolbar;

            base.OnCreate(savedInstanceState);

            global::Xamarin.Forms.Forms.Init(this, savedInstanceState);

            MobileAds.Initialize(ApplicationContext);

            LoadApplication(new App(new AndroidInitializer()));
        }

        public override void OnRequestPermissionsResult(int requestCode, string[] permissions, Android.Content.PM.Permission[] grantResults)
        {
            Xamarin.Essentials.Platform.OnRequestPermissionsResult(requestCode, permissions, grantResults);

            base.OnRequestPermissionsResult(requestCode, permissions, grantResults);
        }
    }

    public class AndroidInitializer : IPlatformInitializer
    {
        public void RegisterTypes(IContainerRegistry containerRegistry)
        {
            // Register any platform specific implementations
        }
    }
}

Androidプロジェクトでの作業は以上。

iOSプロジェクトの設定作業

テスト広告に使用するユニットIDは、公式に公開されているものを使用する。

Google AdMob テスト広告（iOS）

info.plist

下記４行を追加する。

<key>GADApplicationIdentifier</key>
<string>ca-app-pub-3940256099942544~5662855259</string>
<key>GADIsAdManagerApp</key>
<true/>

完成した info.plist はこんな感じ。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
  <dict>
    <key>UIDeviceFamily</key>
    <array>
      <integer>1</integer>
      <integer>2</integer>
    </array>
    <key>UISupportedInterfaceOrientations</key>
    <array>
      <string>UIInterfaceOrientationPortrait</string>
      <string>UIInterfaceOrientationLandscapeLeft</string>
      <string>UIInterfaceOrientationLandscapeRight</string>
    </array>
    <key>UISupportedInterfaceOrientations~ipad</key>
    <array>
      <string>UIInterfaceOrientationPortrait</string>
      <string>UIInterfaceOrientationPortraitUpsideDown</string>
      <string>UIInterfaceOrientationLandscapeLeft</string>
      <string>UIInterfaceOrientationLandscapeRight</string>
    </array>
    <key>MinimumOSVersion</key>
    <string>10.0</string>
    <key>UILaunchStoryboardName</key>
    <string>LaunchScreen</string>
    <key>XSAppIconAssets</key>
    <string>Assets.xcassets/AppIcon.appiconset</string>
    <key>CFBundleDisplayName</key>
    <string>AdmobTest</string>
    <key>CFBundleName</key>
    <string>AdmobTest</string>
    <key>CFBundleIdentifier</key>
    <string>com.companyname.appname</string>
    <key>CFBundleVersion</key>
    <string>1.0</string>
    <key>CFBundleShortVersionString</key>
    <string>1</string>
    <key>GADApplicationIdentifier</key>
    <string>ca-app-pub-3940256099942544~5662855259</string>
    <key>GADIsAdManagerApp</key>
    <true/>
  </dict>
</plist>

AppDelegate.cs

FinishedLaunching メソッドに、以下１行を追加する。

MobileAds.SharedInstance.Start(CompletionHandler);

クラス内に以下メソッドを追加する。

private void CompletionHandler(InitializationStatus status){}

完成した AppDelegate.cs はこんな感じ。

using Foundation;
using Google.MobileAds;
using Prism;
using Prism.Ioc;
using UIKit;


namespace AdmobTest.iOS
{
    // The UIApplicationDelegate for the application. This class is responsible for launching the
    // User Interface of the application, as well as listening (and optionally responding) to
    // application events from iOS.
    [Register("AppDelegate")]
    public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
    {
        //
        // This method is invoked when the application has loaded and is ready to run. In this
        // method you should instantiate the window, load the UI into it and then make the window
        // visible.
        //
        // You have 17 seconds to return from this method, or iOS will terminate your application.
        //
        public override bool FinishedLaunching(UIApplication app, NSDictionary options)
        {
            global::Xamarin.Forms.Forms.Init();

            MobileAds.SharedInstance.Start(CompletionHandler);

            LoadApplication(new App(new iOSInitializer()));

            return base.FinishedLaunching(app, options);
        }

        private void CompletionHandler(InitializationStatus status) { }
    }

    public class iOSInitializer : IPlatformInitializer
    {
        public void RegisterTypes(IContainerRegistry containerRegistry)
        {
            // Register any platform specific implementations
        }
    }
}

iOSプロジェクトの作業は以上。

共通（PCL）プロジェクトの作業

共通プロジェクトでの作業は広告表示の実装となる。

MainPage.xaml

まずはViewから。

ヘッダに下記１行を追加する。

xmlns:controls="clr-namespace:MarcTron.Plugin.Controls;assembly=Plugin.MtAdmob"

レイアウトとしては、まずInterstitial広告のロード状況を示すラベル、画面中央に Interstitial広告のロードボタン・ロードチェックボタン・表示ボタン、画面下部にバナーを設置する。

完成した MainPage.xaml はこんな感じ。

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:controls="clr-namespace:MarcTron.Plugin.Controls;assembly=Plugin.MtAdmob"
             x:Class="AdmobTest.Views.MainPage"
             Title="{Binding Title}">

    <StackLayout Orientation="Vertical" Spacing="0">

        <StackLayout.Margin>
            <OnPlatform x:TypeArguments="Thickness">
              <On Platform="iOS" Value="0,20,0,0" />
              <On Platform="Android" Value="0,0,0,0" />
            </OnPlatform>
        </StackLayout.Margin>

        <Label
            Text="{Binding IsLoaded, StringFormat=ロード状況：{0}}"
            FontSize="Large"
            HorizontalTextAlignment="Center"
            VerticalTextAlignment="Center"
            HeightRequest="200" />

        <Button
            Text="Interstitial広告をロード"
            Command="{Binding LoadCommand}"
            HeightRequest="50" />

        <Button
            Text="Interstitial広告のロード状況を確認"
            Command="{Binding IsLoadedCheckCommand}"
            HeightRequest="50" />

        <Button
            Text="Interstitial広告を表示"
            Command="{Binding ShowCommand}"
            HeightRequest="50"/>

        <!-- Place the Admob controls here -->
        <controls:MTAdView
            IsVisible="true"
            AdsId="{OnPlatform Android='ca-app-pub-3940256099942544/6300978111', iOS='ca-app-pub-3940256099942544/2934735716'}"
            VerticalOptions="EndAndExpand"
            HorizontalOptions="FillAndExpand">
            <controls:MTAdView.HeightRequest>
                <x:OnIdiom>
                    <x:OnIdiom.Phone>60</x:OnIdiom.Phone>
                    <x:OnIdiom.Tablet>90</x:OnIdiom.Tablet>
                    <x:OnIdiom.Desktop>90</x:OnIdiom.Desktop>
                </x:OnIdiom>
            </controls:MTAdView.HeightRequest>
        </controls:MTAdView>

    </StackLayout>

</ContentPage>

MainPageViewModel.cs

続いて ViewModel。

各処理についてはコメントを付けているのでコード内を参照されたし。

完成した MainPageViewModel.cs はこんな感じ。

using MarcTron.Plugin;
using Prism.Commands;
using Prism.Navigation;
using Xamarin.Forms;

namespace AdmobTest.ViewModels
{
    public class MainPageViewModel : ViewModelBase
    {
        private string _isLoaded;
        private readonly string interstitialUnitId;

        public MainPageViewModel(INavigationService navigationService)
            : base(navigationService)
        {
            Title = "Main Page";

            // 各ボタンのDelegateCommandにメソッドを割り当て

            ShowCommand = new DelegateCommand(Show);

            LoadCommand = new DelegateCommand(Load);

            IsLoadedCheckCommand = new DelegateCommand(IsLoadedCheck);

            // Interstitial広告のロード状況を示すラベル用プロパティを初期化
            _isLoaded = CrossMTAdmob.Current.IsInterstitialLoaded().ToString();

            // Interstitial広告用 対象プラットフォームのUnitIDを設定
            switch (Device.RuntimePlatform)
            {
                case Device.Android:
                    interstitialUnitId = "ca-app-pub-3940256099942544/8691691433";
                    break;
                case Device.iOS:
                    interstitialUnitId = "ca-app-pub-3940256099942544/5135589807";
                    break;
            }
        }

        public DelegateCommand ShowCommand { get; private set; }

        public DelegateCommand LoadCommand { get; private set; }

        public DelegateCommand IsLoadedCheckCommand { get; private set; }

        // Interstitial広告のロード状況を示すラベルのプロパティ
        public string IsLoaded
        {
            get { return _isLoaded; }
            set { SetProperty(ref _isLoaded, value); }
        }

        // Interstitial広告の表示メソッド
        private void Show()
        {
            if (CrossMTAdmob.Current.IsInterstitialLoaded())
            {
                CrossMTAdmob.Current.ShowInterstitial();
            }
        }

        // Interstitial広告をロードするメソッド
        private void Load()
        {
            CrossMTAdmob.Current.LoadInterstitial(interstitialUnitId);
        }

        // Interstitial広告のロード状況をチェックするメソッド
        private void IsLoadedCheck()
        {
            IsLoaded = CrossMTAdmob.Current.IsInterstitialLoaded().ToString();
        }
    }
}

実際の動作プレビュー（Android）

操作は下記の通り

• 「Interstitial広告をロード」ボタンをタップするとロード処理が行われる。
• 「Interstitial広告のロード状況を確認」ボタンをタップすると、ロード状況が上部ラベルに表示される。
• 「Interstitial広告を表示」ボタンをタップするとInterstitial広告が表示される。ただし、ロードされていない場合は表示されない。

実際の画面はこんな感じ

Interstitial広告が表示される

まとめ

今回作成したサンプルプロジェクトは一応 github.com に置いているのでご参考まで。

neputa / AdmobTest - github.com

また、今回紹介していない MarcTron.Admob の機能については、公式のサンプルを参照されたし。

MTAdmob/Sample/ - github.com

また質問や間違いなどあればコメントまたはTwitterにいただけると幸いです。

はじめに

幸い目に問題がない方々もそうだと思うが、私の日常における活動は視覚を頼る場面が多い。

見て気づき、見て知り、見て思考する。

リラックする場面でも映像や写真を楽しんだり視覚を多用する。

しかし使用頻度が高いがゆえ消耗もいちじるしい。

そこで脳と外界をつなぐ器官を視覚から聴覚へとスイッチする。

イヤホンを耳に装着し音楽プレイヤーを再生してみる。

聴覚から流れ込む音楽はまたたく間に体内を駆け巡り、私の意識をどこか遠い別の地点へと導いてくれる。

No Music No Life である。

音楽の目覚め

中学生のころ、いとこが持っていたエレキギターのサウンドに衝撃を受け、ゴリッゴリのメタルミュージックが私にとって音楽の目覚めとなった。

一部とは思うが私世代あるあるだと思っている。

その後も様々な音楽に触れながら、十台の終わりには渡英するほどのめり込んでいった。

あれから数十年。

いまも音楽は大好きであり、新しい音楽も懐かしい音楽も同じぐらいの割合で楽しんでいる。

ただ一点、私のPlayリストはいつもある種の傾向の偏りがある。

そのある種の偏りは、「夜の音楽」であること。

「夜の音楽」とはなにか？

私の独断偏見確信的直感により「この歌詞は真夜中に書かれたのだろう」や、「このメロディーは暗くなり始めた時間帯に降りてきたのだろう」などの勝手な予測に基づくモノ、あるいは単純に曲調が夜に合うと思うモノなどなど。

少なくとも燦燦と太陽が照りつけるなか、水着を着てビーチではしゃぎながら聞く音楽ではない。

まあ、何と言うか、暗い音楽ばかりっつーことだ。

性格が暗いからか根が暗いからか心が闇だからかわからないが、「夜の音楽」は私の心を鎮め癒してくれる。

若いころは気にならなかったが、年齢を重ねた今現在、「これはイカンのじゃないか？」と思うのだ。

「今さら左手に何かを宿す年齢でもあるまいし、明るい音楽を聴かねば」と私の左手がささやくのだ。

さて明るい音楽とは何か？

自慢じゃないが私の思考は非常に単純であり、暗い音楽ばかり聴くクセに思慮深さなど皆無だ。

「明るい音楽 → 明るい → 太陽 → 晴れの日が多い土地」

自慢じゃないが答えはすぐに出た。晴れの多い国の音楽だ！

「晴れが多い」、いや正確に言うと細かく調べる気は無いので「晴れが多そう」な地域をイメージしてみると、「赤道付近」「地中海」「アフリカ大陸」「南米」「カリブ海」などが思い浮かんだ。

それから更に連想を重ね、「スペイン語圏は日照時間が長そう」に思いいたる。

こんな記事を見つけた。

なんだか明るい音楽がモリモリありそうじゃないの。

英語または日本語の音楽をたしなんできた人生だったが、「言語を切り口に音楽を探すとか新しい！」と我ながら驚いたりもした。

バカっぽくてすまんが、人間の行動パターンなんてこんなもんだろ？

音楽を探すなら「Tiny Desk Concerts」

皆さんはどうやって新しい音楽と出会っているのだろうか。

加入しているサブスクのレコメンドとか今は多いのかもしれん。

学生時代に中古レコード屋やCDショップを駆けずり回った昭和育ちの私にとって音楽は「ススメられるモノ」ではない。「探す」モノだ。

もちろん誰かにススメられたら聴くかもしれないが、私は友達が少ない人生であることを付け加えておく。

まあそんなわけで、私は頻繁に新しい音楽との出会いを求めて探索をする。

かつてはリアル店舗が主戦場だったが、デジタル時代のいまはオンラインで行う。

根が暗いうえに怠惰でもあるので便利なものはどんどん活用していくスタイルだ。

個人的な好みに合う音楽を見つけやすい場所として、いちばんのお気に入りが「Tiny Desk Concerts」である。

Tiny Desk Concerts is a video series of live concerts hosted by NPR Music at the desk of All Songs Considered host Bob Boilen in Washington, D.C.

（Tiny Desk Concertsは、NPR MusicがワシントンD.C.にあるAll Songs ConsideredのホストBob Boilenのデスクで開催するライブコンサートのビデオシリーズです。）

これは人それぞれだと思うけれど、新しい音楽との出会い方として私はできるだけシンプルな生演奏を好む。

かつて20代の頃までは毎週ライブハウスに入り浸っていたが年を取るに連れ足は遠のいてしまった。

いまはインターネットという素晴らしい発明により、さすがに生演奏には叶わないが疑似体験は可能である。

Tiny Desk Concerts では、小さなオフィスで生楽器を主とした演奏をさまざまなアーチストが行っている。

年齢を重ね出不精となりつつも新しい音楽に出会いたいワガママを叶えてくれる素敵な場所だ。

ここで、先ほどのサイトに出てきた「スペイン語圏」の国を検索窓に次々放り込んでいく。

そしたら出てくるわ出てくるわ。

タイトルから「スペイン語圏の音楽？どんなのあるんだろう？」と訪れてきた方、タイトル詐欺では無いからな。

しょーもない長い話はここで終わりにする。ほんとうに長くてすまなかった。

Tiny Desk Concertsで見つけた「スペイン語」の音楽を、タイトルどおり紹介してみたい。

おススメの「スペイン語」の音楽 in Tiny Desk Concerts

1．Monsieur Periné

まずは「Monsieur Periné」というコロンビアのグループ。

8人のメンバーで構成された「アフロ・コロンビアン・サウンド」が特徴。

心地よい複数のパーカッションとギターが刻むリズムが心地よく、伸びやかな歌声を持つ女性ボーカルにとてもマッチしている。

パーカッションの方の前口上からはじまる3曲目の「La Muerte」は最高。

明るい太陽の下を想像させる情熱的なサウンドに酔いしれる。

2．Jenny and the Mexicats

続いて「Jenny and the Mexicats」。

ボーカルの方は英国出身で一部に英語の楽曲もあったりするが、サウンドメーカーはメキシコやスペイン出身者で構成されたグループ。

アップテンポなノリの良い曲から聴かせる曲まで幅広い演奏を披露している。

フラメンコやクンビアっぽいテイストが非常に印象的。

客を楽しませようとするメンバーのサービス精神も好印象で楽しいライブを披露している。

何度聴いても飽きることが無く、この動画は毎週数回は再生している。

3．Natalia Lafourcade

3つ目は「Natalia Lafourcade」というメキシコ出身の女性シンガー。

澄んだ歌声がスペイン語の発音とあいまって心地よい響きとなる。

先に紹介した２組はリズム感の強い音楽が印象的であったが、こちらは聴かせるゆったりとした楽曲がメインで、スペイン語の発音の気持ちよさと美しさを実感させられた。

ちなみに画面右側の２人の年配のギタリストはファン・カルロス・アレンデとミゲル・ペーニャというメキシコを代表するアーティストとのこと。

Nataliaさんキッカケでスペイン語の特徴を感じられる音楽にハマっていくことになった。

+１．Nicki Nicole

最後、プラス１として「Nicki Nicole」。

既に有名な歌手なのでご存じの方も多いかもしれない、アルゼンチン出身のラッパーである。

「もっと心地よいスペイン語を聴かせてくれー」と探して辿り着いたのがラップだった。

スペイン語の心地よい響きが楽しめるお個人的なススメは「Mala Vida」「Parte de Mi」。

ラップだけでなくR&Bっぽい曲やバラードなども良き。

上記の動画では「バンドネオン」がメンバーにいたりバンドサウンドも良き。

バンドネオンの哀愁漂う音色はたまらんのよね。

夜の音楽が大好きな私はアストル・ピアソラ（Astor Piazzolla）とか大好物なので、バンドネオンの音を聴くとすべての動作を止めて聴き入ってしまう。

そう、Nicki Nicoleの音楽は私の中で「夜の音楽」にカテゴリされる。

当初「明るい音楽」を求めて「スペイン語の音楽」へと辿り着いたのだが、結局ゴールは「スペイン語の夜の音楽」だった。

というわけで、先の３組とは分けてプラス１とさせていただいた。

さいごに

「けっきょく夜の音楽かい」というヲチだったが、言語を切り口に新しい音楽と出会うという新しい試みは新鮮で楽しかった。

今回紹介した以外にも素晴らしいグループ、歌手はたくさんTiny Desk Concertsで演奏を披露しているし、知らないものも多々あるのだろう。

音楽はススメられるものじゃない探すものだとか言っておいてなんだが、「こんなのあるよ」とおススメなどあったらコメントまたはTwitterで教えていただけると泣いて喜びます。

No Music No Life、こういうキャッチーな物言いは対面的に素知らぬふりをしているが、心の奥底からグッと来ていたりする。

大きな声で叫びたい「No music No Life！！」

ひとりでも多くの方が最高の音楽に出会えることを願っている。

写真は本文と関係ない。

ポエムみたいな最近脳内をぐるぐると巡っていることのメモ。

他者を傷つけること・他者に傷つけられること

私はあなたと同様に言葉によってひどく傷つけられたことがある。

その時の痛みや怒りや悲しみは、寸分の熱量を失うことなく今でも襲い掛かってくることがある。生涯忘れないのだろうと思う。

一方、私はあなたと同様に言葉によって誰かをひどく傷つけたことがある。

受けた傷への執着を考えてみれば、恐らくその相手も同様の痛みに苦しむことがあると想像がつく。

申しわけない思いだが時間を巻き戻すことはできない。つまり私はあなたと同様に取り返しのつかないことをしたのだ。

刻まれてしまった心の傷は「取り返しがつかない」ことのひとつだ。（その究極は「命」を奪うこと）

不可逆な過ちは犯すべきではないとは思うが、いうほど我々人類は理性的ではないし合理性を謳うわりに矛盾に満ちている。

オンラインの世界ではそんな我々の日常的な思考やふるまいが可視化されている。

当初から興味深く眺めていた世界だが、昨今は見ていて気持ちが参ってしまう場面が増えてしまった。

長年使用してきたブックマーク型ソーシャルサービスはユーザが増え多様性が増すかと思えば偏った思想の発言が数を占めることがしばしばで遠ざかりつつある。

こんなことは繰り返されてきた歴史であり、これからも繰り返される未来史なのだろう。

攻撃は生物が生存するための手段のひとつであり、我々人類が本来持っている綿々と受け継がれてきたモノだ。

そこから言語を発明し、自他を意識し、様々な概念を生み出すことで「本能と理性がせめぎ合う世界」を構築した。

こんな取り留めない思考を垂れ流す。

オンラインにおける公共性

建前として、いや事実としてオンラインの世界はパブリックである。

端末を用意すれば誰でも参加でき情報にアクセスできる。

その公共の場において、(実際に音量はわからんがニュアンス的に)大声でおよそ人前で発するべきではない言葉は日々垂れ流さる状況がいまや日常化している。

匿名性を隠れ蓑にそのような発言をしている主も実際にリアルで対面していれば、その多くは社会的なふるまいをするのではないかと思う。

いまのSNSの状況を眺めていると、子供のころを思いだす。

昭和の日本の公共性を顧みる

私は昭和50年代の生まれで高度成長期の終わりからバブル崩壊までを青春時代として過ごしてきた。（エリアは東京近郊）

今でも思い返すことができる子供心に刺さった公共の場における負の光景をいくつか列挙してみる。

• 至るところにかみ捨てたガムが落ちている。（靴の裏にガムがついてムカつくこと多々あり）
• 駅のホームが喫煙可のため、朝のラッシュ時ホームの屋根付近が白くモヤっている。
• 週末、駅前や居酒屋出口付近で酔って立小便しているスーツ姿の大人を見かける
• カーーーッ、ペッッ、とするヤツがやたらいる。
• （屋内だけど）ゴールデンタイムのテレビで女性の裸が当たり前のように登場する。

真剣に思いだせばもっとあるし、思い出せたが書かない方がいいなと思ったものもある。

こういった光景は現在はまれである、と思う。少なくとも私は見かけることがかなり少ないと実感している。

だが、人間が超自己中心的なふるまいをしたい欲求は消えたのか、というとまったくそんなことはないと思う。

公共の場で自己中を出しづらい仕組みを構築しただけ、つまりフタをして見えないようにしただけなので、行き場をなくした自己中丸出し欲求は匿名で発散できるSNSを格好のフィールドとしたのだろう。

やがてオンラインの世界もクリーンに

昭和から現在にかけ公共の場におけるふるまいが粛清されてきたように、オンラインの世界もルールや罰則が整備され徐々に同様のルートをたどるのだろう。

それでもやはり、われわれ人類が本能的に持っている自己中丸出し全開欲求的なものは消え去るわけではない。

さまよい続けまた新たな大暴れできる場所を探し出すのだと思う。

人類はやがて意識高い生物となるのか

マナー違反とされる類のふるまいはどこから来るのか。

まったく学がない私個人的偏見と感覚では生物本来の野生性、原始性みたいなところから来る「自然な衝動」だと思っている。

人類が文明を築き始めてから3～40世紀。

フランス人権宣言からは200年ちょっとしか経っていない。

ひとりひとりに人権があることが意識され、他者へのふるまいが変化しだしのはごくごく最近のこと。

生物が進化するには二万年の長い年月を要するという。

脱自然を図り都市化した生活が広がっているとはいえ我々の脳や身体はまだまだ野性味を帯びているのだろう。

だが我々は脱・野生を指向している。自然であることから逸脱することを良しとしている。

人類はなぜ私たちを生み育ててきた自然を遠ざけることを進化として目指すのかは不思議であり興味がある。

土をアスファルトで覆い隠し、家屋は風や日光を遮断し密閉性高め、洋服や靴の進化はガンガン五感を鈍らせる。

社会性の定義やマナー、ルール、ふるまいも同様である。

自己中心的なふるまいは野蛮なものとされ、他者への寛容、受容を良しとする。

平等という概念などは、競争の結果が生存に直結する自然界からはおよそかけ離れたモノだと思う。

だが我々はそれを発明し指向している。激しくせめぎ合いながらも、その指向に傾いていっていると思う。

ただいまは自分たちが生んだ新たな概念と、原始的な本能のはざまにあるのだろう。

生物進化に必要な二万年を経た先に、我々は果たして本能から平等を欲求する生物へと変貌を遂げているのだろうか。

それまでは、変わることなくリアルからオンラインへ、そしてまた別の場所でいつか来た道をぐるぐると回り続けるのだろうけれど。

この記事の概要

先日、購入した中古のノートPCに「Ubuntu 20.04LTS（日本語Remix版）」をインストールした。

続けてOS周りの設定作業を行った。

今回は必要なアプリケーションをインストールした作業の備忘録。

画像・動画編集やエンタメ系のモノは入れない。低スペックだから。容量がもったいないから。どうせ動かないから。

ブログを書いたりノートをまとめたりとテキスト操作オンリーのストロングスタイル端末の話なので悪しからず。

アプリケーションのインストール

LibreOffice

マイクロソフトのOffice互換アプリケーション。念のため入れておく。

sudo add-apt-repository -n ppa:libreoffice/ppa
sudo apt update
sudo apt dist-upgrade -y

私の低速端末でupgradeは結構な時間がかかった。

Ubuntu Cleaner

よくあるCleanerアプリのUbuntu版

sudo apt install ubuntu-cleaner

Joplin

「Joplin」はノートアプリ。

現在WindowsとAndroid端末で使用している。主に収集した情報整理したり永久保存したいWeb記事のスクラップが主な用途。

興味がある方はこちらの記事を参考にされたし。

インストールは下記コマンドを実行する。

wget -O - https://raw.githubusercontent.com/laurent22/joplin/master/Joplin_install_and_update.sh | bash

参考サイト：Joplin公式

VSCode

このブログはVSCodeで書いている。記事の他、ブログテンプレートやJavascript等も同様。記事及びソースファイルはGit&Githubで管理している。ブログサービスは「Blogger」を使用しているのだが、エディタが非常に貧弱なのでVSCodeさまさまである。

1. VSCode公式サイトから「.deb」ファイルをダウンロードする
2. 以下コマンドを実行しインストールする

   sudo apt install ダウンロードした.debファイル
   sudo apt install -y apt-transport-https
   sudo apt update

参考サイト：Ubuntu18にVisual Studio Codeをインストールする最も簡単な手順

この記事の概要

先日、中古ノートPCを購入しUbuntu20.04LTSをインストールした。

今回はUbuntuインストール後に行ったことをまとめる。

作業項目としては、後述する参考サイトから以下の条件で行うべきと判断したものをピックアップした。

• Ubuntuのバージョンは「20.04LTS」の「日本語Rmeix版」
• 英語キーボードを使用（英字配列）
• IMEは「Fctix + Mozc」

参考サイト

• Ubuntu 20.04 LTS をインストールした後やること13選
• Ubuntu 20.04 LTSをインストールした直後に行う設定 & インストールするソフト
• ubuntu20.04インストールしたら最初にやること
• Mozc UT2をインストールする - Ubuntu 20.04編
• 【Ubuntu18.04】新機能 LivePatchについて
• Ubuntuで最初にやる設定 - ネガティブログ

Ubuntuをインストールしてやったこと詳細

日本語ディレクトリ名を英語に変更

homeディレクトリ配下にデフォルトで作成されている「ダウンロード」「テンプレート」「ピクチャ」などのディレクトリ名を英語に変更しておく。

1. 以下コマンドを実行する
   

   LANG=C xdg-user-dirs-gtk-update

2. ダイアログが表示されるので「名前を更新する」を選択し再ログインする
3. 再ログインすると再び同じダイアログが表示されるので、「次回から表示しない」にチェックを入れ、「古い名前のままにする」をクリックする
   

   

上記のやり方でうまく行かない場合、自分でディレクトリを作成し、設定ファイルの内容を書き換える。

1. homeディレクトリで下記コマンドを実行しディレクトリを作成する
   

   mkdir Desktop Downloads Templates Public Documents Music Pictures Videos

2. 設定ファイルを開く
   

   vi ~/.config/user-dirs.dirs

3. ファイルを下記内容に修正する
   

   XDG_DESKTOP_DIR="$HOME/Desktop"
   XDG_DOWNLOAD_DIR="$HOME/Downloads"
   XDG_TEMPLATES_DIR="$HOME/Templates"
   XDG_PUBLICSHARE_DIR="$HOME/Public"
   XDG_DOCUMENTS_DIR="$HOME/Documents"
   XDG_MUSIC_DIR="$HOME/Music"
   XDG_PICTURES_DIR="$HOME/Pictures"
   XDG_VIDEOS_DIR="$HOME/Videos"

ディスプレイ電源自動オフ時間の延長

1. アクティビティ画面で「settings」と検索し「設定」を開く
2. 左側の一覧から「電源」を選択
「ブランクスクリーン」のプルダウンから任意の値を選択

Dockにゴミ箱を表示

ゴミ箱へのアクセス頻度は低いが、必要なときはDockにあると便利なので。

端末で以下を実行

gsettings set org.gnome.shell.extensions.dash-to-dock show-trash true

元に戻す場合

gsettings reset org.gnome.shell.extensions.dash-to-dock show-tras

Dock のアプリケーション表示ボタンを一番上へ移動

マウスやタッチパッドはほぼ使用しませんが、アクセス頻度が高い項目なので一番上にしておく。

端末で以下を実行

gsettings set org.gnome.shell.extensions.dash-to-dock show-apps-at-top true

元に戻す場合

gsettings reset org.gnome.shell.extensions.dash-to-dock show-apps-at-top

空のファイルテンプレート

GUIからディレクトリ操作を行う際に、右クリックから新規ファイルを作成できるようにする。

使うか微妙だけどWindowsに慣れた身としてはあったほうが良いと判断。

端末で以下を実行

touch ~/templates/空のドキュメント

ウインドウ自動最大化をオフ

標準でどのアプリを起動してもウインドウが常に最大化状態で開くのでこれを解除する。

端末で以下を実行

gsettings set org.gnome.mutter auto-maximize false

元に戻す場合

gsettings reset org.gnome.mutter auto-maximize

ファイルマネージャのアドレスバーをテキスト形式にする

GUIでファイルを操作する際、デフォルトだとファイルマネージャのアドレスバーがボタン表示となっている。

これをテキスト表示に変更する

端末で以下を実行

gsettings set org.gnome.nautilus.preferences always-use-location-entry true

元に戻す場合

gsettings set org.gnome.nautilus.preferences always-use-location-entry false

システム日本語表示の問題対応

細かいところだが、システム上の日本語表示がデフォルトだとおかしい部分がある。

例えば画面上部に表示されている時計のコロンが全角だったり。

これを「NT UI JP」というフォントをインスト−ルして対処する。

wget https://launchpad.net/~sicklylife/+archive/ubuntu/fonts-ja/+files/fonts-nt-ui-jp_2_all.deb
sudo apt install ./fonts-nt-ui-jp_2_all.deb
rm fonts-nt-ui-jp_2_all.deb

元に戻す場合

sudo apt remove -y fonts-nt-ui-jp
sudo apt autoremove

強制終了（Ctrl + Alt + Backspace）を有効化

万が一のPCトラブルに備え、ショートカットキーによる強制終了を行えるようにする。（デフォルトではオフとなっている）

1. 以下コマンドを実行する

   sudo dpkg-reconfigure keyboard-configuration

2. キーボードの選択画面で該当するものを選択し、「了解」（デフォルトで現在のキーボードが選択されているはず）
   

   

3. 続いてキーボードレイアウトの「国」を選択し「了解」
   

   

4. キーボードのレイアウトを選択し「了解」
   

   

5. 「AltGrとして機能させるキー」で「キーボード記憶のデフォルト」を選択し「了解」
   

   

6. 「コンポーズキー」は無いので「コンポーズキーなし」を選択し「了解」
   

   

7. ようやく「Ctrl + Alt + Backspace」の項目が出るので「はい」を選択する
   

   

動画や音楽再生用のコーデックインストール

sudo apt install ubuntu-restricted-extras

GNOME Shell Extensionsのインストール

GUIにGNOMEを使っている場合、GNOME Shell Extensionsを使用することで様々な機能追加や設定を行うことができる。

GNOME Shell Extensionsはブラウザからアクセスして使用する。

私は「火狐原理主義者」なので「Firefox」の設定を行う。

他のブラウザを使用する方は下記サイトを参考にされたし。

1. gnome-shell-extension-prefsインストール

   sudo apt install gnome-shell-extension-prefs

2. Firefoxで こちら にアクセスしアドオンを追加する

Win zipファイル解凍時の文字化け対応

1. 以下コマンドで必要なパッケージを追加・インストールする

   wget -q https://www.ubuntulinux.jp/ubuntu-ja-archive-keyring.gpg -O- | sudo apt-key add -
   wget -q https://www.ubuntulinux.jp/ubuntu-jp-ppa-keyring.gpg -O- | sudo apt-key add -
   sudo wget https://www.ubuntulinux.jp/sources.list.d/focal.list -O /etc/apt/sources.list.d/ubuntu-ja.list
   sudo apt update
   sudo apt dist-upgrade
   sudo apt install ubuntu-defaults-ja

2. 再起動で設定を反映

日本語辞書の拡充

標準で入っているMozcの日本語辞書が貧弱なので有志の方が作成し公開しているMozcに差し替えを行う。

1. こちら のサイトにアクセスし、左側のツリーより該当するUbuntuバージョンのtar.xzをダウンロードする
2. ダウンロードしたファイルの場所で以下コマンドを実行しファイルを展開、展開されたディレクトリへ移動する
   

   tar xavf ./mozc-* && cd mozc-*/

3. 以下コマンドを実行し必要なパッケージをインストールする

   sudo apt update && sudo apt upgrade -y && sudo apt install -y devscripts debhelper libibus-1.0-dev pkg-config libxcb-xfixes0-dev libgtk2.0-dev python3-dev gyp protobuf-compiler libprotobuf-dev qtbase5-dev libqwt-qt5-dev libgwengui-qt5-dev libuim-dev libzinnia-dev fcitx-libs-dev gettext desktop-file-utils ninja-build

4. 以下コマンドでビルドする
   私の貧弱マシンでは10分ほどかかった

   sudo ./build_mozc_plus_utdict

5. ビルドが終わったら不要なパッケージを削除する

   tail -n 5 /var/log/apt/history.log | grep Install: | sed -e s/"Install: "// | sed -e s/", automatic"//g | sed -e s/"), "/"\n"/g | sed -e s/" (.*$"/""/g | tr '\n' ' ' | xargs sudo apt-get remove -y

6. 先程のビルドにより複数作成されたdebファイルを下記コマンドですべてインストールする

   sudo apt install -y mozc-utils-gui
   sudo dpkg -i ./mozc-data_*.deb ./mozc-server_*.deb ./mozc-utils-gui_*.deb ./ibus-mozc_*.deb ./fcitx-mozc_*.deb

7. 再起動する
8. テキスト入力できるエリアで試しに「ばーじょん」と入力し、変換候補の中に「UT2-2.23.2815.102+24.2.oss」が含まれていれば成功

※参考サイト：Mozc UT2をインストールする - Ubuntu 20.04編

Livepatchの設定

セキュリティアップデートをインストールした際にUbuntuを再起動しなくてすむようにする。

この機能を利用するには「Ubuntu One アカウント」が必要となる。

1. こちら にアクセスし、「Ubuntu one アカウント」を作成する
2. 登録したアドレス宛に認証用のメールが届くので送られてきたURLにアクセスし認証を済ます
3. アクティビティ画面で「Livepatch」と検索し「ソフトウェアアップデート」を開く
4. 「サインイン」ボタンをクリックし、先程作成したUbuntu Oneアカウントでサインインする

   

5. トグルスイッチがオンになり「Livepatchが有効です」と表示されていれば完了。

   

参考サイト： 【Ubuntu18.04】新機能 LivePatchについて

ファイアーウォールを有効にする

1. 下記コマンドで「gufw」をインストールする

   sudo apt install gufw
   

2. アクティビティ画面で「gufw」と検索し起動する
3. 「Status」のトグルスイッチをオンにする
   

   

「Myrica」フォントをインストール

端末やその他テキスト操作を行うアプリで使うフォントをインストールする。手順はどのフォントでも同様であるが、ここでは「Myrica」をインストールする手順を示す。

1. こちら にアクセスし、サイト中段にある「Myrica.ttc」と「MyricaM.ttc」をダウンロードする（7zとzipはお好みで）
2. ダウンロードしたファイルを解凍し、「Myrica.TTC」および「MyricaM.TTC」ファイルを「/usr/share/fonts/truetype」に配置する
3. 下記コマンドでフォント一覧のキャッシュを更新する
   

   fc-cache -fv

参考サイト：Ubuntuで最初にやる設定 - ネガティブログ

Mozcのデフォルト入力モードを「ひらがな」にする

まず日本語入力まわりで問題があったのでこれを解決した。

日本語Remix版のUbuntu20.04lTSをインストールすると「Mozc」が標準で入っている。

しかしひとつ問題があり、入力切り替えをすると何故か入力モードのデフォルトが「直接入力」となっており、日本語入力をするためにログインするたびマウス操作で「ひらがな」に切り替える必要がある。

設定等で変更ができないため、Mozcのソースを入手し修正＆ビルド＆再インストールが必要。

手順が多いので別記事にまとめている。

日本語入力切り替えのショートカットキーを設定する

入力切り替えをトグル式で行うのが好きではないのでオン・オフそれぞれにショートカットを割り当てる。

個人的なワガママで入力切り替えに「alt」キーを交えて使用したい。

標準で入っているIbusでは「alt」を割り当てることができないため「Fctix」を使用する。

手順が多いので別記事にまとめている。

本記事の概要

• 前回記事の続き、というか新たに得た知見についてをまとめる。
• 内容は「Google Search Console」の「カバレッジ」における「リダイレクト エラー」の原因およびその解決方法。
• 明確な仕様がどこにも見つからないため、あくまで実践により得た結果である。
• 対象は「Blogger」を利用しているこのブログ。

前回の振り返り

前回記事では、URL（htmlファイル名）に問題があると結論付けた。

実際にBloggerのパーマリンクを修正することで「リダイレクト エラー」の表示が消え、インデックス登録がなされたためである。

しかし、パーマリンクに記号（ハイフン等）を含めないという前回の解決方法で運用していたところ、リダイレクトエラーが再発。

調査を再開したところ下記のコメントを発見。

Redirect error - Google Search Central Community

Blogger特有のモバイルページへのリダイレクト周りに問題がありそうだと考え検証を行った。

リダイレクト エラー発生原因

結論を先に述べると、Bloggerの仕様であるモバイルアクセスによる「m=1」ページへのリダイレクト(302リダイレクト)が原因と思われる。（ドキュメントに書かれていないため断定はできない）

以下、原因について詳細を記す。

Bloggerで作成したページにスマホ等のモバイルデバイスでアクセスするとリダイレクトが発生する。

「Redirect Checker」で試しにこのブログのページをチェックしてみる。

このサイトの使い方は、チェックしたいページのURLを貼り付け、「Set User-Agent」を選択し、「analyze」ボタンをクリックするだけ。

「User-Agent」はSearch Consoleによるクロールを想定して「Google Mobile Smartphone(2020 01-08 Chrome/41.0.2272.96)」を選択。

結果はこうなる。

正規URLの「https://www.neputa-note.net/2021/10/blogpost01.html」にアクセスすると、「302 Moved Temporarily」が発生し、「https://www.neputa-note.net/2021/10/blogpost01.html?m=1」にリダイレクトされる。

この「?m=1」にリダイレクトされるのはBloggerの仕様である。

リダイレクトが発生すること自体は問題ないが、「302」であることが問題と思われる。

「301」と「302」の違いについてはこちらの記事をどうぞ。

Search Console公式におけるリダイレクトエラーの説明は下記の通り。

• リダイレクト チェーンが長すぎる
• リダイレクト ループが発生している
• リダイレクト URL が最終的に URL の最大長を超えた
• リダイレクト チェーンに不正または空の URL がある

今回のケースはこのいずれにも該当していないが、公式にない要件として「302リダイレクト」が含まれるのではないか？

要はインデックス登録を申請するのであれば、リダイレクト先のURL、もしくは301の永続リダイレクト対象のURLにしろよと。

もう一つ疑問がある。

PC等でアクセスした場合、リダイレクトは発生せず正規URLをそのまま表示する。

しかし、Search Consoleでインデックス登録の申請をするとリダイレクト先のURLを参照しに行こうとする。

これは、2020年5月からGoogleがWeb全体のインデックスをモバイルファーストとすることを宣言したためである。

Announcing mobile first indexing for the whole web

Search Consoleのリダイレクト エラーをよく見てみると、ユーザー エージェントは「スマートフォン用 Googlebot」とある。

過去に登録されているURLは問題ないが、この仕様変更のあとは問答無用で最初にスマートフォン用のGooglebotによるクロールが行われる。

そしてもう一つ分かったこと。スマートフォン用のGooglebotでリダイレクトエラーとなっても、いずれ解消する。

ドキュメントに無いので、あくまで仮説である。

1. インデックス登録の申請をすると、まずスマートフォン用のGooglebotがクロールを行う。
2. Bloggerの正規URLは302リダイレクトとしてエラー判定となる。
3. その後、何日あるいは何週間かすると、PC用のGooglebotがクロールを行う。
4. ここで正規URLが問題ないと判断され、インデックス登録が行われる。

しかし、いつPC用のクローラーが来るか分からないのでとりあえずの解決方法を考えた。

リダイレクト エラー解決方法

正規URLを申請すると「302 リダイレクト」が発生し、これを「リダイレクト エラー」として判定されてしまう。

これを回避するため、「?m=1」パラメータをURL末尾につけてインデックス登録を申請する。

以上。

問題はないのか。

1か月ほど、新規投稿した複数の記事を検証してみた結果を記す。

1. パラメータを付けることでインデックス登録が速やかに行われる。（長いもので24時間程）
2. サイトマップをSearch Consoleに登録しておくと、いずれそちらもクロールされる。（数日～数週間）
3. ここで正規URLがインデックス登録される。
4. この時点で、当初申請したパラメータ付きURLを「URL検査」してみると、「URL が Google に登録されていません」となる
5. 一方、正規URLは問題なく「URL は Google に登録されています」となっている。
6. 当初申請したパラメータ付きURLと正規URLが、おそらくマージされ正規URLのみがインデックス登録された状態となる。

終わりに

やや腑に落ちない面もあるが、これによりインデックス登録におけるBloggerのリダイレクトエラーは回避することができた。

そもそもBloggerのモバイルリダイレクト仕様、いい加減いらんやろ、という話だ。

Googleがあまり力を入れていないプロジェクトなのだろうから仕方がないが、せめてSearch Consoleの仕様に併せたアップデートをしてほしい。まあこれからも無いだろうけど。

当面、この方法で運用し、また問題が見つかったり、新たな知見を得た場合は記事を書こうと思います。

少しでもお役に立ちましたら、この記事をシェアしていただけると喜びます。

読んでいただきありがとうございます。

前回の「リダイレクト エラー」に関する記事

「Blogger」関連の記事