实现视频聊天功能(ios)
In this tutorial, we’ll build the basis of a Telemedicine App for iOS using Stream Chat, to deliver fully featured chat components, and Dolby.io, to deliver quality audio and video. Both solutions provide HIPAA compliance. By the end, we’ll have an application similar to the screenshots below. As a bonus, it’s compatible with both light and dark mode.
在本教程中，我们将使用Stream Chat构建iOS远程医疗应用程序的基础，以提供功能全面的聊天组件 ，并以Dolby.io交付高质量的音频和视频。 两种解决方案均符合HIPAA标准 。 最后，我们将有一个类似于以下屏幕截图的应用程序。 另外，它与明暗模式兼容。
If you get lost during this tutorial, you can check the completed project in this GitHub repo. Let’s get started with our telemedicine app development!
如果您在本教程中迷路了，可以在此GitHub存储库中检查已完成的项目。 让我们开始我们的远程医疗应用程序开发！
什么是即时通讯？ (What is Stream Chat?)
Build real-time chat in less time. Rapidly ship in-app messaging with our highly reliable chat infrastructure. Drive in-app conversion, engagement, and retention with the Stream Chat messaging platform API & SDKs.
在更少的时间内建立实时聊天。 通过我们高度可靠的聊天基础架构，快速发布应用内消息。 通过Stream Chat消息传递平台API和SDK推动应用内转换，参与度和保留度。
什么是Dolby.io的客户端SDK？ (What is Dolby.io’s Client SDK?)
Dolby Interactivity APIs provide a platform for unified communications and collaboration. In-flow communications refers to the combination of voice, video, and messaging integrated into your application in a way that is cohesive for your end-users. This is in contrast to out-of-app communications where users must stop using your application and instead turn to third-party tools.
杜比交互式API提供了一个用于统一通信和协作的平台。 流内通信是指以对最终用户具有凝聚力的方式集成到您的应用程序中的语音，视频和消息传递的组合。 这与应用程序外通信相反，在应用程序外通信中，用户必须停止使用您的应用程序，而转而使用第三方工具。
创建Xcode项目 (Create the Xcode project)
First, we open Xcode and create a Single View App project.
首先，我们打开Xcode并创建一个Single View App项目。
And make sure to select ‘Storyboard’ for the User Interface.
并确保为用户界面选择“ Storyboard”。
安装依赖项 (Install dependencies)
To install the Stream Chat and Dolby.io’s Client SDK dependencies, we’ll use CocoaPods. If you prefer Carthage, both frameworks support it as well.
要安装Stream Chat和Dolby.io的Client SDK依赖项，我们将使用CocoaPods 。 如果您喜欢Carthage，则两个框架也都支持它。
In the folder where you saved the project, run pod init and add StreamChat and VoxeetUXKit to the Podfile. It should look similar to this:
在保存项目的文件夹中，运行pod init并将StreamChat和VoxeetUXKit添加到Podfile 。 它看起来应该类似于：
After you do that, run pod install, wait a bit for it to finish, and open the project via the .xcworkspace that was created.
完成之后，运行pod install ，稍等片刻，然后通过创建的.xcworkspace打开项目。
配置流聊天仪表板 (Configure the Stream Chat dashboard)
Sign up at GetStream.io, create the application, and make sure to select development instead of production.
在GetStream.io上注册，创建应用程序，并确保选择开发而不是生产。
To make things simple for now, let’s disable both auth checks and permission checks. Make sure to hit save. When your app is in production, you should keep these enabled.
为了使事情现在变得简单，让我们同时禁用身份验证检查和权限检查。 确保点击保存。 当您的应用程序投入生产时，应保持启用状态。
You can see the documentation about authentication here and permissions here.
Now, save your Stream credentials, as we’ll need them to power the chat in the app. Since we disabled auth and permissions, we’ll only really need the key for now, but in production, you’ll use the secret in your backend to implement proper authentication to issue user tokens for Stream Chat, so users can interact with your app securely.
现在，保存您的Stream凭据，因为我们需要它们来增强应用程序中的聊天功能。 由于我们已禁用身份验证和权限，因此我们现在仅真正需要密钥，但是在生产中，您将使用后端中的密钥实施适当的身份验证以为Stream Chat发行用户令牌 ，以便用户可以与您的应用进行交互安全地。
As you can see, I’ve blacked out my keys. You should make sure to keep your credentials safe.
如您所见，我已经把钥匙涂黑了。 您应该确保自己的凭据安全。
配置Dolby.io仪表板 (Configure the Dolby.io dashboard)
Configuring the Dolby.io dashboard is simpler. Just create an account there, and it should already set up an initial application for you.
配置Dolby.io仪表板更加简单。 只需在此处创建一个帐户，它就应该已经为您设置了一个初始应用程序。
Now, save your credentials, as we’ll need them to power the audio and video streaming in the app. As with the Stream credentials, you use these for development. In production, you’ll need to set up proper authentication. It’s described in detail here.
现在，保存您的凭据，因为我们将需要它们来支持应用程序中的音频和视频流。 与Stream凭据一样，您可以将其用于开发。 在生产中，您需要设置适当的身份验证。 在这里详细描述。
配置流聊天和Dolby.io的SDK (Configure Stream Chat and Dolby.io’s SDKs)
The first step with code is to configure the Stream and Dolby SDK with the credentials from the dashboards. Open the AppDelegate.swift file and modify it, so it looks similar to this:
使用代码的第一步是使用仪表板中的凭据配置Stream和Dolby SDK。 打开AppDelegate.swift文件并对其进行修改，因此它类似于以下内容：
That code initializes the Dolby.io and Stream Chat SDKs with credentials you got in the previous two steps.
该代码使用在前两个步骤中获得的凭据来初始化Dolby.io和Stream Chat SDK。
创建加入屏幕 (Create the Join Screen)
Let’s start building the “Join” screen. This screen consists of two UIButton instances. One to join as the Patient, and the other to join as the Doctor. This is, of course, an oversimplification to make this tutorial short and get to the chat, audio, and video features faster. In your complete app, you'll need proper registration, database, and all that. For this tutorial, the screen will look similar to the screenshot below.
让我们开始构建“ Join”屏幕。 该屏幕包含两个UIButton实例。 一个作为患者加入，另一个作为医生加入。 当然，这是一个过分的简化，以致使本教程变得简短而使聊天，音频和视频功能更快。 在您完整的应用程序中，您需要适当的注册，数据库以及所有这些。 对于本教程，屏幕看起来类似于以下屏幕截图。
Go to the storyboard, select the default view controller, and click Editor > Embed In > Navigation Controller. That will place it under a navigation controller, which we'll use to navigate to the channel screen.
转到情节提要，选择默认的视图控制器，然后单击Editor > Embed In > Navigation Controller 。 它将放置在导航控制器下，我们将使用它导航到频道屏幕。
Make sure to rename ViewController to JoinViewController, so you don't get confused later on. You can do this easily by right-clicking on ViewController in ViewController.swift and selecting refactor.
确保将ViewController重命名为JoinViewController ，以免日后混淆。 您可以通过右键单击ViewController中的ViewController.swift并选择refactor来轻松地做到这一点。
To make things simple, let’s leave the storyboard like this and use only code from now on. To set up the two buttons, we need the following code in JoinViewController.swift:
为简单起见，让我们像这样保留情节提要，从现在开始仅使用代码。 要设置这两个按钮，我们需要在JoinViewController.swift使用以下代码：
That code sets up the views, the constraints, and the handlers we need. Let’s start by extending JoinViewController to define setupViews:
该代码设置了我们所需的视图，约束和处理程序。 让我们首先扩展JoinViewController来定义setupViews ：
That code will create the buttons and add them to the controller’s view. Next, we need to define constraints between the three. Let’s do this by extending JoinViewController to define setupConstraints:
该代码将创建按钮并将其添加到控制器的视图。 接下来，我们需要在这三个之间定义约束。 让我们通过扩展JoinViewController来定义setupConstraints来做到这一点：
That code will make sure the patientButton stays in the center of the screen and the doctorButton below it. Now we need to set up the handler for when the user presses the buttons. Let's do this again by extending the controller to define setupHandlers:
该代码将确保patientButton停留在屏幕中央，而doctorButton位于屏幕下方。 现在，我们需要为用户按下按钮的时间设置处理程序。 让我们通过扩展控制器来定义setupHandlers来再次执行此setupHandlers ：
That code will make it so when the user presses the button a ConsultViewController is created and set up for the doctor or patient, depending on which button was pressed. We'll create ConsultViewController in the next step.
通过该代码，当用户按下按钮时，会创建一个ConsultViewController并为医生或患者设置，具体取决于所按下的按钮。 ConsultViewController ，我们将创建ConsultViewController 。
创建咨询屏幕 (Create the Consult Screen)
Now, let’s create the screen where the patient and doctor will talk via chat and where they can begin a video call. We’ll start by defining ConsultViewController. It will look similar to the screenshots below.
现在，让我们创建一个屏幕，病人和医生将在该屏幕上通过聊天进行交谈，并在此处开始视频通话。 我们将从定义ConsultViewController开始。 它看起来类似于下面的屏幕截图。
The first step is to create a ConsultViewController.swift file and paste the code below.
第一步是创建一个ConsultViewController.swift文件并将以下代码粘贴。
That code defines a subclass of ChatViewController, which provides most of the chat behavior and UI we need. It also defines the patient and doctor User objects and a Channel object between the two. These objects will be used to interact with the Stream API. On viewDidLoad, we also call setupViews and setupHandlers to set up the views and handlers needed. We'll define those functions next.
该代码定义了ChatViewController的子类，该子类提供了我们所需的大多数聊天行为和UI。 它还定义了患者和医生的User对象以及两者之间的Channel对象。 这些对象将用于与Stream API进行交互。 在viewDidLoad ，我们还调用setupViews和setupHandlers来设置所需的视图和处理程序。 接下来，我们将定义这些功能。
But, let’s first define the setupPatient function that sets the current Stream Chat user as the patient, and the setupDoctor function that sets it as the doctor.
但是，让我们首先定义setupPatient功能设置当前流聊天用户为病人和setupDoctor功能将其设置医生。
Now we define setupViews to set up the views we need.
现在，我们定义setupViews来设置所需的视图。
Those functions will display a button which starts a call. For it to work, we’ll need to define setupHandlers as well.
这些功能将显示一个开始通话的按钮。 为了使其正常工作，我们还需要定义setupHandlers 。
Those functions set callButtonPressed as the function to be called when the call button is pressed, which in turn calls startCall, which we define next.
这些函数将callButtonPressed设置为按下呼叫按钮时要调用的函数，而后者又调用了我们接下来定义的startCall 。
Finally, that function uses the Dolby.io SDK to start a conference call.
最后，该函数使用Dolby.io SDK发起电话会议。
配置用法说明 (Configure usage descriptions)
If you run the app now, you’ll be able to chat, but pressing the call button will cause the application to crash. That happens because we need to configure the usage descriptions for microphone and video in the Info.plist file. To do this, just open Info.plist and set the NSMicrophoneUsageDescription and NSCameraUsageDescription keys as pictured below.
如果您现在运行该应用程序，则可以聊天，但是按通话按钮将导致该应用程序崩溃。 发生这种情况是因为我们需要在Info.plist文件中配置麦克风和视频的使用说明。 为此，只需打开Info.plist并设置NSMicrophoneUsageDescription和NSCameraUsageDescription键，如下图所示。
Finally, we open the app in two devices, and, from the chat, we can start a call.
最后，我们在两个设备中打开该应用程序，然后从聊天中开始通话。
结语 (Wrapping up)
Congratulations! You’ve built the basis of a functioning telemedicine app with Stream Chat and Dolby.io. I encourage you to browse through Stream Chat’s docs, Dolby.io’s docs, and experiment with the project you just built. If you’re interested in the business side of things, read about how Stream Chat provides HIPAA compliance and how Dolby.io provides HIPAA compliance. Good luck on your telemedicine app development!
恭喜你！ 您已经使用Stream Chat和Dolby.io构建了功能正常的远程医疗应用程序的基础。 我鼓励您浏览Stream Chat的docs ， Dolby.io的docs ，并尝试使用刚刚构建的项目。 如果您对事物的业务感兴趣，请阅读有关Stream Chat如何满足 HIPAA的要求以及Dolby.io如何满足HIPAA的要求 。 祝您的远程医疗应用程序开发好运！
Originally published at https://getstream.io.
最初发布在 https://getstream.io 。
实现视频聊天功能(ios)
783
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
