JSON,Ajax,JavaScript,Javaを連携させるapiプログラムを作りたいです

webアプリケーションを作る上で必須の知識であるAPIの作り方が、二週間悩んでいますができません。
SampleAge.htmlに生年月日を入力すると自動で年齢が入力されるようにしたいです。javascriptのみで計算して値を返す方法は分かったのですが、どうしてもAPIの学習につなげたいです。

目的：
郵便番号API（所謂外部APIというのでしょうか）を使用して住所が自動入力されるものは作れました。この郵便番号APIに当たる部分に、年齢算出APIのようなものを作成したいです。

用意するものは、

・生年月日を引数にとって計算し、JSON形式の年齢を返すjavaクラス(Nenrei.java)
・javaにアクセスし、結果を反映するjavascript(未作成)
・HTML
で間違いないのでしょうか。

javascriptで使用するメソッドは何でしょうか（JSONparse,getJSON,$ajaxといろいろあって頭が追いつきません）

お忙しいところとは存じますが、もしお時間がお許しでしたらサンプルプログラム等提示していただけたら大変感謝いたします。
その他、助言等ございましたらお願いいたします。

SampleAge
1<!DOCTYPE html>
2<html>
3<head>
4<meta charset="UTF-8">
5<title>Insert title here</title>
6
7<script type="text/javascript" src="jquery-3.5.1.min.js"></script>
8</head>
9<body>
10<form>
11  <div>
12生年月日：
13    <input id="year" type="text" size="10" />
14    <input id="month" type="text" size="10" />
15    <input id="day" type="text" size="10" />
16  </div>
17  <div>
18   年齢：
19    <input id="age" type="text" size="10" />
20  </div>
21  </form>
22</body>
23</html>

Nenrei
1package Test;
2
3import java.util.Calendar;
4
5import com.fasterxml.jackson.core.JsonProcessingException;
6import com.fasterxml.jackson.databind.ObjectMapper;
7
8public class Nenrei {
9	public String AGE(String year,String month,String day) throws JsonProcessingException {
10
11		//生年月日
12		int Year = Integer.parseInt(year);
13		int Month = Integer.parseInt(month);
14		int Day = Integer.parseInt(day);
15
16		//現在の年月日
17		Calendar calendar = Calendar.getInstance();
18		int yearToday = calendar.get(Calendar.YEAR);
19		int monthToday = calendar.get(Calendar.MONTH);
20		int dayToday = calendar.get(Calendar.DAY_OF_MONTH);
21
22		//年齢を計算
23		int age;
24		age = yearToday - Year;
25		if(monthToday < Month) {
26			--age;
27		}else if(monthToday == Month) {
28			if(dayToday < Day) {
29				--age;
30			}
31		}
32		ObjectMapper mapper = new ObjectMapper();
33		String json = mapper.writeValueAsString(age);
34
35		return json;
36
37
38
39	}
40}
41

一連の流れで動作する、最低限のプログラムが知りたいです。

行動規範の内容に同意します

回答2件

javaとjavascriptを混同しているきらいがあります
まずはget/postして年齢戻してくれるjavaプログラムをつくるところから

投稿2020/08/20 05:49

yambejp

総合スコア116734

sad

2020/08/20 05:55

ご回答ありがとうございます。HTML/JSPからServletにget/postしてjavaクラスを呼び出し、forwardで返すといったプログラムは問題なく作れるのですがそれとはまた違うのでしょうか？

yambejp

2020/08/20 06:00

src="Nenrei.js" のところが怪しいので、指摘しました。 Nenrei.jsにjavaを埋め込みたいのかなと判断しました。そうではなく別途jsソースがあるならそれを提示くださいおそらくテキストボックスに入力するとfetchで値をひっぱってきて描画するjsが必要だと思います

sad

2020/08/20 06:06

Nenrei.jsの中身が全く分からず、名前と空のファイルのみの存在です。申し訳ございません（消しておきます）。実際は未作成です。 fetch、、知らない知識なので調べてみます。ありがとうございます。

yambejp

2020/08/20 06:15 編集

そうですか、私の勘違いでした。失礼しました。この場合なにをトリガー（きっかけ）にageに値を投入するのでしょうか？（更新ボタン的なものが見当たりませんが・・・）

sad

2020/08/20 06:31

いえ、誤解を招いてしまい申し訳ございません。 keyup？で入力することそのものがきっかけになるように作ろうと考えています。

yambejp

2020/08/20 06:35

なるほどyear,month,dayに入力があったときということで良いですね？その組み合わせが正しい日付でないときもサーバーに問い合わせるのでしょうか？ 2020年13月0日とか・・・js的には不可能では無い日付なのですが・・・

sad

2020/08/20 06:46

はい。日付の範囲は特に考えていませんでした、、エラーにならない限りは問い合わせる形にします。

yambejp

2020/08/20 07:20 編集

> エラーにならない限りそういう意味ではエラーになると思いますけど。そもそもyear（もしくは）に1文字入れた瞬間からサーバーに問い合わせ始めればサーバー側でエラーになりますねまぁエラーを返せば済む話ですが、正しい日付をジャッジして正しくなければサーバーに送らないほうが効率的ではあります（当然不正なデータにたいしてエラーを返す仕組みはjava側に実装しなくてはいけません）

sad

2020/08/20 07:33

なるほど。ifで4桁入力されてから処理が始まるように、といった感じでしょうか。もしくは”4桁入力してください”等をエラーメッセージにするか、、 Integer.parseIntができなかった場合のエラー処理をjavaに追加しておきます。ありがとうございます。

yambejp

2020/08/20 07:41 編集

エラー処理はhttpヘッダでエラーを返す（この場合だと422エラーとか？）か正常な返信をするが、返す文字やJSONの中にエラーとわかる記述をいれるかになると思います ajaxやfetchはhttpエラーかどうかでまず分岐がかわりますので

sad

2020/08/20 07:58

(理解が追いつきませんが)知識として参考にさせていただきます。ありがとうございます。 fetch等のURLはどのように作っているのでしょうか？作ったjavaにURLは無いと思うのですが、、ファイルのフルパスでしょうか？

行動規範の内容に同意します