//tips
//unityとjsonserverの連動確認
unityでhttp://localhost:3000からデータを取得・POSTする方法を考える。
http://localhost:3000で取得するとhtmlの表記が多くなってしまったので純粋なjson形式を含むhttp://localhost:3000/articlesの方で処理を実行した。
下記がスクリプト。
using System.Collections;
using UnityEngine;
//これが必要になります
using UnityEngine.Networking;
public class APIWEB : MonoBehaviour
{
string webURL = "http://localhost:3000/articles";
public void Start()
{
//通信はコルーチンを使って行います。
StartCoroutine(GetData());
}
IEnumerator GetData()
{
UnityWebRequest request = UnityWebRequest.Get(webURL);
yield return request.SendWebRequest();
//エラー処理
if (request.isNetworkError)
{
Debug.Log(request.error);
}
else
{
//リクエストが成功した時
if (request.responseCode == 200)
{
string jsonText = request.downloadHandler.text;
//JSONがunicodeで、仮名がエスケープされてしまうため、エスケープされた文字を変換
jsonText = System.Text.RegularExpressions.Regex.Unescape(jsonText);
Debug.Log(jsonText);
}
}
}
}
コンソールに下記の内容が表示された。
[
{
"id": 1,
"title": "json-server",
"author": "typicode"
},
{
"id": 2,
"title": "faker.js",
"author": "Marak"
}
]
UnityEngine.Debug:Log(Object)
<GetData>d__2:MoveNext() (at Assets/APIWEB.cs:37)
UnityEngine.SetupCoroutine:InvokeMoveNext(IEnumerator, IntPtr) (at /Users/builduser/buildslave/unity/build/Runtime/Export/Coroutines.cs:17)
GETの方は無事にできたのでPOSTの方を見ていく。
"myField", "myData”を追加してみる。
下記スクリプトで実行。
using UnityEngine;
using UnityEngine.Networking;
using System.Collections;
public class APIPOST : MonoBehaviour
{
void Start()
{
StartCoroutine(Upload());
}
IEnumerator Upload()
{
WWWForm form = new WWWForm();
form.AddField("myField", "myData");
using (UnityWebRequest www = UnityWebRequest.Post("http://localhost:3000/articles", form))
{
yield return www.SendWebRequest();
if (www.isNetworkError || www.isHttpError)
{
Debug.Log(www.error);
}
else
{
Debug.Log("Form upload complete!");
}
}
}
}
http://localhost:3000/articlesページを確認すると下記のようにアップロードできていた。
[
{
"id": 1,
"title": "json-server",
"author": "typicode"
},
{
"id": 2,
"title": "faker.js",
"author": "Marak"
},
{
"myField": "myData",
"id": 3
}
]
ただ、このid3部分をdelteする方法を探していたところ、articles/~で消したい部分を指定できることに気づいたので下記のように処理してみた。
using UnityEngine;
using UnityEngine.Networking;
using System.Collections;
public class APIDELETE : MonoBehaviour
{
void Start()
{
StartCoroutine(Upload());
}
IEnumerator Upload()
{
using (UnityWebRequest www = UnityWebRequest.Delete("http://localhost:3000/articles/3"))
{
yield return www.SendWebRequest();
if (www.isNetworkError || www.isHttpError)
{
Debug.Log(www.error);
}
else
{
Debug.Log("Form upload complete!");
}
}
}
}
これできちんとid3の部分が削除された。
同様にPUTでid3の内容変更ができないか試してみる。
using UnityEngine;
using UnityEngine.Networking;
using System.Collections;
public class APIPUT : MonoBehaviour
{
void Start()
{
StartCoroutine(Upload());
}
IEnumerator Upload()
{
byte[] myData = System.Text.Encoding.UTF8.GetBytes("This is some test data");
using (UnityWebRequest www = UnityWebRequest.Put("http://localhost:3000/articles/3", myData))
{
yield return www.SendWebRequest();
if (www.isNetworkError || www.isHttpError)
{
Debug.Log(www.error);
}
else
{
Debug.Log("Form upload complete!");
}
}
}
}
これで試したが"This is some test data”は表示されずid3以下が空になるだけで終わってしまった。
再度POSTを行い、下記のように戻した。
[
{
"id": 1,
"title": "json-server",
"author": "typicode"
},
{
"id": 2,
"title": "faker.js",
"author": "Marak"
},
{
"myField": "myData",
"id": 3
}
]
同様の問題の解決策としてjsonformatの認識のされ方だという指摘を見つけたのでそちらを参考にコードを変更。
https://stackoverflow.com/questions/37513244/unity-3d-puts-deletes-http-methods
using UnityEngine;
using UnityEngine.Networking;
using System.Collections;
public class APIPUT : MonoBehaviour
{
void Start()
{
StartCoroutine(Upload());
}
IEnumerator Upload()
{
UnityWebRequest www = UnityWebRequest.Put("http://localhost:3000/articles/3", "{\"name\":\"user_01\",\"address\":{\"raw\":\"MountFiji\"}}");
www.SetRequestHeader("Content-Type", "application/json");
yield return www.SendWebRequest();
if (www.isNetworkError || www.isHttpError)
{
Debug.Log(www.error);
}
else
{
Debug.Log("Form upload complete!");
}
Stringを認識させるためのスラッシュが必要とのことだったので追加した。
こちらを実行するとid3部分がきちんと更新され、下記のような表示となった。
[
{
"id": 1,
"title": "json-server",
"author": "typicode"
},
{
"id": 2,
"title": "faker.js",
"author": "Marak"
},
{
"name": "user_01",
"address": {
"raw": "MountFiji"
},
"id": 3
}
]
きちんとunityからjsonの内容を変更できた。
次のステップとしてはこの変更したjsonの内容を加工して、htmlで見せたい表示にする。
JavaScriptでJSONファイルを読み込んでいく流れになるか。
