GoLocal!
ダッシュボードを開く
Bubble 開発者ガイド無料のランタイム 4.1.23

GoLocal Query による安全な多言語検索

メインの GoLocal 要素、オプションの GoLocal Query 要素、Bubble の自動検索コントロール、および変換されたインターフェイスをデータベース ロジックから分離する最も安全な方法についての初心者向けガイド。

核となるコンセプト

Bubble アプリには通常、 正規言語 ここで、データベース ラベル、Option Set 表示値、およびハードコーディングされたテキスト条件が作成されました。 GoLocal はこれらの値を別の言語で表示する場合がありますが、Bubble ロジックでは正規の値を期待できます。

Project ソース

英語

保存されたカテゴリ: ニュース

訪問者が見る

フランス語

表示ラベル: Actualités

Bubble 検索

ニュース

正規化されたソース値

安全規則: 表示される入力は、ユーザー側および保存側の値のままです。別個の normalized_query Bubble がソース言語テキストを明示的に必要とする場合にのみ使用されます。

どの GoLocal 要素を使用すればよいですか?

プラグインには、2 つの異なる非ビジュアル Bubble 要素が含まれています。彼らはさまざまな問題を解決します。ほとんどのページにはメインが必要です GoLocal! 要素;特定のテキスト検索の問題があるページのみが必要です GoLocal Query.

プラグインの可用性: 別個の GoLocal Query 要素は Free/API-key Bubble プラグインに含まれており、アクティブな GoLocal SaaS プロジェクトで動作します。

必須の翻訳者

GoLocal!

これがメインの翻訳エンジンです。プロジェクトを読み込み、ページ コンテンツを翻訳し、言語ウィジェットを表示し、現在の言語イベントと翻訳イベントを公開します。

  • 通常、1 つのインスタンスを再利用可能なヘッダーまたはページで共有される別の要素に配置します。
  • そのフィールドは、API キー、ウィジェット、除外される ID/セレクター、およびソース/ターゲットの動作に使用します。
  • Bubble が選択された言語または翻訳ステータスを知る必要がある場合は、その状態とイベントを使用します。

オプションのロジックヘルパー

GoLocal Query

これではページは翻訳されず、ウィジェットも表示されません。訪問者が入力した 1 つの検索フレーズを、Bubble ロジックのアプリの正規のソース言語フレーズに変換します。

  • 通常の入力で、プロジェクトのソース言語で保存されたテキストを検索または比較する必要がある場合にのみ追加します。
  • 独立した検索入力ごとに 1 つのクエリ要素を使用します。
  • ユーザーが作成した名前、タイトル、説明、またはメッセージを保存するために normalized_query を使用しないでください。
Bubble 要素またはタスク何を使うか
テキスト、ボタン、グループ、再利用可能な UIGoLocal!のみ
ユーザーデータを保存する入力元の入力値
英語のテキストフィールドをフィルタリングするプレーン入力GoLocal Query 1 つ
Bubble SearchBox またはドロップダウン自動
レガシーまたは Select2 MultiDropdown自動
複数行入力、Quill、contenteditable元のエディターの値
繰り返しグループ制約物/Option Set/ID先頭
メールアドレス、電話番号、パスワード、番号、日付、ID、ファイル元の値
シンプルな決定: 値が表示されている場合は、メインのトランスレータを使用してください。値を保存する場合は、元の Bubble 値を使用します。翻訳された語句をソース言語のテキストと照合する必要がある場合は、サポートされている自動コントロールまたは 1 つの専用の GoLocal Query 要素を使用します。

推奨される Bubble アーキテクチャ

可能な限り、翻訳された表示テキストではなく、Bubble Things、Option Set オプション、一意の ID、または安定したコードに基づいて条件を構築します。翻訳は、記録のアイデンティティではなく、人が見るものを変える必要があります。

最良の方法: オブジェクトを比較する

Current cell's Article's Category
is Category News

訪問者には「Actualités」が表示される場合がありますが、Bubble は、Category Thing または Option Set オプション自体を比較します。

テキストの一致にのみクエリを使用する

Category name contains
GoLocal Query Categories's normalized_query

これは、データベースまたは既存の条件が正規の英語テキストを純粋に検索する場合に適しています。

カテゴリセットの例

正規英語フランス語表示
ニュース現実
意見意見
チュートリアルチュートリアル
ガイドガイド
レビューエイビス
歴史歴史
その他オートル

自動逆引き検索

無料のランタイム 4.1.23 既存の値の選択または検索を目的とする Bubble コントロールにのみ逆引き参照を自動的に適用します。

Bubble SearchBox
Bubble ドロップダウン
レガシー Bubble MultiDropdown
現在の Select2 MultiDropdown

訪問者のタイプ: 現実

コントロールの一致: ニュース

訪問者は引き続き次の情報を表示します。 現実

サポートされている各コントロールには、同じページ上の複数のコントロールを含む、分離された反転状態があります。この組み込み動作を複製するためだけに GoLocal Query 要素を追加しないでください。

Bubble SearchBox

訪問者が既存の Bubble Thing を検索して選択するときに使用します。 GoLocal は、翻訳されたフレーズが SearchBox で使用される正規のテキストと一致するように支援します。

Bubble ドロップダウン

既存の静的または動的リストからの単一の選択に使用します。選択したオプションは実際の Bubble 値のままです。

レガシー Bubble MultiDropdown

古い Bubble アプリでいくつかの既存のオプションを選択するために使用します。各コントロールは個別に正規化されます。

Select2 MultiDropdown

現在検索可能な複数選択コントロールに使用します。入力された検索テキストは、通常の入力を変更せずに、ソース言語のオプション ラベルと一致します。

プレーンな Bubble 入力は意図的に自動ではありません。 プラグインは、入力が検索ボックス、人の名前、データベースのタイトル、条件値、または保存されるテキストであるかどうかを安全に推測できません。ダウンストリーム ロジックが正規テキストを必要とする特定の入力に対してのみ、GoLocal Query を追加します。

GoLocal Queryの使用

非視覚的なものを使用する GoLocal Query 通常の Bubble 入力が意図的にテキスト検索、ソース言語の条件、またはバックエンド/API フィルターを駆動する場合の要素。

1

この入力にクエリ要素を 1 つ追加します

これをページ上、または入力を所有する再利用可能な要素に 1 回配置します。すべての繰り返しグループ セルに配置しないでください。

Element name: GoLocal Query Categories
2

クエリフィールドをバインドする

Query = Input Category Search's value
Enabled = yes
Debounce (ms) = 180

Bubble は、動的な入力値が変更されると要素を自動的に更新します。入力変更ワークフローは必要ありません。

3

normalized_query はソース言語ロジックでのみ使用してください

GoLocal Query Categories's normalized_query

この値は、繰り返しグループ制約、詳細フィルター、テキスト条件、または英語を想定する API パラメーターで使用します。

4

保存と検証を入力に接続したままにする

Save Category Name = Input Category Search's value

通常の保存値、電子メール チェック、数値計算、または必須フィールド チェックを normalized_query に置き換えないでください。

訪問者が入力している間は何が起こりますか?

  1. 1入力が変化する: Bubble は、正確な現在の入力値をクエリ フィールドに渡します。
  2. 2デバウンスは少しの間待機します: デフォルトの 180 ミリ秒では、単一のキーストロークごとのリクエストが防止されます。
  3. 3最新のフレーズが正規化されます: たとえば、「Actualités」は「News」に解決されます。古い未完了のリクエストは最新の結果を上書きできません。
  4. 4Bubble は状態を受け取ります: normalized_query は「ニュース」になり、is_normalizing は no になり、正規化されたイベントが発生します。
  5. 5意図したロジックのみがそれを消費します: 繰り返しグループ、条件付き、または API フィルターは normalized_query を使用します。保存では引き続き元の入力が使用されます。

実用的な Bubble の例

繰り返しグループ

フランス語入力から英語の記事カテゴリを検索する

訪問者のタイプ 現実。データベースストア ニュース。繰り返しグループのカテゴリ名制約を次のように設定します。

GoLocal Query Categories's normalized_query

可能な場合は、Category Thing/Option Set の選択を優先します。テキスト正規化は、フィルタが実際にテキストベースである場合にのみ使用してください。

Bubble 条件付き

ハードコーディングされたソース言語の値と比較する

When GoLocal Query Status's is_normalizing is no
and GoLocal Query Status's normalized_query is "Archived"

条件が重要なワークフローを制御している場合は、正規化が完了するまで待ちます。表示のみのフィルタリングの場合は、生のフォールバックで十分な場合があります。

バックエンドまたは API

正規言語のクエリをエンドポイントに送信する

API parameter q = GoLocal Query Products's normalized_query
Run only when is_normalizing is no

ID、UUID、電子メール、トークン、日付、数値は、GoLocal Query をバイパスし、変更せずに送信する必要があります。

初心者向けの完全なウォークスルー

翻訳されたカテゴリ名で記事をフィルタリングする

アプリが英語で構築されたと仮定します。データベースフィールド カテゴリ名 含まれています ニュース、しかしフランス人の訪問者は次のように入力しました 現実 通常の入力に入力します。

1. Bubble 入力に明確な名前を付けます
Input Category Search
2. 非ビジュアルヘルパーを 1 つ追加して名前を付けます
GoLocal Query Categories
3. ヘルパーフィールドをバインドする
GoLocal Query Categories → Query
= Input Category Search's value
4. 繰り返しグループのテキスト制約を設定する
Search for Articles
Category name = GoLocal Query Categories's normalized_query
5. 作成/編集ワークフローを変更しない
Create a new Article's title
= Input Article Title's value

結果: 訪問者はフランス語で検索し、Bubble は英語のデータベース値を見つけます。ユーザーが入力したテキストは書き換えられず、別のフォームに保存されません。

複数の入力があるページ

独立した検索コンテキストごとに 1 つの GoLocal Query インスタンスを作成します。各インスタンスには独自の値、デバウンス タイマー、シーケンス ガード、状態、イベントがあるため、ある入力が別の入力を上書きすることはできません。

記事入力検索GoLocal Query 記事記事繰り返しグループ
顧客検索の入力GoLocal Queryのお客様顧客 API フィルター
入力タグフィルターGoLocal Query Tagsタグの状態
1 つのクエリ要素を無関係な入力に再利用しないでください。 値が再利用可能な要素の境界を越える必要がある場合は、その特定の要素の normalized_query を専用の Bubble カスタム状態にコピーします。 normalized イベント火災。

手を付けずに残しておかなければならないもの

GoLocal Query を使用してください

  • 正規言語データベースフィールドの検索に使用される自由形式のテキスト
  • 英語の定数を期待するテキスト条件
  • バックエンドが英語を要求する API クエリ パラメーター
  • 入力されたクエリを Bubble に公開するサードパーティの検索コントロール

次の用途には使用しないでください。

  • 保存される名前、タイトル、コメント、説明、またはユーザー作成のタグ
  • Quill、リッチテキスト、contenteditable、または複数行入力コンテンツ
  • 電子メール、パスワード、電話、ID、日付、番号、ファイル、または検証
  • 直接比較できる Bubble モノまたは Option Set オブジェクト

保存されたユーザー コンテンツは後で表示されます

保護された入力は、後で通常の Bubble テキスト要素内でレンダリングすることができます。表示コンテナを次のような再利用可能なクラスでマークします。 .gl-user-content それをメインの GoLocal 要素に追加します。 do_not_translate_selectors。グループを繰り返す場合は、行全体で同じ HTML ID を複製する代わりに、クラス/セレクターを使用します。

フィールド、状態、イベント

フィールド

Querytext

1 つの表示される Bubble 入力の値にバインドします。

Enabledyes/no

デフォルトは「はい」です。無効にすると、トリミングされたテキストは変更されずに通過します。

Debounce (ms)number

デフォルトは 180。検索の推奨範囲は 150 ~ 250 ミリ秒です。

州

original_querytext

正規化前に Bubble から受け取った正確な値。

normalized_querytext

検索または比較ロジックの正規のソース言語の値。

is_normalizingyes/no

最新の空でないクエリが解決されている間は、はい。

normalization_foundyes/no

ソース言語のマッピングが見つかった場合ははい。

last_errortext

技術的な障害のメッセージ。通常の動作中は空です。

正規化された

最新のクエリが終了した後に発生します。ワークフローが待機するか、結果をカスタム状態にコピーする必要がある場合に使用します。

normalization_failed

技術的な障害により発火します。生のクエリは使用可能なフォールバックとして残り、詳細は last_error に表示されます。

一般的な Bubble セットアップのトラブルシューティング

normalized_query は常に生の入力と等しくなります

メインの GoLocal! 要素が存在して準備ができていること、プロジェクトのソース言語が正しく構成されていること、およびクエリ フィールドが目的の入力にバインドされていることを確認します。未知のフレーズは、安全なフォールバックとして生のテキストを意図的に使用する可能性があります。

繰り返しグループには前の結果が簡単に表示されます

厳密なフィルタリングの場合は、一致するクエリ要素の is_normalizing 状態が no の場合にのみ、読み込み状態を表示するか、最終検索を実行します。シーケンス ガードは、古い要求が新しい結果を置き換えることを防ぎます。

保存されたタイトルまたは説明が変更されました

保存ワークフローは、normalized_query または翻訳された表示テキストを参照しています。これを元の入力、複数行入力、またはリッチ テキスト エディターの値に戻します。 GoLocal Query はロジックのマッチング専用です。

2 つの入力が互いに干渉し合う

それぞれに独立した検索を与えます 独自の GoLocal Query 要素を入力します。無関係な入力間で 1 つのヘルパーを動的に切り替えないでください。

サードパーティセレクターは逆一致しません

自動サポートは、Bubble SearchBox、Bubble ドロップダウン、レガシー MultiDropdown、および Select2 MultiDropdown に限定されます。サードパーティ コントロールが入力されたテキストを Bubble に公開する場合は、そのテキストを専用の GoLocal Query 要素に接続します。

保存されたユーザー コンテンツは後で表示されるときに翻訳されます

.gl-user-content などの再利用可能なクラスを表示コンテナーに追加し、メインの GoLocal! 要素の do_not_translate_selectors にそのセレクターを含めます。

入力は繰り返しグループ内にあります

各セルに 1 つの Query 要素を配置したり、HTML ID を重複させたりしないでください。繰り返しグループをレンダリングする前にフィルタリングすることをお勧めします。それ以外の場合は、クエリ ヘルパーを繰り返しグループの外に保持し、単一の選択/検索値をそのグループに渡します。

受け入れチェックリスト

  1. 1英語とフランス語で同じレコードを検索します。
  2. 2素早く入力して、古い結果が新しい結果に置き換わることがないことを確認してください。
  3. 3入力をクリアし、繰り返しグループのリセットを確認します。
  4. 4入力が空でないときに言語を切り替えます。
  5. 5同じページで 2 つの独立した検索入力をテストします。
  6. 6フランス語のタイトルをアクセント付きで保存し、正確なテキストが保存されていることを確認します。
  7. 7Quill に入力して貼り付けます。どちらのパスも書き換えないでください。
  8. 8不明なクエリをテストし、生のフォールバックによってページが使用可能な状態に保たれることを確認します。
  9. 9すべての保存ワークフローで元の入力値が使用されていることを確認します。
  10. 10重要なソース言語ワークフローが is_normalizing = no になるまで待機することを確認します。

即断ルール

表示と保存は入力を使用します。正規のテキスト マッチングでは GoLocal Query を使用します。

Bubble がモノ、Option Set オプション、ID、または安定したコードを比較できる場合は、そのオブジェクトを直接使用します。 GoLocal Query は、翻訳された自由形式のテキスト値を正規のソース言語テキストと照合する必要がある場合にのみ追加します。