蒼井呉人 – ページ 3 – ウェブアラカルト

勝手にツイートされた？Twitterのアプリ連携で覚えのないアプリと連携していないか確認・解除する方法

2014年2月23日に蒼井呉人が投稿 — 1件のコメント ↓

Twitter(ツイッター)を利用していて

・自分がツイートした覚えのない文章がツイートされていた。
・フォローした覚えのない人がフォローされていた。

こんなことになってしまうことがあります。
もちろん、「ポケットにスマホを入れていたら勝手に押されてて」という場合や、「子供が勝手に操作して」という可能性もあります。

ただ、上記の様な場合以外に、「アプリ連携」で悪質なアプリと連携してしまっている可能性があります。

その様な時に何をすれば良いか、順に説明していきます。

・パソコンを持っている場合
・スマートフォンやタブレットしか持っていない場合

■パソコンを持っている場合

1)パスワードを変更する。
念の為、まずTwitterのパスワードを変更しておくと安全です。
詳しい説明は、Twitter公式のヘルプセンター内にある「アカウントが乗っ取られた場合」ページを見ると載っていますので、目を通してみると良いかもしれません。

2)アプリ連携を確認する為、ウェブブラウザでTwitterの設定ページを表示する。
Twitter上部メニューにある「歯車マーク」(下図の赤枠□で囲われた部分)→「設定」(下図のオレンジ枠□で囲われた部分)の順でクリックし、設定ページを表示する。

3)アプリ連携ページを表示する。
ページ左メニューにある「アプリ連携」(下図の赤枠□で囲われた部分)をクリックする。

4)アプリ連携ページが表示されるので、覚えのないアプリが無いか確認し、覚えのないアプリがあったら「許可を取り消す」。
自分が過去にアプリ連携を認証(許可)したアプリの一覧が表示されます。

左に「アプリのアイコン」
中央に「アプリ名」「開発者名」「アプリの説明」「アクセス権」「許可日時」
右に「許可を取り消すボタン」
が表示されています。

もし、自分が許可した覚えのないアプリがあったら、右の「許可を取り消す」ボタンを押しましょう。それで、今後そのアプリは、自分のアカウントに対して何も(アクセスもツイートも)できなくなります。

アプリ連携取り消しに関する詳しい説明は、Twitter公式のヘルプセンター内にある「サードパーティアプリケーションを連携または取り消す方法」ページを見ると載っていますので、目を通してみると良いかもしれません。

これで完了です。
今後は、アプリ連携をする際は、このアプリ大丈夫かな？とちょっと慎重に考えたり調べたりしてから、連携を使用すると良いかと思います。
アプリ連携自体は便利な仕組みなので、むやみに怖がるのではなく、連携を許可する時にはちょっと慎重になった上で、上手に付き合っていくことが大事です。

■スマートフォンやタブレットしか持っていない場合

アプリ連携は、ウェブブラウザでPC版のTwitterにアクセスして確認します。ツイッタークライアント(アプリ)やモバイル版のTwitterからでは、アプリ連携の確認・解除は行えません。

そこで、スマホ・タブレットでも使えるウェブブラウザ「Chorome」のメニューにある「PC版サイトを見る」にチェックを入れることで、スマホ・タブレットからPC版のTwitterを表示し、アプリ連携の確認・解除を行うことができます。

(ブラウザ右上の「≡」(下図の赤枠部分)をクリック→「PC版サイトを見る」(下図のオレンジ枠部分)にチェックを入れる)

これで、モバイル環境でもPC版のTwitterを閲覧できるようになりました。

ここから先は、このページの上にあるパソコンを持っている場合に書かれている手順と同じことを行っていけばOKです。

なお、この確認・設定が終わったら、「Chorome」のメニューにある「PC版サイトを見る」のチェックは外しておくと良いでしょう。

【2014年10月13日追記】
Twitterアプリ連携のアクセス権(権限)と許可する時の注意点をまとめた記事を書きましたので、よろしければあわせてお読みくださいませ。
・Twitterアプリ連携のアクセス権(権限)と許可する時の注意点

CakePHPのselectボックスのemptyオプションでvalueを指定する方法

2014年1月17日に蒼井呉人が投稿 — コメントはありません ↓

CakePHP2.xのformにて、selectボックスのemptyオプションでvalueを指定したい場合どうすれば良いのか、メモ代わりに記述しておきます。

※公式のCakebook 2.xには記述が見当たらなかった(私の探し方が下手なだけの可能性もあり)ので。

■Cakebook2.xに掲載されている内容(を参考に私が書いたもの)

echo $this->Form->select('field', array(1 => 'Internet Explorer', 2 => 'Google Chrome', 3 => 'Firefox'), array('label'=>false, 'empty'=>'ウェブブラウザ'));

上記の様に記述した場合、出力されるHTMLは以下の様になります。

<select name="data[Xxx][field]" id="XxxField">
<option value="">ウェブブラウザ</option>
<option value="1">Internet Explorer</option>
<option value="2">Google Chrome</option>
<option value="3">Firefox</option>
</select>

これだと、ウェブブラウザの項目のvalueは空っぽです。

emptyオプションの指定を

'empty'=>'ウェブブラウザ'

と行うと、valueの値は空っぽになります。

例えばvalueの値を「0」にしたい場合は、以下の様にすれば良いようです。

■selectボックスのemptyオプションでvalueを指定する方法

echo $this->Form->select('field', array(1 => 'Internet Explorer', 2 => 'Google Chrome', 3 => 'Firefox'), array('label'=>false, 'empty'=>array(0 =>'ウェブブラウザ')));

上記の様に記述した場合、出力されるHTMLは以下の様になります。

<select name="data[Xxx][field]" id="XxxField">
<option value="0">ウェブブラウザ</option>
<option value="1">Internet Explorer</option>
<option value="2">Google Chrome</option>
<option value="3">Firefox</option>
</select>

ウェブブラウザの項目のvalueに「0」がセットされました。

emptyオプションの指定を

'empty'=>array(0 =>'ウェブブラウザ')

というように、連想配列で渡せば良いようです。

[参考]ここに、フォーム(select、checkbox、radioのオプションに関する記述あり。ただし、「valueが空っぽになる」方の記述法しか掲載されていないようです。)
Cakebook 2.x -> FormHelper -> Options for select, checkbox and radio inputs

browserconfig.xmlの作成方法

2014年1月15日に蒼井呉人が投稿 — 1件のコメント ↓

エラーログにbrowserconfig.xmlが見つからないというログがちょこちょこで出るようになってきたので、調べてみました。

■browserconfig.xmlとは？
Windows8で機能するIE11のライブタイルにて、ユーザーがサイトをピン留めするとIE11によって自動的に読み取られるファイル。

[参考]MSDN(Microsoft Developer Network)内の関連情報ページ
ライブタイルの作成
 IE11での Web サイト用カスタムタイルの作成

どうやら、ユーザがサイトをピン留めした時の表示内容や挙動を設定しておくファイルといった感じのものの様です。

■browserconfig.xmlを作成する
一番簡単なのは、以下のサイトを利用して作成する方法です。
BuildMyPinnedSite.com

[参考]
IE9の「ピン留め」対応方法紹介サイト、日本語を含む各国語版を公開(INTERNET Watch)

BuildMyPinnedSite.comは、マイクロソフトが提供しているbrowserconfig.xmlの作成が簡単に出来るサイト。
サイトで案内されている3つの手順を順に行っていくだけで、browserconfig.xmlを作成することができます。

(1)Webサイトのタイルを作成する

「タイトル(タイルに表示する文字列)」「(タイルの)背景色」「アップロード(タイルに表示する画像)」の3つを入力します。

・タイトル(タイルに表示する文字列)
　サイト名で良いかと思います。

・(タイルの)背景色
　ライブタイルの背景色を指定します。入力欄に直接カラーコードを入力しても良いですし、の右にあるスポイトマークをクリックして色を選択しても良いです。

・アップロード(タイルに表示する画像)
　タイルに表示する画像をアップロードできます。アップロードできるのは、png、gif、jpgの3種類のファイルです。

画像をアップロードすると、画像の下に4つのサイズ「128×128」「270×270」「270×558」「558×558」が表示されます。それぞれをクリックし、上の画像部分をドラッグして画像の表示範囲を指定するとサイズの所にチェックマークがつくので、それを全サイズに対して行います。

実際にどんな感じに見えるのかは、ページ右側の「ライブプレビュー」部分に表示されるので、それを見ながら作業すると良いです。

ちなみに、270×558が横長画像となる為、アップロードする画像は余白が大きい画像か横長の画像が良いです。そうでないと、表示したい部分が入らない、上下が切れた画像しか作れませんので・・・。

(2)プッシュ通知を追加する

ライブタイルのプッシュ通知で届けたい情報を指定できます。
ここでは、RSSフィードのURLを入力することが可能です。

(3)コードを入手

(1)～(2)で指定した情報を反映させたコードが自動生成されます。

・表示されたMETAタグをHTMLに追加する方法
・「パッケージをダウンロード」からbrowserconfig.xmlと各種画像ファイルをダウンロードする方法

の2種類がありますが、HTMLを書き換えるのは面倒なので、パッケージをダウンロードするのが良いかと思います。
ダウンロードしたZIPファイルを解凍すると

・browserconfig.xml
・large.png
・square.png
・tiny.png
・wide.png
・README.txt

というファイルがあります。
browserconfig.xmlをルートディレクトリにアップロードし、同じディレクトリに4つの画像ファイルもアップロードします。

例)ウェブアラカルトの場合
http://alc.netgamebm.com/browserconfig.xml
にbrowserconfig.xmlをアップロードしました。

もし、4つの画像を別のディレクトリにアップロードしたいという場合は、browserconfig.xmlの中の各画像ファイルへのパスを書き換えればOKです。

以上で完了です。

試しにWindows8.1のスタート画面にウェブアラカルトをピン留めしてみてみると、以下の様になりました。

ブログの最新記事数件のタイトルが、ローテーションでくるくると表示されていました。

XPからOSを切り替える人も多いでしょうし、そんなに作るのに手間のかかる物ではないので、browserconfig.xmlを作っておいてもよいのではないでしょうか。