LoginSignup
1
1

More than 3 years have passed since last update.

[Shopify] ページ管理 II、ページの一覧を表示する

Last updated at Posted at 2020-12-21

昨日はShopify上でのページ生成を見ました、
今日はページの一覧の取得と、特定のページを取得してみます。

前回の記事はこちら
[Shopify] ページ管理 I、ページを生成する

昨日はプログラマチックにコンテンツを生成するということでしたが、逆にShopifyで管理しているページを自社アプリに表示するなどで利用することもできるかと思います。

では見てみましょう。

Shopify APIのエンドポイント

エンドポイントはこちらです

GET
/admin/api/2020-10/pages.json

モデル

データモデルは前回と同様ShopifyPageObjectModelがベースとなり、下記のように定義しました。


public class ShopifyPageObjectRootModel
{
  public ShopifyPageObjectModel page { get; set; }
}

APIコール

実際にAPIをCallしているメソッドはこちらです


public async Task<ShopifyPageListObjectRootModel> GetListOfPagesAsync(string storeUrl, string token, ShopifyPageListRequestModel filter)
{
  client = new HttpClient();
  var url = "https://" + storeUrl + path + "pages.json";
  
    client.DefaultRequestHeaders.Accept.Clear();
    client.DefaultRequestHeaders.Accept.Add(
      new MediaTypeWithQualityHeaderValue("application/json"));
    client.DefaultRequestHeaders.Add("X-Shopify-Access-Token", token);

    var response = await client.GetAsync(url); ;

    var resultString = await response.Content.ReadAsStringAsync();

    var responseLog = new Dictionary<string, string>();
    responseLog.Add("ApiResponse", resultString);
    _telemetry.TrackEvent("from /pages.json", responseLog);

    return JsonConvert.DeserializeObject<ShopifyPageListObjectRootModel>(resultString);
}

public class ShopifyPageListRequestModel
{
  public string limit { get; set; }
  public string since_id { get; set; }
  public string title { get; set; }
  public string handle { get; set; }
  public string created_at_min { get; set; }

  public string created_at_max { get; set; }
  public string updated_at_min { get; set; }
  public string updated_at_max { get; set; }
  public string published_at_max { get; set; }
  public string published_at_min { get; set; }
  public string fields { get; set; }
  public string published_status { get; set; }
}

コントローラー

さきほどつくったメソッドをCallしているコントローラーの一部はこちらです


var pages = await _shopifyPageHandlers.GetListOfPagesAsync(sdomain, organization.ShopifyAccessToken, new ShopifyPageListRequestModel() { });

ビュー

そしてViewはこちらです


<table class="table table-bordered table-striped">
  <tr>
    <td>
      Title/Handle
    </td>
    <td>
      Published At
    </td>
    <td>
      Author
    </td>
  </tr>
  @foreach (var item in Model.Pages.pages)
  {
    <tr>
      <td>
        @item.title
        <br />
        @item.handle
      </td>
      <td>
        @item.published_at
      </td>
      <td>
        @item.author
      </td>
    </tr>
  }
</table>

実際のビューはこちらです

uploading...0image.png

次回

今回は一旦リスト表示をしましたが、毎度すべてのページを戻されても使えないので、
次回はリストのフィルタリング(検索)をみて行きたいと思います。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1