How to use gRPC in your iOS application with node.js server.

Today, we will discuss and implement a crud operation of gRPC in our iOS swift project. We will be creating an Xcode project and showing the list of Students in a UITableView. Before starting, let’s look up what gRPC is and how it works.

gRPC is a Remote Procedure Call which is open source, language-neutral, compact binary size, HTTP/2 support, and cross-platform compatibility framework developed by Google. It can perform any type of server communication via an interface, can be Unary (Single Request Single Response), ServerOrClient Streaming(One-sided streaming) and Bidirectional Streaming(Server and client can send a stream of messages). All the Request and Response data will be structured in a proto file. It will not be like a normal API where we send and receive JSON data. Here all will be handled by a Protocol Buffer system.

I will mainly focus on the iOS Client implementation part in this post. But If you want to read more details about it then click here.

I think you understand that we need a server setup tool for testing our iOS app, right? That’s why I built up a small gRPC server setup with node.js. I am not gonna briefly describe that code, I am just sharing the process so that you can run that project and check with your client.

Before jumping into the steps, let’s quickly understand what we are going to do. We need a gRPC proto compiler installed and a swift proto compiler installed so that we can generate the proto file into swift(grpc and pb) files. The installation part is the most difficult one here. You need to carefully follow the doc and readme file of git to achieve this.

I assume that you are going to use this in a Swift client so you are working in the Macintosh system. I am telling you the step walkthrough of the process below please follow this to install a proto compiler into your mac.

1. Download the proto buffer compiler zip or tar.gz from here — https://github.com/protocolbuffers/protobuf/releases/tag/v3.20.1
2. Extract that compressed file.
3. Open a terminal and set the protobuf-3.20.1 as your terminal’s current folder. See Snapshot 1 below.
4. Then type the commands I have told below
   ~ ./configure
5. ~ make
6. ~ make check
7. ~ sudo make install
8. ~ which protoc
9. After completing these steps proto compiler will install successfully into your machine
10. Just confirm it by typing in terminal ~ protoc –version. See the demo in Snapshot 2 below.

Snapshot 1

Snapshot 2

I will recommend you to use the same proto compiler version on the server and client end.

Now it’s time to install Apple’s swift protobuf plugin so that we can generate code in swift. I will mention the steps below. You can check for details here also.

1. ~ git clone https://github.com/apple/swift-protobuf.git
2. ~ cd swift-protobuf
3. ~ swift build -c release

Alternatively, you can install this via Homebrew too. I preferred this.

1. ~ brew install swift-protobuf

That’s it, you can check whether the installation is successful or not via running the command. See Snapshot 3

Snapshot 3

Now, the installation part is completed. Now I am giving you a small overview of the .proto file structure. Here you can see that -

1. I made a Student proto file which has the proto version 3.
2. service meaning the API we can call in the client end and server end.
3. message is the struct or class which defines the model for the client when you compiled it.
4. repeated is the syntax for array or list where we pass the sequence of data. See Snapshot 4 for more details.

Snapshot 4

Hopefully, you understood the basic structure of the .proto file. Now please download the full version of the repository from this GitHub link.

GitHub - avijitmobi/demo-grpc-student-node-crud: Demo of the grpc server in node.js. We are doing…

Please make sure you have Node.js installed on your mac. And for IDE I am using Visual Studio Code, I will recommend the same. Now after download run the command.

1. ~ npm install
2. ~ npm run server

Now you can see in Snapshot 5, that the node project is running at the local server localhost:8000 which we will use in our swift client project. 8000 is the port number. You can play around with the code and change the port number easily.

Snapshot 5

Now, we are going to create an Xcode project and try out the grpc in swift, we can get our data from the local node server correctly or not.

After creating an Xcode project we need to add the grpc library into our project via pod or package manager whatever you like. I did it via pod.

For the full installation procedure follow this link. I assume that you use the pod before, so I am not describing it here.

pod ‘gRPC-Swift’, ‘~> 1.0.0’

After installing this, open the xcworkspace file. Now we need to create a Repository for grpc requests and responses. Before creating this we need to convert the proto file to a swift pb and grpc file. You can find the proto file from the node server code.

How to generate the swift protocol buffer files?

First of all, you need to select that path of the folder where the proto file is stored in the terminal and run these two commands and you will see two files generated.

1. protoc — swift_out=. student.proto
2. protoc student.proto — grpc-swift_out=Client=true,Server=false:.

One is with grpc.swift extension which contains all services and another one is pf.swift file which contains all models. You do not need to edit those files because they will revert if you regenerate. Now add these two files to your Xcode project. You can see these files like Snapshot 6

Snapshot 6

Follow these below steps to understand the client call.

Create a swift file named GRPCRepository.swift and we will use it for our Server Call. Let’s understood it by the counter I have pointed into the code. Before creating the class must import the 3 items I have mentioned.

1. Declare a variable channel with the type GRPCChannel which is responsible for creating the start the server connection. I have unwrapped it because we are sure that we are going to initialise when the GRPCRepository object will be created. Do not worry about that.
2. Create another object of MultiThreadedEventLoopGroup which is responsible for thread management. This group will shut down when the program is completed.
3. Start the connection when the GRPCRepository object is created. We use connect method with hostname and port number which you need to replace in future.
4. Now we need to create a particular service’s channel from the main host. We are creating a variable name studentClient and returning that Student_StudentServiceClient which we got from the gRPC protocol. If you work with multiple proto files you will need to generate this type of channel multiple times.
5. In this method, we are calling the findStudent service which requests an Empty object from me and returns a list of students from the server. Passing the response and error via the method’s closure.

Hope you understood the process, It’s time to display the list of students in the TableView. For this, you have to add UITableViewCotroller added into the storyboard file and write down the below code into your ViewController class.

Voila, just run the project and you can see the result just like below. You can play around with the gRPC now and do whatever you can. You can comment below if you faced any problems.

Download the full swift project from below. Happy Coding.

GitHub - avijitmobi/gRPC-SwiftClient: Crud operation done with in grpc.

Source — Tenor