Windows 10 Creators Update に搭載される Edge の新機能

会社の大きなトランスフォーメーションの波にのまれ、私もチームが変わり、本家 Microsoft Edge Dev Blog の記事を訳すのがやっとというありさまで、すっかりこちらの更新がご無沙汰となってしまっておりました。(なんと!、こちらのブログには今年初の投稿です) 今回の記事では 4 月 11 日 (2017 年) からの配布がアナウンスされている Windows 10 Creators Update に搭載される Edge の新機能について紹介します。 Windows 10 Creators Update は、Windows 10 更新アシスタントを利用した手動アップグレードが 4 月 5 日(米国時間) から可能だそうなので、配布が待ちきれない人はそちらから入手していちはやくお試しになるのも良いでしょう。 今回も皆様のフィードバッグからさまざまな機能追加や修正がなされています。 もちろん、某 Faceb〇〇k に投稿する際に入力文字のお化けが出てしまう件も修正されています。(開発メンバーが「fix it」、と言っていたし、私の手元でも今のところ問題が発生していないので、修正されていることと思います。) この場をかりて、さまざまなフィードバックをいただいたすべての皆様に感謝いたします。 Windows 10 Creators Update での Microsoft Edge の新機能 Windows 10 Creators Update で追加される新機能はたくさんありますが、ユーザーが触れるところから、ということで UI があるところから紹介していきましょう。 タブ機能の強化…

0

Microsoft HoloJS とは?

image_thumb523.png
image_thumb523.png

  Microsoft の GitHub リポジトリに突如として現れた Microsoft HoloJS について簡単に紹介しましょう。 HoloJS という名前から一般的な Web ブラウザーで動作する JavaScript のライブラリを連想した人も多いかもしれませんが、残念ながらこれは Universal Windows Platform (UWP) アプリを開発するためのフレームワークです。したがって Web コンテンツの作成には使用できませんし、Windows 10 でしか動作しません。 Windows 10 がお手元ない人はダウンロードして環境を作るか、いっそあきらめて WebVR (※)の勉強でもすると良いでしょう。(※WebVR は Edge も対応すべく絶賛開発中ですので、2017 年中には WebVR がそれなりに使える環境も整ってくるでしょう。) HoloJS とは HoloJS は、JavaScript と WebGL を使用して UWP アプリケーションを作成するためのフレームワークです。 HoloJS は、JavaScript コードを実行するための Chakra をホストする C++ ライブラリであり、また、 OpenGL ES のグラフィックスの呼び出しを処理するための ANGLE をホストしています。OpenGL…

0

Microsoft Edge Dev Blog の翻訳記事を Microsoft Edge Japan ブログで公開します。

Microsoft Edge Dev Blog の翻訳記事を Microsoft Edge Japan ブログで公開します。
Microsoft Edge Dev Blog の翻訳記事を Microsoft Edge Japan ブログで公開します。

  会社の大きなトランスフォーメーションの波にのまれてすっかり宙に浮いた状態になってしまっていた Microsoft Edge Japan ブログですが、Windows の PM (ブラウザーの専任 PM は日本のポジションからなくなってしまったので) に許可をとり、私のほうで本社の Edge 開発チームのブログ Microsoft Edge Dev Blog の翻訳記事をポストすることにしました。 個人での活動のため Best-effort での投稿となり、また、すべての記事ではなく、開発や運用に有用なものから優先順位をつけてポストしていくため掲載順も前後するかもしれませんが何卒よろしくお願いいたします。   翻訳について 翻訳については、最近 AI の力によって賢くなった Microsoft Translator を使用します。 (Microsoft Translator の画面)   今回、翻訳記事を載せようと思いついたのも Microsoft Translator の性能向上がきっかけです。 Microsoft Edge Dev Blog に記事がポストされるたびに、内容を把握するためにいくつかの翻訳ツールを使用して個人的に翻訳して読んでいたのですが、今回のアップデートで格段に翻訳作業が楽になり、せっかくなので記事を投稿しよう、となったわけです。 よって、翻訳記事の内容は基本的には Microsoft Translator が翻訳したものになります。 名称や言い回し等で明らかに正しくないもの、わかりづらいものについてはこちらで修正しますが、私もそれほど英語に長けているわけではないので、慣用的表現などはついては、もしかしたらとんちんかんな訳になってしまう可能性のありますが何卒ご了承くださいませ。   年末にむけていくつかの記事を Microsoft Edge Japan ブログにて公開予定ですのでどうぞお楽しみに。  …

0

Edge 拡張の Windows ストアへの提出 (2016年11月現在)

image_thumb352.png
image_thumb352.png

最近、「Edge の拡張を作ったのだけれど、Windows Store への提出方法がわからない」というお問い合わせが増えてきましたので、メモ的に書いておきましょう。 Windows ストアに Edge 拡張を提出するには? 以下、リンク先の FAQ ページの “I have an extension ready for Edge. How can I get it submitted to the store?” の回答にあるとおり、Edge 拡張については、今現在 (2016年11月)、信頼性やパフォーマンスのテレメトリーを取得したり、フィードバックを得るために意図的に小さなセットでの提供を行っており、一般の開発者からの提出はまだ受け付けていません。 Frequently Asked Questions – Microsoft Edge Development 準備が整いましたら Tech Preview などから受付が開始されると思いますので、もう少々お待ちくださいませ。 なお、どうしても先行して提出したいという場合は、以下のリンクからリクエストをあげることができます。 もし、その拡張が Edge の利便性において有用だと開発チームに判断されれば、開発チームより連絡がある、らしいです。 ‎https://aka.ms/extension-request‎‎ かような状況につき、もう少々お待ちいただければと思います。 もし、一分一秒でも早く提出可能になったことを知りたい場合は、私が感知しだいツイートしますので、私の Twitter アカウント @osamum_MS をフォローしていただければと思います。

0

Microsoft Edge 拡張の相互運用性

image68.png
image68.png

以前の記事の「拡張機能の相互運用性」 で記述したとおり Edge の拡張用 API は Microsoft、Mozilla、Opera 3 社の提案する共通のコア API をサポートしており、その API は Chrome 拡張 API を強く意識したものになっています。 したがって共通化された拡張のコア API のみを使用して拡張を作成すれば、理屈上は Edge、Chrome、Firefox、Opera といったメジャー Web ブラウザーのどれでも動作する拡張が作成できることになります。(※) (※)ただし、前述の 3 社が提案するコア API の仕様は、ブラウザベンダーが独自の API を追加することは許容されているので、そういった特定のブラウザーだげに実装されている機能については動作しない可能性があります。また、共通の API であってもすべてのブラウザーのサポートが完了していない場合はこの限りではありません。   今回の記事では Microsoft Edge の相互運用性ということで、Edge と Google Chrome の両方で使用できる拡張を作成する方法について紹介します。   マニフェストファイルにおける必須スキーマの違い 拡張の情報を Web ブラウザーに登録するためのマニフェストファイルにはわずかですが Edge とChrome で必須とするスキーマの違いがあります。 具体的には、マニフェストファイルにおいて Edge で必須となるスキーマのキーは name と author…

0

Microsoft Edge 拡張の作り方:contentScripts 編

image1055.png
image1055.png

前回と前回と前回の記事に引き続き、Microsoft Edge の以下のアクションの拡張を作成する方法について紹介します。 ブラウザーアクション ページアクション コンテントスクリプツ (※Edge 拡張の概要と、コンテキストメニューの実装サンプルについてはこちらの記事をご覧ください。) 今回はコンテントスクリプツ の拡張について紹介します。 コンテントスクリプツ コンテントスクリプツの拡張は、マニフェストファイルに記載されたリストにあるパターンにマッチした URL に対し、コンテンツのスクリプトファイルをロードするようブラウザに指示します。 ユーザーがその機能を呼び出すための UI は持ちません。 スクリプトファイルと URL パターンの関連付けが JavaScript コードの記述なしでできるので、簡易的なホワイト/ブラックリストを管理する拡張などが作成できます。 以降、ソースを使用して説明を行います。   コンテントスクリプツの manifest.json コンテントスクリプツの manifest.json は以下のようになります。 manifest.json のキー “content_scripts” の内容に注目してください。 “matches” キーで拡張の機能を動作させる URL を、”js” で JavaScript ファイルを指定しています。   コンテンツスクリプツで呼び出される JS ファイル コンテンツスクリプツの拡張から呼び出される JS ファイル内のコードについて、特別な記述はとくに必要ありません。 一般的な Web コンテンツ上で使用される JavaScript 構文から拡張が提供する API を呼びだすことができます。 今回のサンプルでは、URL ごとに呼び出された…

0

Microsoft Edge 拡張の作り方:pageAction 編

image1029.png
image1029.png

前回の記事に引き続き、Microsoft Edge の以下のアクションの拡張を作成する方法について紹介します。 ブラウザーアクション ページアクション コンテントスクリプツ 今回はページアクションの拡張について紹介します。 (※Edge 拡張の概要と、コンテキストメニューの実装サンプルについてはこちらの記事をご覧ください。) ページアクション ページアクションの拡張は Web ブラウザーのアドレスバーに表示されるアイコンから機能を呼び出します。 アドレスバーの横にアイコンが表示されるという動作上、特定の URL のコンテンツに対しなにがしかの作業を行う用途に使用するのが良いでしょう。(もしくは、短縮 URL を生成するとか、でしょうか)   以降、ソースを使用して説明を行いますが、お手元で実際に動作させるには e-19.png という名前の 19 x 19 ピクセルのアイコン用の画像ファイルが必要です。 作成するのが面倒な方は以下の画像を保存して使用してください。   ページアクションの manifest.json ブラウザーアクションの manifest.json は以下のようになります。 manifest.json のキー “page_action” の内容に注目してください。 “default_icon” キーで、ツールバーに表示されるサイズのアイコンを、”default_title” でアイコン上に表示されるタイトルを指定しています。 このへんの指定は前回紹介したブラウザーアクションと一緒です。必要があればブラウザーアクションと同様に “default_popup” キーにポップアップとして使用する html ファイルを指定することもできます。 “background” キーの “scripts”  では、ブラウザーの背後で動作する JS ファイルを指定しています。 サンプルでは background.js という名前をファイルを指定していますが、名前は任意のものでもかまいません。 同 “background” キー内の…

0

Microsoft Edge 拡張の作り方:browserAction 編

image933.png
image933.png

前回の記事で Microsoft Edge の拡張の作り方を紹介してからずいぶん間があいてしまいましたが今回から数回に別けて続きをお送りします。 前回の記事では、サンプルとして Web コンテンツ上でマウスの右ボタンをクリックした際に表示されるコンテキストメニューに独自のメニューを追加する機能の作成方法について紹介しました。 今回からは、残りのその他のアクションで動作する拡張について、特徴と具体的な作り方を紹介していきます。 取り上げるアクションは以下のとおりです。 ブラウザーアクション ページアクション コンテントスクリプツ (※Edge 拡張の概要と、コンテキストメニューの実装サンプルについてはこちらの記事をご覧ください。) なお、今回から紹介するサンプルコードはすべて Google Chrome(2016年10月時点の最新のもの) でも動作します。   Edge 拡張を構成するファイル その前に、前回の記事で紹介したつもりになっていて実際にはぜんぜん書いていなかった Edge 拡張を構成するファイルについて紹介します。 Microsoft Edge の拡張を構成するファイルは manifest (json)、background page (html)、Content scripts (js)、UI pages (html) の 4 種類のファイルです。 ファイル 説明 Manifest (json) 定義ファイル(※必須)拡張の名前や説明、アクセス権や拡張が使用するファイルなどを指定 Background page (html) 拡張の機能をバックグラウンドで動作させるためのページ Content scripts (js) 拡張の機能を実装するための JS ファイル UI pages…

0

2016 11/1, 2 Microsoft TechSummit 開催

Tech_w708-h255_2.png
Tech_w708-h255_2.png

マイクロソフトの IT Pro 向けのイベント Microsoft Ignite の日本版 Microsoft TechSummit が 11 月の 1 日、2 日にヒルトンお台場で開催されます。     ただ今、早期割引実施中です。 お申込みはこちらから。 ちなみに私は IT Pro 向けのイベントにもかかわらず Edge 拡張の開発とデバッグ方法について、デモとサンプル山盛りのセッションをする予定です。 ご興味のある方はぜひともご参加くださいませ。  

0

Windows 10 Anniversary Update における Microsoft Edge の新機能

Windows 10 が公開されてちょうど一年、Windows 10 の無償アップグレード期間が終了したのと入れ替わるように本日 (2016/8/3 日本時間) Windows 10 Anniversary Update が公開されました。 この Windows 10 Anniversary Update では、Windows 10 が発表された際の様々なビジョンのいくつかが実装され、さらにその当時は想像だにできなかった  Windows Subsystem for Linux (WSL) といったようなまったく新しい機能も搭載されています。 Windows 10 から搭載された新しい Web ブラウザーである Edge にも、当初の計画にあった新しい拡張 (エクステンション)モデルの実装や、Windows フィードバック、Developer FeedBack (旧 Edge Suggestion Box) に寄せられたフィードバックや提案をもとにした新しい機能が実装されています。 今回の記事では Windows 10 Anniversary Update の新機能、とくにユーザーが直接対話するデスクトップ UI の新機能と、新しく追加された Edge 関連のグループポリシーの設定について紹介します。   Microsoft Edge のデスクトップ…

0