ユーザースクリプト：クロスブラウザー、クロスドメイン

HabrAjaxユーザースクリプトの開発は、新しい機能のクロスブラウザーサポートに関する次の問題を克服し、主にユーザースクリプトとそれらのクロスドメインアクセスに関連するさまざまな問題に関する一連の記事（未公開の7ピース）を作成しました。 これらの記事はすべて自明ではなく、インターネット上ではトピックの一部がカバーされており、一部はブラウザーのバグの説明でさえカバーされていません（または著者は外国語のソリューションを知りません）。 記事は任意の順序でレイアウトする必要があります。記事を整理する理由はないため、記事はトピックごとにのみ関連しています。 ここで、リンクなしで記事の発表を行い、今後議論される内容のアイデアを追加します。 実装はHabrAjaxで行われますが、そこには非常に多くのアプリケーションコードがあり、実証する良い例ではありません。 したがって、各記事には、可能な限りより適応された例のコードがあります。

クロスブラウザー修正のアイデア

ユーザー向けの開発者は、ユーザースクリプト（またはアドオン）を簡単に操作できるように、インストールを最大限容易にすることを望んでいます。ファイルを取り、ワンクリックでインストールします。 さらに良いことに、ブラウザ間の違いはすべて単一の共有ファイルに含める必要があります。 アドオン（クロスブラウザ以外）はまさにそれを行います-ユーザーは「インストール」と言うだけでよいのです-そして、彼はあまり難なく自分が望むものを手に入れます。 したがって、アドオンは非常に人気がありますが、一般的なユーザースクリプトからアドオンを生成するには、かなり複雑なリンカーを作成する必要があります。



ユーザースクリプトの場合、レイアウトの違いを克服し、インストール機能を考慮するために、多くの場合、ブラウザ依存のコードを記述する必要があります。 それでも、インストールの機能の違いを自動的に考慮に入れるユーザースクリプトを作成するための呼び出しを簡単にするという考えです。 最初に対処する必要があるのは、ブラウザのスクリプトインストール機能とメタデータの理解です。 クロスドメイン相互作用は多くの心配を追加します。 異なるブラウザーでユーザースクリプトを操作する場合、クロスサイトデータ交換中にブラウザーのバグがいくつか表示されます。



通常受け入れられるように、データ交換の要件はそれほど制限されません。 通常（Operaの場合）彼らは、別のドメインのスクリプトに関数を書くことができると信じており、全体のタスクは組み込みスクリプトで関数を実行することです。 多くの場合、外部ドメインのデータを変更することはできません。それらを取得することが私たちのタスクです。 データを取得する必要があります：

1）任意のテキスト。JSスクリプトによってフレーム化され、JSファイルとして転送できます（ユーザースクリプトにパックするため）。

2）一般に、他のファイルからの任意のテキストデータ。何もフレーム化することができません。

3）JSONハッシュ-別のドメイン内。



最初のケースは、スクリプト自体のユーザースクリプトメタデータを読み取る必要がある場合、またはJS文字列にエンコードせずにCSSスタイルを記述したい場合に発生します。 クロスドメインはまだありませんが、単一のクロスブラウザビューを取得したい場合、タスクは完全に簡単ではありません（一般的に、解決できません-Firefoxには機能がなく、GreaseMonkeyで導入された「xml」タイプはJS言語と構文的に互換性がありません-言い換えれば、エイリアンタイプは決して実行できませんクロスブラウザ）。 GreaseMonkeyの代わりにメタデータとScriptishの場合のクロスブラウザービュー、またはJSの機能を超えてFirefoxブラウザー用に2文字のファイルを微調整する必要があるというハーフソリューションを取得すると、メタデータだけでなく* .user.jsファイルの任意のデータも読み込まれます。 これはもちろん悪いことですが、そのようなことはユーザースクリプトの互換性の現実です。 問題と可能な解決策は、記事「 JSでの複数行データの読み取り 」で詳しく説明されています。 それはユーザースクリプトを超えていますが、ユーザースクリプトの中では、解決の本当のチャンスがあります。



データとスクリプトを1つのスクリプトファイル（ユーザースクリプトまたは単純なスクリプト）にパックしようとすると、これらの解決できない問題が発生することに注意してください。 2つのファイルを使用する場合は、2番目のファイルのデータをテキストまたはHTML（HTMLコメント内のほぼ任意のテキストを保持）として読み取り、最初のファイルのみスクリプトを読み取ることができるため、もう問題はありません。 ただし、単一ファイルのソリューションは、ユーザーとの共同作業に適した方法です。ユーザーには1つのファイルが提供されます。このファイルは「インストール」するだけで済みます。 確かに、Chromeだけがユーザースクリプトをネイティブにインストールできるような些細なことについては少し忘れています。 Firefoxの場合、GreaseMonkeyまたはScriptishアドオンが必要です。Operaの場合、ブラウザー設定でサイトの設定を指定する必要があります （つまり、新しいコンピューターの場合、「ファイルをインストールする」だけでなく、一連のアクションで新しい心配があります）。 彼女は、GreaseMonkeyのような非常に原始的な状態のアドオンを持っています。スクリプトをアドオンの入力フィールドにコピーする必要があります。メタデータは考慮されないため、言及しません。 最後に、Safariにはアドオン（NinjaKit）も必要であり、ユーザースクリプトファイルの本文をアドオンエディターにコピーします。 つまり、単一ファイル+ブラウザー間の互換性は既に非常に緊密です。



データ交換の2番目と3番目のケースは、開発者がアクセスできない外部ドメインのドメインにユーザースクリプトを導入することで解決されます。 ここでは、4つのブラウザーのうち2つにあるバグによってソリューションが複雑になります。記事「 ユーザースクリプトでのドメイン間交換のChromiumバグのバイパス 」、「 Operaでのユーザースクリプトでのドメイン間データ交換 」は、それらを克服できることを示しています。

Operaのユーザースクリプトの代わりのアドオン

私たちは、ユーザーだけが元気だったら何にも止まらないと警告しましたか？ 警告した。 彼らは何をしましたか？ 自動化の可能性のない多くの設定。 これで、私たちは最も困難にさらされる道徳的権利を得ることができました。Operaのアドオンを生成し、ユーザースクリプトを置き換えるためのアルゴリズムを考え出すことができます。 アドオンの作成を自動化することは可能ですが、Operaに組み込まれたユーザースクリプトの作成は自動化できないためです。 必要なソリューションは、単一の「インストール」ボタンとOperaウェブサイト上の場所で入手できます。 方法-記事「 ユーザースクリプトからのOperaアドオン 」。



ところで、Safariについても同じです。 NinjaKit-GreaseMonkeyの機能に近いアドオンですが、何らかの理由でスクリプトテキストを手動でコピーする必要があり、クロスドメインリクエストGM_XMLHTTPRequestを完全にサポートしていません。 これはなんとなく軽薄です。 これがサポートされるかどうかは不明です。 また、ユーザースクリプトアイコンの問題を同時に解決することにより、アドオンを実行しやすくなります。通常はFirefoxで解決され、他のどこでも解決されません（アドオンを除く）。 アイコンメタデータディレクティブがサポートされ、スクリプトリストのアイコンはFirefoxでのみ機能します。 すべてのルールの最高保有者の目には開発者の肩書きを取得するための小さなクエストが必要なので、すべては「 ユーザースクリプトからSafariのアドオン 」の記事で説明されています 。

クロスブラウザーアドオン

OperaとSafariと私は、ユーザースクリプトとコードが大きく異なる（組み立てが難しいという意味ではなく、バイトの強い違いがある）独自のアドオンを作成する必要があるため、すべてのブラウザのすべてのアドオンは一般的な原則に従って構築されています-拡張子と非常に類似した機能を持つ多数のファイルを特徴とするzipアーカイブ。 しかし、拡張機能を書き換えるだけで十分な一般的なクロスブラウザアーカイブを作成できますか？ ファイル名に競合がない場合、作業は実行可能です。4つの華やかなトラックが再び1つにマージされ、実装機能は冗長なブラウザ依存設定を含む単一のアーカイブに耐えます。 拡張機能の名前を手動で変更することにより、アーカイブコレクターが再び簡素化されます。

ユーザースクリプトで他の人の庭に入る

クロスドメインメタデータリクエストはそれほど悪くはありません。 2つのブラウザーで簡単に解決できますが、Operaでは困難です。 しかし、サードパーティのサイトのフレームからクロスドメインのデータ交換を提供する完全な不幸に慣れれば、Operaでの決定は簡単に思えます。 メタデータの読み取りは特別な場合であり、Operaの同じ交換手法を使用した子供の楽しみになります（残念ながら、BeforeScriptを使用したユーザースクリプトには何らかのバグがあります）。 「完全な不幸」の解決方法については、記事「 ユーザースクリプトでのクロスドメイン交換のためのChromiumバグのバイパス 」と、「 Google Plusボタンのコンパクトサイズ 」の記事を参照してください。 」 そして実際、ほとんどの場合24ピクセルで「いいね」の数の1-2-3桁で十分なのに、「いいね」の数に関するデータが不足しているため、水平に70ピクセルを費やすのはなぜですか？ ページのデザインに「話す」+1ボタンが必要なのはなぜですか？ ユーザースクリプトは、これらすべての問題を解決します。インストールするのはユーザー次第です。 Operaのスペクターは再び上昇し、設定に関する大量の指示に怖がっています-まったく、以前の記事でアドオンにスクリプトをパックする方法を学んだことは何もありません。



これは、最新バージョンで作成されたユーザースクリプトへの最も壮観な追加です。 Google+ボタンは、ユーザースクリプトのために非常にコンパクトです。

（図1） （ I-pictures 、 imageshack ）



記事は通常準備ができています。 HabrAjaxスクリプト自体を除き、これらすべての問題が表面化したことに基づいて、テストケースは作成されていません。 したがって、それらはすべての補助資料の準備が整ったことに気づき、来週または2週間で公開されます。 たとえば、Chromiumバグの回避策を説明するために使用できる、最もコンパクトでクリーンなユーザースクリプトを追加したいと思います（2.5年あります。一部はそれを「セキュリティ機能」と見なします）。

しかし、HabrAjaxについてはどうでしょうか。

要するに、彼はバージョン0.81で次の機能を獲得しました。

* 個人ページへの直接リンクは、2〜3回クリックするのではなく、1回でアクセスできます。



（図2）



* スクリプトの更新を確認する -定期的に、1日に1回（期間が設定されている）スクリプトを確認します。 バージョンがマイナーである場合は気にしません。 （クロスドメインテクノロジー）



（図3）



* メタデータの機能を表示 -検証中にサーバー上に新しいものと同様に、新しいものが登場したことを示唆します。 （クロスドメインテクノロジー）



（図4）



* メタデータ内のスタイリッシュなアイコン （非常にクール） （右上にあります）。

*チェックボックスの周りのこれらのフレームは、最新の変更された機能を連想させます。

* カスタマイズ可能な最大 強制切断された写真の高さ （デフォルトはZenCommentで120）。 注釈の高さ（最大）は2倍です。

* 引用または作者の名前を強調して手紙を書きます-それらを手動でコピーする必要はありません（「引用修正」設定によって有効にされます）。

* メールプレビューボタン。

* コンパクトなGoogle Plusボタン （クロスドメインテクノロジー）

* ZenCommentスタイルの小さな変更-そのバージョン（2.16）もHabrAjaxに組み込まれています。 スクリプトを使用すると便利ですが、スタイルとスクリプトが独立するようにすべてが行われています。 必要な（必然的に最低限必要な）スタイルはスクリプトで記述され、多くの（250）行を占めます。



はい、そしてスクリプトについて-既にそれを使用している人のために-調査に参加してください-「 どのブラウザでHabrAjaxスクリプトを使用しますか？ 」（複数の選択肢が可能です）。 スクリプトが動作するブラウザとOSの画像を確認すると役立ちます。 2つの異なるコンピューターがある場合-投票で2票を投票します（異なる場所から）。 Firefoxのアドオンも重要です-メタデータディレクティブのクロスブラウザの複数行テキストを作成できるため、より柔軟なアドオンはScriptishであることが判明しました（記事「 JSでの複数行データの読み取り 」で説明します）。



UPD 18:30：ユーザー名の周りのリンクが正しくない強迫観念のバグを修正。 Opera、Fx、Chromeでテスト済み。 （オペラはDOMを読むのに最も影響を受けやすいことが判明しました。ユーザーの未登録のバグを示しました。）ダウンロードを管理した人を更新してください。 同時に、メタデータの読み取りと新しいバージョンで行われたことの表示に関する作業が表示されます（[更新の確認 ]リンクをクリックした場合）。

UPD2：ただし、多くのChromeユーザーがアンケートを表示し始めています。