Ken All は、郵便番号で住所を検索できる npm パッケージです。
import KenAll from 'ken-all';
// [['東京都', '千代田区', '大手町']];
KenAll('1000004').then(res => console.log(res));
$ npm install ken-all
もしくは
$ yarn add ken-all
importしたKenAllに、7桁半角数字の文字列を渡します。
import KenAll from 'ken-all';
// [['東京都', '千代田区', '大手町']];
KenAll('1000004').then(res => console.log(res));
返り値は、以下の値を持つpromiseオブジェクトです。
[
['都道府県', '市区町村', '町域'],
['都道府県', '市区町村', '町域'],
// ...
]
// [["愛知県", "弥富市", ""], ["三重県", "桑名郡木曽岬町", ""]]
KenAll('4980000').then(res => console.log(res));
該当する住所がない場合は、空の配列を返します。
// []
KenAll('9009999').then(res => console.log(res));
型定義ファイルも同梱しているので、TypeScript アプリでも利用することが出来ます。
＊以下のサンプルは、シンプルにするために複数の住所が返ってきたケースを考慮していません
// React のバージョン 16.10.2 で確認
import React, {useState} from 'react';
import ReactDOM from 'react-dom';
import KenAll from 'ken-all';
const App = () => {
const [postCode, setPostCode] = useState('');
const [address, setAddress] = useState('');
return (
<>
<input
type="text"
value={postCode}
onChange={e => {
const inputValue = e.currentTarget.value;
setPostCode(inputValue);
if (inputValue.length === 7) {
KenAll(inputValue).then(res => {
if (res.length === 0) {
setAddress('該当する住所はありません');
} else {
setAddress(res[0].join(' '));
}
});
}
}}
maxLength={7}
/>
<p>{address}</p>
</>
);
};
ReactDOM.render(<App />, document.querySelector('#app'));
エントリポイント。
// Vue のバージョン 2.6.10 で確認
import Vue from 'vue';
import App from './components/App.vue';
document.addEventListener('DOMContentLoaded', () => {
new Vue({
render: h => h(App),
}).$mount('#app');
});
コンポーネント。
<template>
<div>
<input
v-model="postCode"
maxlength="7"
@keyup="onChange"
/>
<p>{{ this.address }}</p>
</div>
</template>
<script>
import KenAll from 'ken-all';
export default {
data() {
return {
postCode: '',
address: '',
};
},
methods: {
onChange() {
if (this.postCode.length === 7) {
KenAll(this.postCode).then(res => {
if (res.length === 0) {
this.address = '該当する住所はありません';
} else {
this.address = res[0].join(' ');
}
});
}
},
},
};
</script>
// Node.js のバージョン 12.10.0 で確認
const KenAll = require('ken-all').default;
// [ [ '東京都', '千代田区', '永田町' ] ]
KenAll('1000014').then(res => console.log(res));
0.2.0以降のバージョンはhttps://unpkg.com/ken-all@{バージョン番号}/umd/index.jsで読み込めます。
読み込み後、KenAll.defaultという形で利用できます。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Ken All Sample</title>
</head>
<body>
<input id="post-code" maxlength="7">
<p id="result"></p>
<script src="https://unpkg.com/ken-all@0.2.0/umd/index.js"></script>
<script>
const searchBoxElem = document.querySelector('#post-code');
searchBoxElem.addEventListener('input', e => {
const postCode = e.currentTarget.value;
if (postCode.length === 7) {
const resultTextElem = document.querySelector('#result');
KenAll.default(postCode).then(res => {
if (res.length === 0) {
resultTextElem.textContent = '該当する住所はありません';
} else {
resultTextElem.textContent = res[0].join(' ');
}
});
}
}, false);
</script>
</body>
</html>
株式会社アイビス様が提供している「郵便番号データ（加工済バージョン）」を再加工して利用しています。
http://zipcloud.ibsnet.co.jp/
FAQs
Ken All は、郵便番号で住所を検索できる npm パッケージです。
The npm package ken-all receives a total of 1,557 weekly downloads. As such, ken-all popularity was classified as popular.
We found that ken-all demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Five frontier LLMs generated the same nonexistent package names, leaving 53 available for potential slopsquatting across PyPI and npm.
Security News
The White House’s Gold Eagle Initiative aims to coordinate AI-discovered vulnerabilities, validate findings, and accelerate patching across critical software.
Security News
A Shai-Hulud infection exposed Suno's source code, which shows the AI music startup stream-ripped tracks to train its models.