After you install the plugin, let’s have a look on how to use it.
First of all, you can use the plugin at any point, It can be used on game objects, pure classes and static classes. Do whatever suits you better. But for simplicity let’s use it inside of a Game Object.
In this example we’ll create a MonoBehaviour class and name it MyComponent.
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class MyComponent : MonoBehaviour { }
Ok! Now, let’s create a method to handle our first HTTP request.
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class MyComponent : MonoBehaviour
{
private async void PerformGetRequest() { }
}
It is very important to mark your method as async, all the requests are awaitable
Now, let’s define our URL and Request Object .
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class MyComponent : MonoBehaviour
{
private async void PerformGetRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
}
}
We’re almost there. Let’s finish our script creating the Http Object that will handle the request.
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class MyComponent : MonoBehaviour
{
private async void PerformGetRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
var client = new Http();
}
}
For the purpose of this tutorial I took the liberty to create a very simple API using JavaScript and ExpressJS. You can use the same code as I’m using to make your own tests. Just make sure you have Node or any other JavaScript runtime installed on your machine. Here is the API code:
const express = require('express');
const app = express();
app.use(express.json());
app.get('/', (req, res) => {
console.log("headers => ", req.headers);
res.status(200).json({ message: 'Hello World' });
});
app.post('/', (req, res) => {
console.log("headers => ", req.headers);
console.log("body => ", req.body);
res.status(200).json({ message: 'Data received' });
})
app.listen(3000, () => console.log("server is running on port 3000"));
As you can see, my API is ready to receive a GET request and a POST request and, for my convenience, I already set some logs to be able to see the headers and the body of the POST request. Also, both endpoints return a object containing a message. Let’s create this object inside of our C# code to be able to read the message.
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class ResponsePayload
{
public string message;
}
public class MyComponent : MonoBehaviour
{
private async void PerformGetRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
var client = new Http();
}
}
Now that we have our ResponsePayload class, let’s make the request and see what is going on with our code using the method GetAsync() . We also need to call our PerformGetRequest() method, so let’s call it on the Start method.
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class ResponsePayload
{
public string message;
}
public class MyComponent : MonoBehaviour
{
private void Start() => PerformGetRequest();
private async void PerformGetRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
var client = new Http();
var response = await client.GetAsync(url, request);
}
}
If you did everything right, when you hit play, you’ll notice on your API the following result:
As you can see we are sending the request. Now let’s get the message using the method ParseBody()
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class ResponsePayload
{
public string message;
}
public class MyComponent : MonoBehaviour
{
private void Start() => PerformGetRequest();
private async void PerformGetRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
var client = new Http();
var response = await client.GetAsync(url, request);
var responsePayload = response.ParseBody<ResponsePayload>();
Debug.LogWarning(responsePayload.message);
}
}
Now that we are parsing the response body, we can check on the Unity console for our message.
Fair enough, but how about the POST method? Let’s dive into it.
Let’s create another method to perform a POST request, make a small change on the Debug.LogWarning message and to not generate garbage, transform the client variable into a property;
using UnityEngine;
using DallaiStudios.Plugins.HttpRequester;
public class ResponsePayload
{
public string message;
}
public class MyComponent : MonoBehaviour
{
private Http _client = new Http(); // New Class property
private void Start()
{
PerformGetRequest();
PerformPostRequest();
}
private async void PerformGetRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
var response = await _client.GetAsync(url, request); // Using the property
var responsePayload = response.ParseBody<ResponsePayload>();
Debug.LogWarning($"GET => {responsePayload.message}"); // Small Change
}
private async void PerformPostRequest() // new Method
{
var url = "<http://localhost:3000>";
var request = new Request();
var response = await _client.PostAsync(url, request); //Using the property
var responsePayload = response.ParseBody<ResponsePayload>();
Debug.LogWarning($"POST => {responsePayload.message}"); // Small Change
}
}
If we hit Play, this is the result we get.
Nothing special right? But methods like POST, PUT and PATH are able to send a body containing data to our API. So let’s create a Class to hold the data we want to send.
public class PlayerData
{
public int Health;
public int Stamina;
public Vector3 Position;
}
Now we just need to send the data
private async void PerformPostRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
// This is the data we want to send to the API
var playerData = new PlayerData
{
Health = 100,
Stamina = 100,
Position = transform.position
};
// This will serialize the object to JSON and set it as the request body
request.SetRequestBody<PlayerData>(playerData);
var response = await _client.PostAsync(url, request);
var responsePayload = response.ParseBody<ResponsePayload>();
Debug.LogWarning($"POST => {responsePayload.message}");
}
Hitting play, we can check the API for the body we just sent.
Fantastic! Now let’s imagine that our API receives this data and updates the values, that way we can send an updated version of our PlayerData object. I will change a little bit my JavaScript code, but this is only for a tutorial matter. You can alway create your on APIs. This is my Java script code now.
const express = require('express');
const app = express();
app.use(express.json());
app.get('/', (req, res) => {
console.log("headers => ", req.headers);
res.status(200).json({ message: 'Hello World' });
});
app.post('/', (req, res) => {
console.log("headers => ", req.headers);
console.log("body => ", req.body);
req.body.Health = 200;
req.body.Stamina = 200;
req.body.Position.x = 50;
req.body.Position.y = 50;
req.body.Position.z = 50;
res.status(200).json(req.body);
})
app.listen(3000, () => console.log("server is running on port 3000"));
As you can see, I’m just doubling the values of Health and Stamina and setting another value for the Position. Let’s change our C# code a bit since we no longer receive a message from the API
private async void PerformPostRequest()
{
var url = "<http://localhost:3000>";
var request = new Request();
// This is the data we want to send to the server
var playerData = new PlayerData
{
Health = 100,
Stamina = 100,
Position = transform.position
};
// This will serialize the object to JSON and set it as the request body
request.SetRequestBody<PlayerData>(playerData);
var response = await _client.PostAsync(url, request);
// Now we can parse the response body to our object
var responsePayload = response.ParseBody<PlayerData>();
Debug.LogWarning($"POST => {responsePayload.Health}, {responsePayload.Stamina}, {responsePayload.Position}");
}
Hitting play we have the following result
Even this being a tutorial, most of the time we are not sending requests to the same URL, very often endpoints have the same base URL but are differenciated by their URL strings. For our luck, the plugin can handle this situations, Imagine that in your local API you have a bunch of endpoints to deal with Leader boards and they are diveded like the exemple below:
The only diference between then are the strings after the last slash. You can define the base URL to your Http instance in order to facilitate future requests.
Example 1:
private async void MyMethod()
{
var client = new Http("<http://localhost:3000/leaderboard>");
var request = new Request();
var response = await client.GetAsync("/all", request);
}
Example 2:
private async void MyMethod()
{
var client = new Http();
client.SetBaseURL("<http://localhost:3000/leaderboard>");
var request = new Request();
var response = await client.GetAsync("/all", request);
}
The same can be said about requests, you can use the same request, as long you remember to clear the body between requests.
Example :
private Request _request = new();
private async void MyMethod()
{
var client = new Http("<http://localhost:3000/leaderboard>");
_request.SetBody<Leaderboard>(new Leaderboard());
var response = client.PostAsync("/", _request);
_request.Clear();
}
How about request headers? This is how you can set your custom headers.
private async void MyMethod()
{
var client = new Http("<http://localhost:3000/leaderboard>");
var request = new Request();
request.AddHeader("my-header", "header-value");
var response = await client.GetAsync("/all", request);
}
Even being a easy process, some times you may face the scenario where you have a lot of default headers and setting one-by-one can be boring and hard to maintain. Check out on how to set all at once.
private async void MyMethod()
{
var client = new Http("<http://localhost:3000/leaderboard>");
var headers = new Dictionary<string, string>()
{
{ "key1", "value1" },
{ "key2", "value2" }
};
var request = new Request();
request.SetRequestHeaders(headers);
var response = await client.GetAsync($"/{PlayerId}", request);
}
You can always clear the headers if you need to.
private async void MyMethod()
{
var client = new Http("<http://localhost:3000/leaderboard>");
var headers = new Dictionary<string, string>()
{
{ "key1", "value1" },
{ "key2", "value2" }
};
var request = new Request();
request.SetRequestHeaders(headers);
var response = await client.GetAsync($"/{PlayerId}", request);
request.ClearHeaders();
}