Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tsuki-lab/microcms-iframe-address
https://github.com/tsuki-lab/microcms-iframe-address
Last synced: 28 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/tsuki-lab/microcms-iframe-address
- Owner: tsuki-lab
- License: mit
- Created: 2022-04-29T02:04:00.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-02-06T03:29:22.000Z (almost 2 years ago)
- Last Synced: 2024-04-23T21:39:18.757Z (9 months ago)
- Language: JavaScript
- Homepage: https://tsuki-lab.github.io/microcms-iframe-address/
- Size: 2.87 MB
- Stars: 5
- Watchers: 2
- Forks: 0
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
![フィールド画像](/docs/image/sample-view.png)
microCMS の[外部データ連携(iframe フィールド)](https://document.microcms.io/manual/iframe-field)用に作成した「**住所入力フィールド**」です。
[注意事項](#注意事項)をお読みの上ご利用ください。DEMO: [https://tsuki-lab.github.io/microcms-iframe-address/](https://tsuki-lab.github.io/microcms-iframe-address/)
# 機能仕様
- **住所検索機能**
[zipcloud |郵便番号検索 API](http://zipcloud.ibsnet.co.jp/) を用いて入力された郵便番号を元に住所を検索・自動入力します。- **入力値のフィードバック**
インラインフレームフィールドから入力フィールドに入力した値は、常に microCMS にフィードバックされます。
入力した内容は microCMS 管理画面にて「下書き保存」または、「公開」を押下することでコンテンツとして保存されます。## レスポンス
```json
{
"postalCode": "郵便番号",
"addressLevel1": "都道府県",
"addressLevel2": "市区町村",
"streetAddress": "町名以下"
}
```# 設定方法
## 1. API スキーマ設定
[API スキーマ設定](https://document.microcms.io/manual/api-model-settings)を元に設定を進めます。
入力フォームの種類に**インラインフレーム**を選択します。## 2. インラインフレーム設定
インラインフレーム詳細設定画面、**iframe URL**に [https://tsuki-lab.github.io/microcms-iframe-address/](https://tsuki-lab.github.io/microcms-iframe-address/) を入力します。
API の設定を保存することで利用可能になります。
![インラインフレーム設定画面](/docs/image/inline-frame-setting.png)
# 注意事項
※ この URL の入力フォームは予告なく内容が更新される場合がありますので、ご注意ください。
※ このソースコードはオープンソースにて公開しています。自由にカスタマイズの上、任意のサービスにデプロイしてご利用いただくことができます。
※ この入力フィールドを利用して発生した不具合については、自己責任にてお願いいたします。# 問い合わせ先
[@hanetsuki_dev | Twitter](https://twitter.com/hanetsuki_dev)