キーポイント
- バッテリーステータスAPI:デバイスのバッテリーレベルまたはステータス情報を提供し、バッテリーレベルが低いときに変更をより頻繁に節約し、データの損失を防ぎます。
- Web通知API:開発者がユーザーに通知する方法を正規化し、Webページのコンテキストの外でアラート(電子メール配信など)を発行できるようにします。ただし、異なるブラウザのディスプレイスタイルは異なる場合があります。
- 近接センサーAPI:オブジェクトとWebページを実行しているデバイスとの間の距離を検出します。現在はFirefoxでのみサポートされています。
- 振動API:デバイスを振動させ、ゲーム内の特定の効果をシミュレートするために使用できます。デバイスの方向APIは、デバイスの方向を検出します。これは、ナビゲーションアプリケーションとゲームを助長します。 「モバイルマーケットが成長している」や「モバイルデバイス(スマートフォンやタブレットなど)を介してネットワークにアクセスするユーザーなどのステートメントは、デスクトップやラップトップを介してネットワークにアクセスするものを超えています」は、もはや印象的ではありません。
今日、私たちは(少なくとも)ウェブ用に何かを開発するときにモバイル市場が重要であることを認識しています。
長年にわたり、ネイティブアプリケーションとWebアプリケーションに関する議論や意見は大きく異なり、どちらが優れているかは議論の余地があります。あなたの視点に関係なく、ネイティブモバイルアプリケーションが過去にWebページにアクセスできないハードウェアコンポーネントにアクセスできたことは事実です。しかし、このギャップは今日でも有効ですか? Webテクノロジーは、開発者として、HTML、CSS、およびJavaScriptのみを使用してエンコードできるように十分に開発されていますか?
この記事では、Webページがモバイルデバイスのハードウェアコンポーネントにアクセスするか、モバイルデバイス上のWebアプリケーションの機能を強化できるJavaScript APIを紹介します。
バッテリーステータスapi
バッテリーステータスAPIは、システムのバッテリーレベルまたはステータスに関する情報を提供します。このAPIを使用すると、バッテリーが充電されているかどうか、バッテリーが完全に排出されるまでの期間、または現在の容量のみを知ることができます。これらの詳細は、オブジェクトに属する4つのプロパティからアクセスできます。このAPIは、上記のプロパティが変更されたときにトリガーできるイベントも定義します。
このAPIは、たとえば、あなた(またはユーザー)がバスでWebアプリケーションを使用するのに苦労し、行った変更を保存するのを忘れている場合に役立ちます。突然、スマートフォンが消えてしまい、多くの時間とすべての作業を無駄にすることでイライラします。このAPIを使用すると、現在のバッテリー電源を検出し、バッテリーの電源が低いか不十分なときにデータの損失を防ぐために、より頻繁に変更を節約できるページを開発できます。 window.navigator.battery
この記事の執筆時点では、バッテリーステータスAPIはFirefoxによってのみサポートされていますが、以下に示すように、このAPIのサポートを検出するのは非常に簡単です。
if (window.navigator && window.navigator.battery) { // API 受支持 } else { // 不受支持 }
このAPIを試してみたい場合は、デモがあります。さらに調査したい場合は、ここでSitePointにバッテリーステータスAPIを導入しました。
Web通知api
モバイルデバイスでは、通知の概念と、デバイスの実装通知にインストールされている多くのアプリケーションに精通しています。ウェブ上では、Webサイトはさまざまな方法でそれらを実装します。 GoogleとTwitterについて考えてみてください。どちらも通知メカニズムを持っていますが、それらを異なる方法で実装しています。
Web通知APIは、この目的のために作成されたAPIであり、開発者がユーザーに通知する方法を正常化します。通知により、ユーザーは、電子メール配信など、Webページのコンテキスト以外のイベントをユーザーに思い出させることができます。開発者は同じように通知を作成しますが、仕様ではUIがそれらを表示する方法と場所を説明していません。これは、さまざまなブラウザにさまざまなスタイルが表示されることを意味します。たとえば、モバイルデバイスでは、通知バーに表示される場合があります。
Web通知APIは、window
オブジェクトのNotification
属性を介して公開されます。通知インスタンスを作成できるようにするコンストラクターです。新しい通知を作成するには、次のコードを書くことができます。
// 打印电池是否正在充电 console.log("电池" + (navigator.battery.charging ? "" : "未") + "充电");現在、Chrome、Firefox、およびSafariはこのAPIをサポートしています。 Web通知APIをサポートするモバイルブラウザには、Firefox、Android 4.4、およびBlackBerryが含まれます。奇妙なものを見たことがありますか? Chrome MobileはこのAPIをサポートしていません!悲しいが、それは本当だ。
このAPIをサポートするブラウザは、市場の半分以上をカバーしているため、JavaScriptコードがサポートされていないメソッドを呼び出そうとしないようにするため、サポートの状況をテストする必要があります。次のコードスニペットを使用してこれを行うことができます。
このAPIに興奮していますか?とても良い! Web通知APIで始まる記事で詳細を学ぶことができます。また、ライブデモを試すこともできます。
var notification = new Notification('收到电子邮件', { body: '您收到了一封电子邮件。立即阅读!' });近接センサーapi
近接センサーAPIは、オブジェクトとWebページを実行しているデバイス間の距離を検出するために使用できるJavaScript APIです。距離は、近接センサーによって測定されます(デバイスに近接センサーがある場合)。近接センサーAPIは属性やメソッドを提供するのではなく、オブジェクト上の2つのイベントのみをトリガーします。私たちは彼らの話を聞いて操作を実行することができます。最初のイベントは、デバイスと近くのオブジェクト間の実際の距離に関する情報を提供しますが、2番目のイベント
は、近くにオブジェクトがあるかどうかのみを指定します。
このAPIをサポートする唯一のブラウザは、バージョン15から始まるFirefox(デスクトップおよびモバイル)です。残念ながら、多くのラップトップやデスクトップには近接センサーがないため、主にモバイルデバイスをターゲットにしています。 window
このAPIのサポートの検出:deviceproximity
userproximity
Vibration APIは、デバイスを振動させる方法を含む非常にシンプルなAPIです。明らかな使用の1つは、10年前にいくつかのコンソールによって導入された効果を再現できるゲームでです。ただし、これはこのAPIの唯一の可能な目的ではありません。 私が言ったように、振動APIは Internet ExplorerとSafariとは別に、このAPIはすべての主要なブラウザによってサポートされています。それでも、今こそ、次のプロジェクトに使用するのに良い時期かもしれません。実際、それがサポートされている場合、ユーザーにより良いエクスペリエンスを提供します(この機能を悪用しない限り)。以下に示すように、検出サポートは非常に簡単です
私が議論したい最後のAPIは、デバイスの方向APIです。デバイスの向きを検出することは、ナビゲーションアプリケーションからゲームまで、さまざまな状況に役立ちます。このAPIは、デバイスの物理的な向きと動きに関する情報を提供するいくつかのイベントを定義します。このAPIはW3Cワーキングドラフトです。つまり、仕様は不安定であり、将来のいくつかの変更が予想される場合があります。
APIは、次の3つのイベントを公開します: 、
または:
このAPIを使用する場合は、使用できるデモがあります。あなたがそれを学びたいなら、私たちは「HTML5でデバイスの向きを使用する」という記事を持っています。 結論 これらのAPIのユースケースは無限であり、それはすべてあなたの想像力と開発中のアプリケーションまたはウェブサイトの種類に依存します。この投稿を楽しんでいただければ幸いです。他に便利なAPIがどうなるか教えてください。 モバイルWeb javaScript API JavaScript API(アプリケーションプログラミングインターフェイス)は、異なるソフトウェアアプリケーションが相互に通信できるようにする一連のルールとプロトコルです。モバイルWebページがデバイスハードウェアやその他のソフトウェアアプリケーションと対話できるようにすることにより、モバイルWebページを強化し、機能とユーザーエクスペリエンスを向上させます。たとえば、JavaScript APIは、Webページがデバイスのカメラ、地理的位置、さらにはバッテリーステータスにアクセスできるようにすることができます。これにより、開発者が対話、エンゲージ、ユーザーフレンドリーなモバイルWebページがより多くの可能性を生み出します。 Geolocation APIは、デバイスのジオロケーションにアクセスできる強力なツールです。それを使用するには、最初にユーザーのブラウザがサポートしているかどうかを確認する必要があります。これは、 バッテリーステータスAPIホストデバイスのバッテリーステータスに関する情報を提供します。これは、デバイスのバッテリーレベルに基づいてWebページのパフォーマンスを最適化するのに非常に役立ちます。たとえば、バッテリーが低い場合、更新頻度を下げたり、特定の機能を無効にして電源を節約できます。このAPIを使用するには、バッテリーマネージャーオブジェクトに解決する約束を返す 振動APIを使用すると、ホストデバイスの振動メカニズムを制御できます。これは、ユーザーに触覚フィードバックを提供するのに非常に役立ちます。このAPIを使用するには、 周囲光センサーAPIは、デバイスの周囲光レベルに関する情報を提供します。これは、さまざまな照明条件下で読みやすさを向上させるために、Webページの明るさまたはコントラストを調整するのに役立ちます。このAPIを使用するには、新しい ネットワーク情報APIは、デバイスのネットワーク接続に関する情報を提供します。これは、ネットワークステータスに基づいてWebページのパフォーマンスを最適化するのに非常に役立ちます。たとえば、ネットワーク接続が遅い場合、画像やビデオの品質を低下させて、スムーズな読み込みを確保できます。このAPIを使用するには、ネットワークインフォメーションオブジェクトを返す デバイスの方向APIは、デバイスの物理的な向きに関する情報を提供します。これは、デバイスの動きに対応するインタラクティブなエクスペリエンスを作成するのに非常に役立ちます。このAPIを使用するには、デバイスの向きが変更されたときに発火するイベントリスナー ページの可視性APIを使用すると、Webページが表示または非表示になったときに検出できます。これは、ページの可視性に基づいてアクティビティを一時停止または再開するのに役立ちます。たとえば、ユーザーが別のタブに切り替えると、ビデオを一時停止し、戻ってきたときにビデオを再開できます。このAPIを使用するには、 フルスクリーンAPIを使用すると、フルスクリーンモードで要素を表示できます。これは、ビデオやゲームなどに没入感のある体験を提供するのに非常に役立ちます。このAPIを使用するには、任意の要素に対して Web通知APIを使用すると、ユーザーに通知を表示できます。これは、ページに焦点が合っていなくても、ユーザーに重要なイベントを思い出させるのに非常に便利です。このAPIを使用するには、最初にif ('Notification' in window) {
// API 受支持
} else {
// 不受支持
}
vibrate()
と呼ばれるメソッドのみを公開します。後者は、最も単純な形式でwindow.navigator
オブジェクトに属し、デバイスが振動するミリ秒数を指定する整数を受け入れます。 if (window.navigator && window.navigator.battery) {
// API 受支持
} else {
// 不受支持
}
このAPIの詳細については、「HTML5 Vibration APIの使用方法」という記事を読んで、デモを試すことを忘れないでください。 // 打印电池是否正在充电
console.log("电池" + (navigator.battery.charging ? "" : "未") + "充电");
デバイスの方向API
deviceorientation
ほとんどすべての主要なブラウザ(SAFARIを除く)はこのAPIをサポートしていますが、サポートは部分的であるか、矛盾があります。たとえば、執筆時点では、devicemotion
イベントをサポートするブラウザはほとんどありません。したがって、私の提案は、各イベントをテストしてサポートされているかどうかを確認することです。 compassneedscalibration
イベントの存在をテストするには、次のように書くことができます。
compassneedscalibration
deviceorientation
var notification = new Notification('收到电子邮件', {
body: '您收到了一封电子邮件。立即阅读!'
});
イベントをテストしたい場合は、次のことを記述できます。
if ('Notification' in window) {
// API 受支持
} else {
// 不受支持
}
devicemotion
if ('ondeviceproximity' in window) {
// API 受支持
} else {
// 不受支持
}
JavaScript APIとは何ですか?モバイルWebページをどのように強化しますか?
モバイルページでジオロケーションAPIを使用する方法は?
navigator.geolocation
プロパティを使用して実行できます。 true
を返す場合は、getCurrentPosition()
メソッドを使用してユーザーの現在の場所を取得できます。ユーザーの位置データにアクセスする前に、常にユーザーの許可を取得することを忘れないでください。 バッテリーステータスAPIとの使用方法は何ですか?
navigator.getBattery()
メソッドを使用できます。 モバイルWebページでVibration APIを使用する方法は?
navigator.vibrate()
メソッドを使用できます。単一の値を渡して特定の時間を振動させるか、一連の値を渡して振動を作成してモードを一時停止できます。 周囲の光センサーAPIとの使用方法は何ですか?
AmbientLightSensor
オブジェクトインスタンスを作成してから、start()
メソッドを使用して光レベルの検知を開始する必要があります。 モバイルWebページでWeb情報APIを使用する方法は?
navigator.connection
プロパティを使用できます。 デバイスの向きAPIとの使用方法は何ですか?
deviceorientation
イベントを追加できます。 モバイルWebページでページVivisibilityAPIを使用する方法は?
document.visibilityState
属性とvisibilitychange
イベントを使用できます。 フルスクリーンAPIとの使用方法は何ですか?
requestFullscreen()
メソッドを使用して、フル画面に表示することができます。 モバイルページでWeb通知APIを使用する方法は?
Notification.requestPermission()
メソッドを使用してユーザーの許可を要求する必要があります。ユーザーが許可を付与する場合は、新しい通知オブジェクトを作成して通知を表示できます。
以上が5 JavaScript APIは、モバイルWebページを強化しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

JavaScriptは、Webサイト、モバイルアプリケーション、デスクトップアプリケーション、サーバー側のプログラミングで広く使用されています。 1)Webサイト開発では、JavaScriptはHTMLおよびCSSと一緒にDOMを運用して、JQueryやReactなどのフレームワークをサポートします。 2)ReactNativeおよびIonicを通じて、JavaScriptはクロスプラットフォームモバイルアプリケーションを開発するために使用されます。 3)電子フレームワークにより、JavaScriptはデスクトップアプリケーションを構築できます。 4)node.jsを使用すると、JavaScriptがサーバー側で実行され、高い並行リクエストをサポートします。

Pythonはデータサイエンスと自動化により適していますが、JavaScriptはフロントエンドとフルスタックの開発により適しています。 1. Pythonは、データ処理とモデリングのためにNumpyやPandasなどのライブラリを使用して、データサイエンスと機械学習でうまく機能します。 2。Pythonは、自動化とスクリプトにおいて簡潔で効率的です。 3. JavaScriptはフロントエンド開発に不可欠であり、動的なWebページと単一ページアプリケーションの構築に使用されます。 4. JavaScriptは、node.jsを通じてバックエンド開発において役割を果たし、フルスタック開発をサポートします。

CとCは、主に通訳者とJITコンパイラを実装するために使用されるJavaScriptエンジンで重要な役割を果たします。 1)cは、JavaScriptソースコードを解析し、抽象的な構文ツリーを生成するために使用されます。 2)Cは、Bytecodeの生成と実行を担当します。 3)Cは、JITコンパイラを実装し、実行時にホットスポットコードを最適化およびコンパイルし、JavaScriptの実行効率を大幅に改善します。

現実世界でのJavaScriptのアプリケーションには、フロントエンドとバックエンドの開発が含まれます。 1)DOM操作とイベント処理を含むTODOリストアプリケーションを構築して、フロントエンドアプリケーションを表示します。 2)node.jsを介してRestfulapiを構築し、バックエンドアプリケーションをデモンストレーションします。

Web開発におけるJavaScriptの主な用途には、クライアントの相互作用、フォーム検証、非同期通信が含まれます。 1)DOM操作による動的なコンテンツの更新とユーザーインタラクション。 2)ユーザーエクスペリエンスを改善するためにデータを提出する前に、クライアントの検証が実行されます。 3)サーバーとのリフレッシュレス通信は、AJAXテクノロジーを通じて達成されます。

JavaScriptエンジンが内部的にどのように機能するかを理解することは、開発者にとってより効率的なコードの作成とパフォーマンスのボトルネックと最適化戦略の理解に役立つためです。 1)エンジンのワークフローには、3つの段階が含まれます。解析、コンパイル、実行。 2)実行プロセス中、エンジンはインラインキャッシュや非表示クラスなどの動的最適化を実行します。 3)ベストプラクティスには、グローバル変数の避け、ループの最適化、constとletsの使用、閉鎖の過度の使用の回避が含まれます。

Pythonは、スムーズな学習曲線と簡潔な構文を備えた初心者により適しています。 JavaScriptは、急な学習曲線と柔軟な構文を備えたフロントエンド開発に適しています。 1。Python構文は直感的で、データサイエンスやバックエンド開発に適しています。 2。JavaScriptは柔軟で、フロントエンドおよびサーバー側のプログラミングで広く使用されています。

PythonとJavaScriptには、コミュニティ、ライブラリ、リソースの観点から、独自の利点と短所があります。 1)Pythonコミュニティはフレンドリーで初心者に適していますが、フロントエンドの開発リソースはJavaScriptほど豊富ではありません。 2)Pythonはデータサイエンスおよび機械学習ライブラリで強力ですが、JavaScriptはフロントエンド開発ライブラリとフレームワークで優れています。 3)どちらも豊富な学習リソースを持っていますが、Pythonは公式文書から始めるのに適していますが、JavaScriptはMDNWebDocsにより優れています。選択は、プロジェクトのニーズと個人的な関心に基づいている必要があります。


ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

AtomエディタMac版ダウンロード
最も人気のあるオープンソースエディター

SublimeText3 英語版
推奨: Win バージョン、コードプロンプトをサポート!

mPDF
mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。

DVWA
Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、

MinGW - Minimalist GNU for Windows
このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。
