Azure Search Sample & Xamarin.Forms でアプリ作成

作ってみました。 構成は、Azure Search と Xamarin.Forms だけで他にサーバーは立てていません。 Azure Search が提供する HTTP API を通してデータをやり取りします。 また、Azure Search の方は、ボタン１つで立ち上げられるサンプルデータを利用しています。

動画 Android で：

www.youtube.com

iOSで：

www.youtube.com

ソース GitHub: https://github.com/hhyyg/Miso.SearchForms

（プルリクなど大歓迎です。バグもあります。）

Features

Azure Search の機能のうち、Suggest・Filter・Facet・Paging を盛り込みました。

そのほか、以下のものを使用しています。

• Azure Search SDK
  • SDK を使わずに HTTP Client の方が良かったかなと思ったり。もう少し薄く使いたかったという意味で。
• Prism
• PCLAppConfig mrbrl/PCLAppConfig: Xamarin.Forms PCL App.Config Manager
• SegmentControl
  • chrispellett/Xamarin-Forms-SegmentedControl: An example for how to implement a cross platform segmented control for iOS and Android using Xamarin Forms
  • alexrainman/SegmentedControl
  • CustomRendererを調べたく、この2つを参照に実装

Azure Search - Sample data source

Azure Search には、不動産のデータのサンプルが用意されています。 7種類の言語が含まれていますが、残念ながら日本語は用意されていません。 SuggestやFacetなど、ある程度の機能が利用できるようにあらかじめインデックスが作成されています。 立ち上げるとすぐに HTTP でアクセスできます。

参照：Azure Search のサンプルデータ | ブチザッキ

GitHubの方には、自分の Azure Search の接続情報がコミットされています。 本当はよくないですが、フリープランのため課金は大したことなく、いつでも無効にできるためサンプルに入れました。なのですぐ試せると思います。

Other Sample

Azure Search と Xamarin のサンプルを探したところ、次の２つを発見しました。

Sample 1

• liamca/RealEstateXamarinAndroidDemo: Demo Real Estate Application highlighting Azure Search & Xamarin on Android

これは、Xamarin.Android と Azure Search のサンプルです。 Azure Search の方は、サンプルの不動産データを使用しています。 また、このアプリを使った解説動画が Channel9 の方にあります。→ - The Xamarin Show 9: Azure Search with Liam Cavanagh | The Xamarin Show | Channel 9

Sample 2

• Azure Search - Xamarin

こちらは、Xamarin.Forms と、Azure Search のサンプルです。 Azure Search のデータは、独自のものが定義されています。（ですので、自分で立ち上げるときは Azure Search の設定等を行う必要あり）

IIS URL Rewrite の Outbound Rules で CSS の中身を書き換える

例えば、以下のように CSS の中にある URL を、IIS の URL Rewrite で書き換えたい場合の話です。

例：

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(/content/images/abc.png); background-image: url(/content/images/abc.png);
}

以下のように、URL 「/content」ではなく、「/replacedcontents19」に置き換えたい：

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(/replacedcontents19/images/abc.png); background-image: url(/replacedcontents19/images/abc.png);
}

Web.config の設定

以下のように設定します。

<rewrite>
  <outboundRules>
    <rule name="RewriteCSS" preCondition="ResponseIsCss">
      <match filterByTags="None" pattern="/content/([^&quot;\)]*)" />
      <action type="Rewrite" value="/replacedcontents19/{R:1}" />
    </rule>
    <preConditions>
      <preCondition name="ResponseIsCss">
        <add input="{RESPONSE_CONTENT_TYPE}" pattern="^text/css" />
      </preCondition>
    </preConditions>
  </outboundRules>
</rewrite>

CSSの場合は、filterByTags="None" と設定する必要があります。HTMLの場合は、URL Rewrite Module 2.0 Configuration Reference : The Official Microsoft IIS Site ここの「Pre-defined tags」を参照し、適切な値を設定します。

filterByTags="None"を設定した場合、コンテンツ全体を走査し置き換えたい箇所を特定しているので、負担がかかります。
ですので、対処として「rewriteBeforeCache」や「occurrences」の設定が用意されています（先のページを参照）。今回はそれは使用していません。

違う例

先ほどは、正規表現を、/content/([^"\)]*) と指定しています。
例えば、もしこの正規表現を、/content/(.*)　とした場合、１行に複数個所該当する場合は、正しく置き換えられません。
以下のような CSS だと、

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(/content/images/abc.png); background-image: url(/content/images/abc.png);
}

.div1 {
    background-image: url(/content/images/abc.png);
}

次のように、最初と最後のurlだけがマッチされて、置き換えられます。
中盤の行末にある url は置き換えられません。

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(/replacedcontents19/images/abc.png); background-image: url(/content/images/abc.png);
}

.div1 {
    background-image: url(/replacedcontents19/images/abc.png);
}

正規表現(.*)が、行の最後までマッチしてしまっていることが原因だと思いますが、
正規表現がまるで”行ごと”に置き換えているような挙動の理由が、分からないままです。（＝なぜ、3つめのurlは置換されているのか？）
→追記：正規表現において「.」は、改行コード以外の1文字を表すためだと思われます。

環境

環境は、IIS 10 と URL Rewrite Module 2.0 で試しました。
試したコードをこちらに置いておきます。test.css · GitHub

参考サイト

• url rewriting - how do I know what version of IIS7 URL Rewrite module is installed - Stack Overflow
• iis 7 - How to fix URL Rewriting for links inside CSS files with IIS7 - Stack Overflow
• url rewriting - Does IIS / ARR rewrites one URL per line ONLY? - Stack Overflow
• URL Rewrite Module 2.0 Configuration Reference : The Official Microsoft IIS Site

おまけ検証追加

検証1

CSSのセミコロンを無しで、同じ行に2回登場させてみる。
置き換える値を固定値にしてみる。
正規表現は(.*)。

Web.config：

      <outboundRules>
        <rule name="RewriteCSS" preCondition="ResponseIsCss">
          <match filterByTags="None" pattern="/content/(.*)" />
          <action type="Rewrite" value="replaced1" />
        </rule>

元のCSS：

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(/content/images/abc.png) url(/content/images/abc.png);
}
.div1 {
    background-image: url("/content/images/abc.png");
}

.div6 {
    background-image: url(/content/images/content/abc.png);
}

.div7 {
    background-image: url("/content/images/content/abc.png");
}

結果、置き換えた後のCSS：

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(replaced1
}
.div1 {
    background-image: url("replaced1
}

.div6 {
    background-image: url(replaced1
}

.div7 {
    background-image: url("replaced1
}

検証2

先ほどと同じ条件。
・CSSのセミコロンを無しで、同じ行に2回登場させてみる。
・置き換える値を固定値にしてみる。
・正規表現は(.*)。
これで、occurrences="1" を追記してみる。

web.config：

      <outboundRules>
        <rule name="RewriteCSS" preCondition="ResponseIsCss">
          <match filterByTags="None" pattern="/content/(.*)" occurrences="1"/>
          <action type="Rewrite" value="replaced2" />
        </rule>

元のCSS：

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(/content/images/abc.png) url(/content/images/abc.png);
}
.div1 {
    background-image: url("/content/images/abc.png");
}

結果、置き換えられたCSS：

body {
    padding-top: 50px;
    padding-bottom: 223px;
    background-image: url(replaced2
}
.div1 {
    background-image: url("/content/images/abc.png");
}