<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>PICKUP &#8211; 株式会社カジトリ 技術ブログ</title>
	<atom:link href="https://develop.kajitori.co.jp/archives/tag/pickup/feed" rel="self" type="application/rss+xml" />
	<link>https://develop.kajitori.co.jp</link>
	<description>Officeアドイン、Laravel、Exmentなどの技術記事を記載します。</description>
	<lastBuildDate>Wed, 31 Aug 2022 09:14:14 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	

<image>
	<url>https://develop.kajitori.co.jp/wp-content/uploads/2021/01/cropped-logo1-32x32.png</url>
	<title>PICKUP &#8211; 株式会社カジトリ 技術ブログ</title>
	<link>https://develop.kajitori.co.jp</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Officeアドインを開発時に気を付けなければいけない地雷まとめ</title>
		<link>https://develop.kajitori.co.jp/archives/22</link>
					<comments>https://develop.kajitori.co.jp/archives/22#respond</comments>
		
		<dc:creator><![CDATA[hsatou]]></dc:creator>
		<pubDate>Mon, 15 Apr 2019 11:48:01 +0000</pubDate>
				<category><![CDATA[Officeアドイン]]></category>
		<category><![CDATA[iframe]]></category>
		<category><![CDATA[PICKUP]]></category>
		<category><![CDATA[地雷]]></category>
		<guid isPermaLink="false">https://develop.kajitori.co.jp/?p=22</guid>

					<description><![CDATA[はじめに 「Officeアドイン」は、ざっくり言うとOffice上で動作するWebアプリケーションです。 Office2013から登場し、Office2016、Office365(クライアント版)、Office365(W...]]></description>
										<content:encoded><![CDATA[<h1>はじめに</h1>
<p>「Officeアドイン」は、ざっくり言うとOffice上で動作するWebアプリケーションです。<br />
Office2013から登場し、Office2016、Office365(クライアント版)、Office365(Web版)など、様々なOfficeで動作します。</p>
<img decoding="async" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204834/b6feaee7-d18b-413a-88c8-c658a536d416.png" alt="image.png" />
<p>Officeアドインは2013年頃に登場し、細々と機能追加を繰り返してきました。<br />
しかし、いかんせんノウハウと情報が少ないです。<br />
そしてこの技術を使えるエンジニアの方も非常に少ないので、なかなか広まらないのも事実です。<br />
「Officeアドイン」と日本語で検索すると、MS公式か、ほとんどが自分の発信な気がしてます・・・笑<br />
（先日、「officeアドイン」で検索したら、<strong>MS公式ページより先に、自分の過去の発信が上位に出てきました笑</strong>）</p>
<p>そしてもう一つ。<br />
このOfficeアドインは、いかんせん情報が少ないこともあり、いざやってみると、意外なところで詰まってしまう「<strong>地雷</strong>」が多いです。<br />
そこで今回は、幾多の案件を行ってきて、この地雷に立ち向かってきた自分が、「<strong>Officeアドインで気を付けなければいけないところ</strong>」についてまとめます。<br />
今後、もしOfficeアドインを案件や自社開発などで使用することを検討している方は、まずこの記事を読んでいただいて、事前に検証いただけることをオススメします。</p>
<h1>地雷まとめ</h1>
<h2>Officeの種類によって、出来ることがぜんぜん違う</h2>
<p>OfficeアドインはOffice2013から登場した、ということは上記で説明しました。<br />
そこからOffice2016、Office365(クライアント版)、Office365(Web版)と増えてくるにつれて、出来る機能も増えてきました。<br />
ですが、<strong>その出来る機能が、すべてのOfficeで使えるものではありません。</strong></p>
<p>例えば「アドインコマンド」。これはOfficeのメニューにコマンドを追加するという機能です。<br />
あらかじめアドインを設定しておけば、以降わざわざOfficeアドインを選択しなくても、メニューボタンをクリックするだけでアドインを実行できます。<br />
<img decoding="async" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204834/8ee7f3f9-9fd1-1cb3-5f21-f6f432b337a9.png" alt="image.png" /></p>
<p>※引用：(<a href="https://docs.microsoft.com/ja-jp/office/dev/add-ins/design/add-in-commands">https://docs.microsoft.com/ja-jp/office/dev/add-ins/design/add-in-commands</a>)</p>
<p>しかし、この機能はOffice2013とOffice2016では動作しません（ただしOutlook2016のみOK）。<br />
こちらに<a href="https://docs.microsoft.com/en-us/office/dev/add-ins/reference/requirement-sets/add-in-commands-requirement-sets">アドイン コマンドの要件セット</a>というページがあるのですが、ここでアドインコマンドは、Office2013と2016は「N/A」や「16.0.4678.1000 Supported in Outlook only」となっています。<br />
つまり非対応ですね。<br />
最新のOfficeだけで合わせると、「これ出来なかったのか」という事故につながるので、気をつける必要があります。</p>
<p>なお、各Officeで出来ること、出来ないことは、以下のページをご参照ください。<br />
<a href="https://docs.microsoft.com/en-us/office/dev/add-ins/reference/requirement-sets/office-add-in-requirement-sets">Office Common API requirement sets</a></p>
<h2>Officeのログイン者情報を、Officeアドインで取得することはできない</h2>
<p>Office2013から、Officeにログインを行うことができます。<br />
<img decoding="async" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204834/ac1b3b4d-6691-8fcd-a5f9-f696395620f1.png" alt="image.png" /></p>
<p>なのでOfficeアドインを始める際、「このログイン情報を取得しよう」と誰もが思うでしょう。このログイン情報からアクセストークンを取得し、ゴニョゴニョしよう、ということです。<br />
ですが、<strong>このOfficeの情報を、Officeアドインでは取得することが、現在は出来ません。</strong><br />
なので、ユーザーのOffice365の情報を絡めたアプリを作成する場合、ユーザーは再度、サインインページを表示する必要があります。</p>
<p>なお正確に言うと、2019/04/13現在、上記機能はプレビュー版です。<a href="https://docs.microsoft.com/en-us/office/dev/add-ins/reference/requirement-sets/identity-api-requirement-sets">Identity API</a>という名前で、現在プレビュー版ということで実装しているようです。<br />
ただし、それでもやはり「Office 2013 or later for Windows」では「N/A」になっているので、いずれにせよOffice2013と2016は切り捨てて実装しなければなりません。</p>
<h2>認証が絡む場合、Office Onlineには本当に注意</h2>
<p>クライアント版のOfficeアドインが、Office Onlineでも動作すると思っていると、確実に失敗します。<br />
なぜなら、クライアント版のOfficeアドインと、Office OnlineのOfficeアドインは、作られ方がぜんぜん違うからです。</p>
<p>クライアント版のOfficeアドインは、ざっくり言うとアプリ内で、ブラウザ（IE）を立ち上げるような形式に対し、<br />
<strong>Office OnlineのOfficeアドインは、iframeで起動します。</strong></p>
<p>もし、サードパーティ(GoogleやOffice365やGitHubなど)のアクセストークンを使用して、サードパーティの情報を使用したアプリを開発しようと考えた場合。<br />
iframeなので、つまりサードパーティ(GoogleやOffice365やGitHubなど)のログイン画面などは、パネル内で表示されないことになります。</p>
<p>一方で、クライアント版では普通に表示されます。<br />
なので、最初にクライアント版でログイン画面が表示され、よしこのままOnline版もやっちゃおう！となった場合、<br />
このことを知らないと、Office Onlineでは確実にエラーになってしまいます。</p>
<h2>回避方法もあるが、IEで以上に面倒なことになる</h2>
<p>これを回避するために、<a href="https://github.com/OfficeDev/office-js-helpers">office-js-helpers</a>という仕組みも用意されています。<br />
これは、ログイン画面をOfficeアドイン内ではなく、ダイアログを起動してログイン画面を表示する仕組みです。<br />
<img decoding="async" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204834/c5ba9332-cd91-22e4-0772-1fd9914d7d15.png" alt="image.png" /><br />
上記のように、アドインとは別のダイアログを起動します。<br />
未ログインの状況であれば、そのままログイン画面が表示され、IDパスワードを入力し、ログイン完了したら、ダイアログを自動で閉じて、アドイン側にトークンを受け渡す、という仕組みです。<br />
ダイアログ内で表示するので、iframeの制約にも引っかかることなく、ログインを行うことができます。</p>
<p>これを使えばいいじゃないか、と思うかもしれませんが、今度はIEの場合で、「<strong>信頼済みサイト</strong>」の問題が出てきます。<br />
「信頼済みサイト」の問題とは、簡単にいうと「<strong>ブラウザ内のすべてのサイトを、同一のセキュリティゾーンに入れなければいけない</strong>」、という制約です。</p>
<p>例えば、Office365にログインを行ってアクセストークンを取得し、Office365の情報を取得するようなアプリを考える場合。<br />
この場合、以下のページの信頼済みサイトを揃える必要があります。<br />
「Office OnlineのSharePointサイト」（<a href="https://foobar.sharepoint.com">https://foobar.sharepoint.com</a>）<br />
「アドインの本体のサイト」（<a href="https://foobar1234567.azurewebsites.net">https://foobar1234567.azurewebsites.net</a>）<br />
「Office365ログインページ」(<a href="https://login.microsoftonline.com">https://login.microsoftonline.com</a>)<br />
<img decoding="async" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204834/73238fc0-0c3b-7a33-6477-fef1f7725377.png" alt="image.png" /></p>
<p>「揃える」とはすなわち、<br />
「<strong>すべて信頼済みサイトに入れる</strong>」か、「<strong>すべて信頼済みサイトに入れない</strong>」の、どちらかです。<br />
これが揃っていないと、エラーが発生します。</p>
<p>そしてこれが厄介なのが、<strong>『いつの間にか、Office OnlineのSharePointサイトが追加されていることがある』</strong>ということです。<br />
Office365をいじっているときなのか、クライアント版のOfficeにアプリのURLを追加した場合なのかは分かりませんが、気付いたらこのSharePointサイトが信頼済みサイトに追加されているときがあります。<br />
そうなると、アプリが起動できなくなります。その場合には、残りのサイトを追加する必要があります。</p>
<p>そして、<strong>この一連の流れを、アプリを利用する利用者にやってもらわなければなりません。</strong><br />
会社でポリシー配布などを行っていればいいですが、そうでない場合でIEで実行を行う場合に、すべての利用者に、この信頼済みサイトの追加をやってもらわなければなりません。・・・まあ、超面倒ですね。<br />
対策としては、「IEをサポートから切り捨てる」というのも有りかもしれないですね笑</p>
<h2>Windows10のIE11で、データのやり取りが正常に動作しない場合がある</h2>
<p>上記のダイアログ形式で、アクセストークンのやり取りをするわけですが、<strong>ここまでやっても、正常に動作しないことがあります。</strong><br />
それはどうも、Windows10の、一定時期より古いIE11だと、正常に動作しないようです。<br />
かんたんに調査してみたでのすが、</p>
<ul>
<li>ダイアログ同士のデータのやり取りは、標準ではjavascriptのpostMessageで行う</li>
<li>だが、IEではpostMessageに対応していないので、localStorageの監視によりデータをやり取りしている</li>
<li>だがだが、Windows10のIE11だと、上記の「IEかどうか」という条件が正常にしておらず、うまく動かない（Office.jsのバグ？）</li>
<li>そのため結果的に、一部のWindows10のIE11だと動作しない</li>
</ul>
<p>ということで、Windows10のIE11だと、うまく動かないことがあるようです。<br />
なので、最終的な結論としては、Online版は<strong>IE非推奨</strong>にしてしまうのが一番ですね。（切実）</p>
<h1>まとめ</h1>
<p>Officeアドインはどうにも伸び悩んでいます。<br />
その背景は多々ありますが、一つはこの地雷の多さにあると、私は思っています。<br />
それでも、Officeアドインで開発する！という事になった場合、まずはこの記事を読んでいただき、どんな地雷があるかどうか、知ってもらえると嬉しいです。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://develop.kajitori.co.jp/archives/22/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>診断系のFacebookアプリは危険！？Facebookアプリの仕組みについて解説(2018年版)</title>
		<link>https://develop.kajitori.co.jp/archives/97</link>
					<comments>https://develop.kajitori.co.jp/archives/97#respond</comments>
		
		<dc:creator><![CDATA[hsatou]]></dc:creator>
		<pubDate>Thu, 30 Aug 2018 13:00:32 +0000</pubDate>
				<category><![CDATA[その他技術]]></category>
		<category><![CDATA[API]]></category>
		<category><![CDATA[Facebook]]></category>
		<category><![CDATA[OAuth]]></category>
		<category><![CDATA[PICKUP]]></category>
		<guid isPermaLink="false">https://develop.kajitori.co.jp/?p=97</guid>

					<description><![CDATA[はじめに 最近、筆者の周りで 「Facebookの診断系アプリは危険」 「あらゆる個人情報を、業者に渡すことになる」 「やってしまうと、Facebook乗っ取られたり、投稿」 「やってしまった方は、今すぐパスワードを変更...]]></description>
										<content:encoded><![CDATA[<style type="text/css">
.h_midashi, .h_midashi2{<br />
    margin-top: 3em;<br />
}<br />
</style>
<h2 class="h_midashi">はじめに</h2>
<p>最近、筆者の周りで<br />
「Facebookの診断系アプリは危険」<br />
「あらゆる個人情報を、業者に渡すことになる」<br />
「やってしまうと、Facebook乗っ取られたり、投稿」<br />
「やってしまった方は、今すぐパスワードを変更して二段階認証を設定するべき」<br />
という話が上がっていました。</p>
<p>Facebookの診断系アプリというと、例えば今だと以下のようなものです。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830192756.png"><img fetchpriority="high" decoding="async" class="alignnone size-large wp-image-555" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830192756-768x670.png" alt="" width="768" height="670"></a></p>
<p>これ系のアプリの診断結果は、ちょいちょいFacebookのフィードにも上がってきますね。</p>
<p>これらのアプリをあまりやらないほうがいいのは、筆者も同意見です。<br />
ですが、「ものすごく危険」「やると乗っ取られる」といったこととは、事実と若干異なる部分があります。</p>
<p>そこで今回は、</p>
<ul>
<li>Facebookアプリとはそもそもなにか</li>
<li>どのような情報を取得しているか</li>
<li>どのような仕組みなのか</li>
<li>巷で言われていることの事実・間違いの切り分け</li>
</ul>
<p>を、可能な限りシステム疎い方でも分かるように、頑張って解説していこうと思います！</p>
<p>※個人の見解を含みます。また間違いや情報の更新などございましたら、ご指摘いただければ幸いです。</p>
<p><span id="more-97"></span></p>
<h2 class="h_midashi">先に結論を書くと(最低限これだけ)</h2>
<ul>
<li>Facebookアプリはパスワードを盗めないから乗っ取りも出来ないから安心しろ</li>
<li>あなたの友達がどんなアプリを使用していても、あなたには影響がない</li>
<li>ただし、アプリの設定によっては「あなたに代わって投稿」は出来ちゃうから、そこだけ注意</li>
<li>また、アプリの設定によっては「個人情報を不必要に悪用」されるリスクはある</li>
<li>100％安全というわけではないので、アプリ使用時の設定を必ず確認し、自己責任で使用すること</li>
</ul>
<h2 class="h_midashi">Facebookアプリとは？</h2>
<p>ざっくり言うと、Facebookの情報を使用したアプリすべてです。<br />
それはWebサイトの場合も、スマホのアプリの場合もあります。</p>
<p>例えば、前述したWebサイトの「nametests.com」は、典型的なFacebookアプリです。<br />
<a href="https://ja.nametests.com/"><a href="https://ja.nametests.com/">https://ja.nametests.com/</a></a><br />
<a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193633.png"><img decoding="async" class="alignnone size-large wp-image-556" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193633-768x536.png" alt="" width="768" height="536"></a></p>
<p>Facebookの情報を使用して、診断や占いなど行うものですね。</p>
<p>一方で、スマホのアプリでも、Facebookの情報を使用しているものがあります。<br />
例えば、一時期筆者もやっておりました「キャンディークラッシュ」。<br />
これはアプリの設定で、「Facebookでログイン」という表記がされています。<br />
<a href="https://hirossyi.net/wp-content/uploads/2018/08/2018-08-30-21.59.43.jpg"><img decoding="async" class="alignnone size-large wp-image-557" src="https://hirossyi.net/wp-content/uploads/2018/08/2018-08-30-21.59.43-374x768.jpg" alt="" width="374" height="768"></a></p>
<p>よくある診断系だけでなく、このようなスマホのアプリも、立派なFacebookアプリです。</p>
<p>そして、そのFacebookアプリをユーザーがはじめて使用するとき、このような表示がされます。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193634.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-558" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193634-750x768.png" alt="" width="750" height="768"></a></p>
<p>よく見るやつですね。<br />
そして、「裕としてログイン」をクリックすることで、アプリ（写真の場合はnametests.com）が、ユーザーの情報を取得することができるわけです。</p>
<h2 class="h_midashi">Facebookアプリの仕組み</h2>
<p>さて、ここからはFacebookアプリの仕組みを、簡単に解説します。<br />
順を追って解説していきますね。</p>
<h3 class="h_midashi2">開発者がFacebookアプリを作る時</h3>
<p>開発者がFacebookアプリを開発する際、「このアプリは、Facebookのどの情報を取得するか？」という情報を、開発者はあらかじめ設定しておきます。<br />
例えば、</p>
<p>・ユーザーのEメールアドレス<br />
・ユーザーの写真一覧<br />
・ユーザーの誕生日<br />
・ユーザーの性別<br />
・ユーザーのタイムライン一覧<br />
・友達リスト<br />
といった情報です。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193635.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-559" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193635-768x368.png" alt="" width="768" height="368"></a></p>
<p>このような情報を、アプリごとに、あらかじめ設定しておく必要があります。ちなみにこれらの設定を「スコープ」といいます。</p>
<p>なお、ここで1点特記事項としては、これらの項目として、<strong><span style="color: #ff0000;"><span class="red bold">パスワードを設定することは出来ません。</span></span></strong><br />
<strong><span style="color: #ff0000;"><span class="red bold">Facebookアプリはパスワードを取得することは出来ませんし、変更することも出来ません。</span></span></strong></p>
<h3 class="h_midashi2">ユーザーがFacebookアプリを使用する時</h3>
<p>そして、Facebookアプリを使用する場合です。<br />
下の画像のように、Facebookアプリを使用する際、「Facebookにログイン」のボタンをクリックします。</p>
<p>すると、上にも貼り付けた画像が表示されます。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193634_2.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-561" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193634_2-750x768.png" alt="" width="750" height="768"></a></p>
<p>ここで重要なのは、赤線で囲った部分です。<br />
これは、これから使用するFacebookアプリが、Facebookから取得する情報・もしくは使用する権限を、一覧で表示します。</p>
<p>ちなみにキャンディクラッシュの場合はこちらです。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/2018-08-30-20.30.41.jpg"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-562" src="https://hirossyi.net/wp-content/uploads/2018/08/2018-08-30-20.30.41-374x768.jpg" alt="" width="374" height="768"></a><br />
「友達リスト」が含まれていますね。なのでキャンディクラッシュは、ログインしたユーザーの友達リストも取得することができるようになっています。<br />
（そして、この「友達リスト」についても重要な事実があります。詳しくは後述します）</p>
<p>ユーザーは、ここに書かれている情報を確認することで、「これから使用するFacebookアプリは、いったいどんな情報を使用するか」ということを、確認することができるわけです。</p>
<p>なので、必要以上にてんこ盛りだと、「あれ、なにか怪しくない？」となるわけです。<br />
設定を大量にぶち込むと、こんな感じになります。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193636.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-563" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193636-701x768.png" alt="" width="701" height="768"></a></p>
<p>これはあからさまに怪しいですねｗこのようなアプリは怪しいので、ユーザーは使用しない方がいいです。</p>
<h3 class="h_midashi2">ユーザーがFacebookにログイン後、アプリで行っていること</h3>
<p>「Facebookにログイン」を実施した後、アプリ内部でどのような処理を行っているかを説明します。</p>
<p>まず、ログインすることで、Facebookから「アクセストークン」と呼ばれる、超長い文字列が返ってきます。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193637.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-564" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193637-768x140.png" alt="" width="768" height="140"></a></p>
<p>こんな感じの文字列です。実際には200字以上あります。</p>
<p>この文字列を使用して、アプリはFacebookから、情報を取得するわけです。<br />
例えば、ログインユーザーのプロフィールを、アプリから取得したい場合、</p>
<p>・先ほど取得したアクセストークン<br />
・取得したい内容<br />
この2点をFacebookに渡します。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193638.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-565" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193638-768x354.png" alt="" width="768" height="354"></a></p>
<p>こうすることによって、Facebookはプロフィール情報を、アプリに送り返すわけです。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193639.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-566" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193639-768x219.png" alt="" width="768" height="219"></a></p>
<p>ちなみにここで取得できるのは、ユーザーがログインしたときに設定している、「スコープ」の範囲内です。<br />
上の画像で使用している例でいうと、アプリBでは「友達リスト」を設定しています。<br />
そのため、アプリは友達リストを取得することができます。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193640.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-567" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193640-768x340.png" alt="" width="768" height="340"></a></p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193641.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-568" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193641-768x230.png" alt="" width="768" height="230"></a></p>
<p>一方、アプリAでは「友達リスト」を、取得する情報として設定していません。<br />
そのため、仮にアプリAが友達リストを取得しようとすると、エラーが発生して取得できません。</p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193642.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-569" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193642-768x331.png" alt="" width="768" height="331"></a></p>
<p><a href="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193643.png"><img loading="lazy" decoding="async" class="alignnone size-large wp-image-570" src="https://hirossyi.net/wp-content/uploads/2018/08/capture_20180830193643-768x205.png" alt="" width="768" height="205"></a></p>
<p>このように、Facebookから情報を受け取ったアプリは、この情報を使用して、その後のプログラムで活用できることになります。</p>
<p>※この仕組みは、システム用語で言うと「API」と呼ばれます。<br />
また、ログインなどの仕組みを「認証」「認可」、Facebookアプリで採用している仕組みは「OAuth2」と呼びます。<br />
テストには出ないです。</p>
<p>これが、Facebookアプリの一連の流れです。<br />
ここで重要なのは、<br />
・Facebookアプリでは、ログインユーザーのパスワードを受け取っていないし、受け取ることは決して出来ない<br />
・ログインユーザーの情報は、「アクセストークン」と呼ばれる超長い文字列を使用することで、取得できる。そしてこれは、パスワードを使用しない<br />
・Facebookアプリがアクセストークンを取得するためには、ログインユーザーが一度、「Facebookでログイン」ボタンを押す必要がある<br />
ということです。</p>
<h2 class="h_midashi">巷で言われている話の真偽、QA</h2>
<p>これらの話を踏まえ、Facebookアプリ（特に診断系）について、巷で言われていることの真偽やQAをまとめていきます。</p>
<h3 class="h_midashi2">Facebookアプリを使用すると、アカウントが乗っ取られる！！</h3>
<p>「乗っ取られる」の定義が何かによりますが、「IDパスワードが盗まれる」「自分のアカウントを誰かに勝手に使われる」という意味だと、それはNOです。<br />
なぜなら、<strong><span style="color: #ff0000;"><span class="red bold">Facebookアプリはログインユーザーのパスワードを取得することが出来ない</span>からです。</span></strong><br />
パスワードを取得出来ないので、悪意のある開発者が、その後のアカウントをどうこうしようとしても、それは出来ません。<br />
※ただしFacebookアプリでは、「タイムラインの投稿」というスコープがあります。これは文字通り、Facebookアプリが、ログインユーザーのタイムラインに投稿をすることができる権利です。<br />
そのため、<span class="font-bold">アプリのスコープに「タイムラインの投稿」が含まれていた場合、悪意のあるアプリが、ユーザーにタイムラインに投稿することは出来てしまいます。</span>そこは要注意です。</p>
<h3 class="h_midashi2">診断系アプリを使用してしまったら、今すぐパスワード変更をして二段階認証を設定すべき！</h3>
<p>これは意味がないです。なぜなら、もうおわかりだと思いますが、Facebookアプリはパスワードを使用していません。<br />
いくらパスワードを変更しようとも、二段階認証を設定しようとも、アクセストークンが有効な限り、Facebookアプリはあなたの情報を取得できてしまいます。<br />
なのでこの点に関しては、二段階認証も無意味です。<br />
（ただ一般論として、現代では二段階認証の有無で情報流出のリスクが段違いなので、二段階認証は設定するようにしてくださいね）</p>
<h3 class="h_midashi2">アプリを使用すると、個人情報を抜かれるんでしょ？</h3>
<p>これは、上で解説している「スコープ」次第です。スコープで設定した内容のみ、Facebookから情報が取得できます。<br />
ちなみに標準設定だと、アプリが取得できるのは、<br />
<span class="red">※2018/09/02 1:00訂正</span><br />
・id<br />
・名前<br />
・公開プロフィール(プロフィール写真、性別など)<br />
です。<br />
※当初、idと名前のみと記載しておりましたが、公開プロフィールも含まれておりました。訂正いたします。<br />
なお、公開プロフィールは、Facebookに登録していなくても、誰でも閲覧できる情報になります。</p>
<p>これらはFacebookの画面からかんたんに取得できる、公開情報になります。<br />
それ以上の情報は、アプリごとに設定されているスコープ次第です。ログイン画面でユーザーが許可した内容のみ、Facebookアプリに渡すことになります。</p>
<p>この設定によって、例えば以下のような情報をアプリに渡すことになります。<br />
・メールアドレス<br />
・誕生日<br />
・写真<br />
・タイムライン投稿の一覧<br />
なにかに悪用しようと思えば十分ですね。<br />
そのため、Facebookアプリを使用する場合、<span class="font-bold">ログイン時の「受け取る情報」がどうなっているかを確認し、自己判断で行ってください。</span><br />
ちなみに、実際に個人情報悪用のニュースもあるようです。<br />
<a href="https://r.nikkei.com/article/DGXMZO29264270R10C18A4X11000?s=0" rel="noopener noreferrer" target="_blank"><a href="https://r.nikkei.com/article/DGXMZO29264270R10C18A4X11000?s=0">https://r.nikkei.com/article/DGXMZO29264270R10C18A4X11000?s=0</a></a></p>
<h3 class="h_midashi2">友達のあの人がFacebookアプリを使用すると、自分の個人情報まで流出するからやめろ！！</h3>
<p>これは明確にNOです。<br />
その根拠は、Facebook APIの「友達リスト」の仕様に記載があります。<br />
<a href="https://developers.facebook.com/docs/graph-api/reference/v3.1/user/friends"><a href="https://developers.facebook.com/docs/graph-api/reference/v3.1/user/friends">https://developers.facebook.com/docs/graph-api/reference/v3.1/user/friends</a></a><br />
ざっくり和訳すると、以下になります。</p>
<p>↓↓↓↓↓↓<br />
友達リスト<br />
あなたに以下の情報を提供します<br />
・このFacebookアプリをインストールした、あなたの友達ユーザーの一覧<br />
・あなたの友達ユーザーの総数（このFacebookアプリをインストールしていないユーザーを含む）<br />
↑↑↑↑↑↑</p>
<p>つまり、悪意のあるアプリを友達が利用しちゃってたとして、<strong>あなたがそのアプリを使用しない限り、あなたの情報を友達が取得することは出来ません。</strong></p>
<p>キャンディークラッシュを例にとります。キャンディークラッシュのアプリで取得できる、Facebookの友達の情報は、すでにキャンディークラッシュをインストールしている友達のもののみです。<br />
<strong>キャンディークラッシュを使用していないユーザーの情報を、キャンディークラッシュが取得することは出来ません。</strong></p>
<p>なので、どれだけ友達が変なアプリを使用していようが、イライラする必要はないです。ご安心を。</p>
<h3 class="h_midashi2">じゃあなんでレイ○ンの投稿や乗っ取りは終わらないの？</h3>
<p>Facebookアプリとは別の原因の可能性が高いです。例えばパスワード使い回しとかね。<br />
最低限パスワード使い回しは辞めて、二段階認証の設定は行いましょう。起こってからでは遅いです。</p>
<h3 class="h_midashi2">他のブログで、「個人情報が抜かれる！！」「こんなのやる人は頭が悪い！！」と書いてあったんだけど</h3>
<p>たぶん技術的なことが分かっていない人が書いたブログだと思います。それかアクセス稼ぎか。<br />
「Facebookにログイン」のときに書かれている項目以外の情報が、Facebookから抜き出されていたとしたら、<strong class="red font-bold font-large">それはFacebookの大セキュリティ事故です。</strong>それも株価大暴落ってレベルじゃない。<br />
そんなことができるとしたら、真っ先にこっそりFacebookに報告しましょう。すごい報酬がもらえるはずです。<br />
・・・まあ、それぐらい有り得ないレベルですね。</p>
<h3 class="h_midashi2">結局、Facebookアプリは100％安全なの？</h3>
<p><span class="font-large">100％安全という訳ではないです。</span><br />
乗っ取りや、関係ない友達の情報を悪用されることはありませんが、あなたの個人情報悪用のリスクがあります。</p>
<h3 class="h_midashi2">難しくて、良く分からなかった！</h3>
<p><span class="font-large">アプリを使用しないのが無難です。</span></p>
<h2 class="h_midashi">まとめ</h2>
<p>以上、Facebookアプリの仕様をまとめました。<br />
昔はFacebookアプリは、割と自由だった記憶があります。なので友達の情報を勝手に利用とか、そういうことが起きていたのかもしれません。<br />
が、最近厳しくなったようです。悪意のある業者が勝手に投稿など行ったんでしょう。<br />
それもあってか、少なくとも2018年現在では、アプリに関するセキュリティはかなり厳重になっております。なので、悪意のあるアプリによる被害というのは、限りなく低いと思います。<br />
（考えてみると、Facebookアプリのそういった投稿、昔に比べて減ってますよね）</p>
<p>ただ、それでもリスクが無いわけではないです。<br />
例えば診断系のアプリでは、写真を使うものがあります。<br />
「写真を取得」のスコープを設定すれば、アプリがログインユーザーの写真を取得することが出来ますので、その写真を使って、どうこうすることは考えられます。</p>
<p>なので、やはりFacebookアプリを使用する場合は、自己判断で行うほうが良いです。<br />
そのアプリが信頼できる業者なのか、その辺は自分自身で判断してください。</p>
<h2 class="h_midashi">最後に</h2>
<p>Facebookアプリが、情報を取得できないようにする方法です。<br />
この方法を実行すれば、実行後はFacebookアプリは、一度許可していたとしても、情報を取得することができなくなります。<br />
その手順は以下のURLをご参照ください。（書こうとしたけど力尽きた）<br />
<a href="https://www.facebook.com/help/204306713029340"><a href="https://www.facebook.com/help/204306713029340">https://www.facebook.com/help/204306713029340</a></a></p>
<h2 class="h_midashi">つづき</h2>
<p>個人情報提供のリスクについて書きました<br />
<a href="https://develop.kajitori.co.jp/?p=100">https://develop.kajitori.co.jp/?p=100</a></p>
]]></content:encoded>
					
					<wfw:commentRss>https://develop.kajitori.co.jp/archives/97/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>連載[1/3] いちから学ぶOfficeアドイン &#8211; Officeアドインとは？</title>
		<link>https://develop.kajitori.co.jp/archives/24</link>
					<comments>https://develop.kajitori.co.jp/archives/24#respond</comments>
		
		<dc:creator><![CDATA[hsatou]]></dc:creator>
		<pubDate>Sun, 01 Apr 2018 11:50:21 +0000</pubDate>
				<category><![CDATA[Officeアドイン]]></category>
		<category><![CDATA[PICKUP]]></category>
		<category><![CDATA[いちから学ぶ]]></category>
		<guid isPermaLink="false">https://develop.kajitori.co.jp/?p=24</guid>

					<description><![CDATA[はじめに 2016/04/01、Microsoftで「Build 2016」が開催されました。 https://build.microsoft.com/ そのBuild2016で、僕が以前から携わっている「Officeア...]]></description>
										<content:encoded><![CDATA[<h2>はじめに</h2>
<p>2016/04/01、Microsoftで「Build 2016」が開催されました。<br />
<a href="https://build.microsoft.com/">https://build.microsoft.com/</a></p>
<p>そのBuild2016で、僕が以前から携わっている「Officeアドイン」についても大きな発表がありました！<br />
おすすめの動画はこれらです。<br />
<a href="https://channel9.msdn.com/Events/Build/2016/P554">https://channel9.msdn.com/Events/Build/2016/P554</a><br />
<a href="https://channel9.msdn.com/Events/Build/2016/P561">https://channel9.msdn.com/Events/Build/2016/P561</a></p>
<p>Officeアドインの大幅な機能拡充により、今後利用ユーザー、開発ユーザーともに増えていくことが予想されます！（増えてほしいです）<br />
しかし、Officeアドインの内容をまとめた記事や情報、そしてアプリそのものもかなり少なく。<br />
興味を持った方が利用、もしくは開発しようにも、断念しかねないというのが現状です。</p>
<p>そこで今回は、Officeアドインのついての概要と、Officeアドインのメリット、そして現在抱えている課題とその解決策を、連載としてまとめていこうと思います。<br />
連載第1回は、<strong>「そもそもOfficeアドインとは何か」</strong>、そして<strong>「Officeアドインのメリット」</strong>についてまとめていきます。 </p>
<h2>Officeアドインとは？</h2>
<p>「Office アドイン（Office Add-ins、Office用アプリ、office.js）」は、「Microsoft Office 2013（以下Office）」以降で動作する、Officeの機能を拡張するWebアプリケーションです。<br />
Office上で各アプリが起動し、ドキュメントと連携して情報をやり取りしたり、種類によってはメールを送信する等を行うことも出来ます。 </p>
<p>Officeアドインには何個か種類があります。例えば、 </p>
<p><a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/wikipedia.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/wikipedia-768x491.png" alt="wikipedia" /></a><br />
Officeの右側でアプリが起動する「作業ウインドウ」形式。Word・Excel・PowerPoint等で動作します。 </p>
<p><a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/BingMaps.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/BingMaps-768x523.png" alt="BingMaps" /></a><br />
Excel上のシート右側でアプリが起動する「コンテンツ」形式。 Excelで動作します。 </p>
<p><a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/Outlook.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/Outlook-768x381.png" alt="Outlook" /></a><br />
Outlookでアプリが起動する「メール」形式。見た目上は「作業ウインドウ」形式と変わりませんが、内部構造は若干異なります。<br />
また、Outlookでは上記の画像のように、メールの本文上でアプリを開くことも出来ます。 </p>
<p>このように、Office上でアプリを動作させることが出来るのが「Officeアドイン」の特徴です。 </p>
<h2>Officeアドインのメリット</h2>
<p>Officeアドインを使用することによって、どのようなメリットがあるか？<br />
独自の見解になりますが、これから解説していきます。<br />
一般ユーザー向けと、開発者向けの2つのアプローチから解説します。</p>
<h3>【一般ユーザー向け】アプリケーションをWeb上から簡単に導入できる</h3>
<p>従来のOffice系プログラミングであるVBA・VSTOで、プログラムを追加したい場合、通常はWebブラウザを別途起動して、ファイルをダウンロード→実行、ということが多いと思います。<br />
（他に方法あるかもしれませんが・・・あまり詳しくないです笑）<br />
管理は大変ですし、ファイルごとにプログラムを実行しようと思ったらけっこう面倒です。</p>
<p>ですがOfficeアドインの場合、<strong>Office上のリボンにある「Officeアドイン」ボタンを押下することで、Officeストアからアプリを入手する事ができます</strong><br />
<a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/Excel.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/Excel-768x523.png" alt="Excel" /></a><br />
<a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/officestor.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/officestor-768x520.png" alt="officestor" /></a><br />
非常に手軽ですし、ボタンひとつで複数のファイルにアプリを挿入する事ができます。<br />
「手軽さ」「誰でも実行できる」これは本当に便利です！</p>
<h3>【一般ユーザー向け】Office365でも使用可能</h3>
<p>Microsoftのクラウドサービスとして、『Office365』というものがあります。<br />
Microsoftが全面に打ち出している（らしい）このOffice365では、「Word Web Apps」や「Excel Web Apps」など、ブラウザ上でOfficeが起動できるのですが、<br />
<strong>このOffice365でも、アプリが起動できます！</strong><br />
<a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/online.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/online-768x372.png" alt="online" /></a><br />
クライアント版のOfficeを持っていない人でもアプリを実行できるので、アプリの敷居は低いと言えるでしょう。</p>
<h3>【開発者向け】Webアプリケーションなので、HTML・CSS・Javascriptなど、汎用的な技術をそのまま流用できる</h3>
<p>それまでのOffice系プログラミングであるVBA・VSTO等では、けっこうとっつきにくい開発言語や、言語が限定されていました。<br />
VBAでは「Visual Basic for Applications」という比較的昔の言語、「VSTO」は「Visual Studio Tools for Office」という、限定された言語での開発となってしまいます。<br />
しかし、Officeアドインは「office.js」というJavaScriptファイルを使用したWebアプリケーションです。Webアプリケーションなので、ナウでモダンでメジャーな言語・技術をいっぱい使用できます！<br />
PHP、C#、RoR、node.js、Python、GO・・・ Typescript、coffeescript、Jquery・・・<br />
<a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/lang.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/lang-300x144.png" alt="lang" /></a><br />
情報が無数にある技術を使用できるので、非常に手軽に開発することができます！</p>
<h3>Officeアドイン最高！！・・・と言いたいけれど</h3>
<p>以上が、Officeアドインのメリットになります。<br />
こうして書くと、すごく優秀なOfficeのパートナーになりそうですね！<br />
これだけ優れてならば、きっとアプリが超充実！技術界隈も大盛り上がり！！<br />
・・・となっている、そう思う方もいるかもしれませんが、<br />
<strong>現実は、そう甘くはありません。</strong><br />
冒頭にも書いたのですが、このOfficeアドイン界隈は、 残念ながら2016年現在、<strong><font color="Red">そこまで栄えているとは言えない現状</font></strong>にあります。<br />
<a href="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/cry-1316458_1280.png"><img decoding="async" src="https://develop.kajitori.co.jp/wp-content/uploads/2016/06/cry-1316458_1280-300x271.png" alt="cry-1316458_1280" /></a></p>
<p><strong>「Microsoft」の「Office」という強力な2大双璧を持ちながら、なぜこのような現状なのか？</strong><br />
次回は、<strong>「Officeアドインの抱える欠点とは」</strong>ということをテーマとして、記事を書いていきたいと思います。</p>
<h2>Next</h2>
<p><a href="https://develop.kajitori.co.jp/?p=26">いちから学ぶOfficeアドイン – Officeアドインの問題点とは</a></p>
]]></content:encoded>
					
					<wfw:commentRss>https://develop.kajitori.co.jp/archives/24/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
