会社の同期に誘われてiPhoneアプリを作成している最中、WebサーバーとiPhoneアプリ間の値の受渡しをどうするか悩んでいました。その時、どうやらJSONを使用して、値を受け渡すらしい!ということを知りました。
そこで、色々調べた結果、無事にJSONを使用した値の受渡しができたので、まとめます。
新人研修&自己学習で得た知識で書いてるので、間違っている箇所やより良い方法があれば、コメントください、、、、
作成するアプリ
流れとしてはこんな感じです。
① 「JSONを取得する」ボタンを押し、JavaServletへランダムな数値を渡す。
② JavaServletは、受け取った数値に応じたJSONをレスポンスする。
③ Swiftは、受け取ったJSONオブジェクトを変換し、値を画面へ出力する。
赤枠で囲まれている箇所に、JavaServletから得たJSONを出力しています。
また、すべてローカル環境で実装します。
環境
XcodeとEclipseを使用し、開発しました。
JSONを使用するにあたって、GSONかJacksonで迷いましたが、今回はJacksonを使用しました。
実際のコード
Xcode
JSONを取得する画面
ViewController.swift
importUIKitclassViewController:UIViewController{//表示用の文言vartextId=""vartextName=""//タプル配列の宣言varstudentList:[(id:String,name:String)]=[]overridefuncviewDidLoad(){super.viewDidLoad()// Do any additional setup after loading the view.}@IBActionfuncgetJson(_sender:Any){self.performSegue(withIdentifier:"goResultVC",sender:nil)}overridefuncprepare(forsegue:UIStoryboardSegue,sender:Any?){//リクエストURL JSONを返すサーブレットを指定guardletreq_url=URL(string:"http://localhost:8080/servlet_test/JsonServlet")else{return}//リクエストに必要な情報を生成varreq=URLRequest(url:req_url//0~2のランダムな数値を取得letid=Int.random(in:0...2)//データ転送を管理するためのセッションを作成letsession=URLSession(configuration:.default,delegate:nil,delegateQueue:OperationQueue.main)//JavaServletへ渡す情報(ID)をBodyへ設定するreq.httpMethod="POST"req.httpBody="id=\(id)".data(using:.utf8)//リクエストをタスクとして登録lettask=session.dataTask(with:req,completionHandler:{(data,response,error)in//セッションの終了session.finishTasksAndInvalidate()do{//取得したJSONを変換するletdecoder=JSONDecoder()letjson=trydecoder.decode(StudentJson.self,from:data!)self.textId=json.id!self.textName=json.name!//「JSONを取得する」ボタンに紐づくセグエifsegue.identifier=="goResultVC"{letnextVC=segue.destinationas!ResultViewVontrollernextVC.jsonId=self.textIdnextVC.jsonName=self.textName}}catch{print(error)print("エラーがでました")}})//ダウンロード開始task.resume()}//JSONのデータ構造structStudentJson:Codable{letid:String?letname:String?}}
JSONを出力する画面
ResultViewVontroller.swift
importUIKitclassResultViewVontroller:UIViewController{overridefuncviewDidLoad(){super.viewDidLoad()// Do any additional setup after loading the view.}//出力メッセージのフィールドvarjsonId=""varjsonName=""//出力ラベル@IBOutletweakvarresultJsonId:UILabel!@IBOutletweakvarresultJsonName:UILabel!overridefuncviewWillAppear(_animated:Bool){super.viewWillAppear(true)resultJsonId.text=jsonIdresultJsonName.text=jsonName}}
Eclipse
Java Servlet
JsonServlet.java
packageservlet;importjava.io.IOException;importjavax.servlet.ServletException;importjavax.servlet.annotation.WebServlet;importjavax.servlet.http.HttpServlet;importjavax.servlet.http.HttpServletRequest;importjavax.servlet.http.HttpServletResponse;importcom.fasterxml.jackson.core.JsonProcessingException;importcom.fasterxml.jackson.databind.ObjectMapper;importbean.JsonBean;/**
* Servlet implementation class JsonServlet
*/@WebServlet("/JsonServlet")publicclassJsonServletextendsHttpServlet{privatestaticfinallongserialVersionUID=1L;/**
* @see HttpServlet#HttpServlet()
*/publicJsonServlet(){super();// TODO Auto-generated constructor stub}/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/protectedvoiddoGet(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{}/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/protectedvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{JsonBeanjsonBeanList[]=newJsonBean[3];//Javaオブジェクトに値をセットJsonBeanjsonBean=newJsonBean();jsonBean.setId("101");jsonBean.setName("tanaka");JsonBeanjsonBean2=newJsonBean();jsonBean2.setId("102");jsonBean2.setName("yamada");JsonBeanjsonBean3=newJsonBean();jsonBean3.setId("103");jsonBean3.setName("satou");jsonBeanList[0]=jsonBean;jsonBeanList[1]=jsonBean2;jsonBeanList[2]=jsonBean3;//Stringstr=request.getParameter("id");intrequestId=Integer.parseInt(str);System.out.println(requestId);ObjectMappermapper=newObjectMapper();try{//JavaオブジェクトからJSONに変換StringtestJson=mapper.writeValueAsString(jsonBeanList[requestId]);//JSONの出力response.getWriter().write(testJson); //出力されるJSONの確認System.out.println(testJson);}catch(JsonProcessingExceptione){e.printStackTrace();}}}
Bean
JsonBean.java
packagebean;importjava.util.List;importcom.fasterxml.jackson.annotation.JsonProperty;publicclassJsonBean{@JsonProperty("id")privateStringid;@JsonProperty("name")privateStringname;publicvoidsetId(Stringid){this.id=id;}publicvoidsetName(Stringname){this.name=name;}}
JsonServletの動きを確認するには、Chromeの拡張機能であるTalend API Testerがおすすめです!
Talend API Tester
まとめ
これで、フロントエンドとバックエンド間の通信ができるようになりました。
次は、AWS上に乗っけてみます。
また、今回の実装をするにあたり、多くのQiita記事と書籍を参考にしました。
拙い内容でしたが、閲覧いただきありがとうございました!
マークダウン記法、めちゃめちゃ書きやすいですね。