2019年7月30日(2019/06現在、個人的な感想としては実戦投入はまだ早い印象でした)Webアプリにシェア機能を付けたい時があります。OSネイティブAPIを呼べないWebアプリではsharer.jsやremoteStorage.jsを使ってゴリゴリJSを書いたりしますが、正直開発コストが掛かるし、仕様変更に追従してくれるか不安もあります。1」はOSネイティブのシェア機能をブラウザから呼び出すことが出来るW3Cで提案されているブラウザ標準機能。1https://wicg.github.io/web-share/近い将来、ライブラリを使わなくてもnavigator.share()を呼び出すだけでOSネイティブのSNS選択ダイアログが出せるようになります。APIのメリットネイティブのシェア機能を使うのでインストールされているアプリのみをシェア先として候補に出すことが出来る。使ってないSNSまで候補に出す必要が無いので製造コストが下がる。SNSログインする為のOAuth2ログイン画面を出す必要がない。Level1ではテキストやURLをSNS共有することが出来ます。Level1は既にモバイル版safari、chromeで実装済み。etchttps://caniuse.com/#search=web%20share%20apiLevel2が実装されるとファイルも共有出来るようになります。75でLevel2が実装されました。75でファイル共有を試してみます。ブラウザからカメラを起動し、撮影した画像をGoogleドライブにアップロードする一枚っぺらのindex.html。onchange="share(this.files[0])"></input></body></html>Node.jsのhttp-serverコマンドでHTTPサーバを立ち上げ、AndroidのChrome75から上記のindex.htmlにアクセスします。navigator.share()はHTTPS環境化でないと動かない為、ngrokを経由させ、HTTPSにして動作を確認します。ngrokが初見の場合は以下の記事をご覧ください。Thingngrokで手軽にHTTPS検証環境を構築https://one-it-thing.com/1680はじめにHTTPSじゃないと動かないブラウザ機能をローカル開発環境でちょっと試したいHTTPS化したApacheやNginxは有るけどリバースプロキシ設定するのは面倒。Webシステム開発をしているとこんなことありますよね。そんな時はngrokを使うとHTTPサーバを簡単にHTTPSに...動作確認カメラ撮影するとシェアダイアログが表示されます。Googleドライブを選び、アップロードが出来ました。次にPDFをアップロードしようとしたところ、DOMExceptionが発生してアップロード出来ません。現時点ではシェア出来るファイルの種類が限られているようです。マルチメディアファイルしかまだシェア出来ないとのことです。https://docs.google.com/document/d/1tKPkHA5nnJtmh2TgqWmGSREUzXgMUFDL6yMdVZHqUsg/edit使用して分かったことHTTPS環境下でないと使えない。(navigator.share()が居ない)対応している画像でも結構な頻度でDOMExceptionが発生してシェア出来ない。ファイルシェアの場合は「ファイルをシェア出来るアプリ」のみシェア先ダイアログに表示される。Drive、Dropbox、LINEとか)シェアするファイル名をプログラムから設定できない。(share19283759191.jpgとかになってしまう)シェア出来るファイルに制限がある。拡張子を変えてもMimeタイプチェックが走るのかDOMExceptionが発生する。他ブラウザの仕様実装が追いつくまで待っても遅くない現状ではPDFやOfficeファイルのようなビジネスユースのファイルはアップロード出来ないことが分かりました。2実装と併せて期待したいところです。ファイル名はLevel1では決められる(Fileオブジェクトを使わずにテキスト内容をtext/plainで指定してアップロードする場合)のでLevel2もその内そうなるんじゃないか、というかそうして欲しい、と願っています。sharer.js、remoteStorage.jsでゴリゴリJSを書かなくてもファイルをSNSシェア出来る時代が早く来てほしいです。API執筆者:sin7k24関連記事ionic3(SPA)のServiceWorkerライブラリをsw-toolboxからWorkboxに切り替える昨今は閲覧速度向上やオフラインでも使える利便性が求められ、Webアプリ開発とPWAはセットで考えられるようになってきましたね。ネットを探すとUA文字列を解析してブラウザ判定をするコードが一杯出てきます。一年後には丸一日掛かっても終わらなくなり、仕事終わりにかけて行ったフルスキャンが翌日まだ頑張っている。PayのWeb決済を開発する為にSandboxテスターを作ってiPhoneに設定2020/01/10Android版ChromiumをVirtualBoxにインストールしたUbuntuでビルドしてみるプロフィールshingo.7k24東京在勤、職歴20年越え中年ITエンジニアです。開発現場で頑張っています。19歳(1996年)から書き始めた個人日記が5,000日を超え、残りの人生は発信をして行きたいと思い、令和元日からこのサイトを開始しました。勉強と試行錯誤をしながら、自分が経験したIT関連情報を投稿しています。私と同じく、今後IT業界で生計を立てて行きたいと考えている方や、技術共有したいけどフリーランスで孤独、といった方と一緒に成長、知識共有して行けたら楽しいな、と思っています。