Аудио-видеозвонки из настраиваемого приложения в собрание Teams

1. samples/acs-to-teams-meeting/server/csharp/GraphACSFunctions.sln Откройте visual Studio или откройте папку GraphACSFunctions в Visual Studio Code.

2. Перейдите GraphACSFunctions в проект и создайте local.settings.json файл со следующими значениями:

   {
       "IsEncrypted": false,
       "Values": {
           "FUNCTIONS_WORKER_RUNTIME": "dotnet-isolated",
           "TENANT_ID": "",
           "CLIENT_ID": "",
           "CLIENT_SECRET": "",
           "USER_ID": "",
           "ACS_CONNECTION_STRING": ""
       },
       "Host": {
           "LocalHttpPort": 7071,
           "CORS": "*",
           "CORSCredentials": false
       },
       "watchDirectories": [
           "Shared"
       ]
   }
   

   • Используйте значения, скопированные в локальный файл в предыдущем упражнении, чтобы обновить TENANT_IDCLIENT_ID и CLIENT_SECRET значения.
   • Определите USER_ID идентификатор пользователя, который вы хотите создать собрание Microsoft Teams.

   Идентификатор пользователя можно получить из портал Azure.

   • Войдите с помощью учетной записи администратора клиента разработчика Microsoft 365.
   • Выберите Microsoft Entra ID
   • Перейдите на вкладку "Пользователи" на боковой панели.
   • Найдите имя пользователя и выберите его, чтобы просмотреть сведения о пользователе.
   • Внутри сведений Object ID о пользователе представляет объект User ID. Object ID Скопируйте значение и используйте его для USER_ID значения в local.settings.json.

   

   Примечание.

   ACS_CONNECTION_STRING будет использоваться в следующем упражнении, поэтому его еще не нужно обновить.

3. Откройте GraphACSFunctions.sln папку acs-to-teams-meeting/server/csharp и обратите внимание, что она включает следующие пакеты Microsoft Graph и Identity:

   <PackageReference Include="Azure.Communication.Identity" Version="1.3.1" />
   <PackageReference Include="Azure.Identity" Version="1.11.2" />
   <PackageReference Include="Microsoft.Graph" Version="5.51.0" />
   

4. Перейдите к Program.cs и запишите следующий код в методе ConfigureServices :

       var host = new HostBuilder()
           .ConfigureFunctionsWebApplication()
           .ConfigureServices(services => {
               services.AddApplicationInsightsTelemetryWorkerService();
               services.ConfigureFunctionsApplicationInsights();
               services.AddSingleton(static p =>
               {
                   var config = p.GetRequiredService<IConfiguration>();
                   var clientSecretCredential = new ClientSecretCredential(
                       config.GetValue<string>("TENANT_ID"),
                       config.GetValue<string>("CLIENT_ID"),
                       config.GetValue<string>("CLIENT_SECRET")
                   );
   
                   return new GraphServiceClient(
                       clientSecretCredential,
                       ["https://graph.microsoft.com/.default"]
                   );
               });
   
               ...
   
               services.AddSingleton<IGraphService, GraphService>();
           })
           .Build();
   }
   

   • Этот код создает GraphServiceClient объект, который можно использовать для вызова Microsoft Graph из Функции Azure. Это одинарный и может быть внедрен в другие классы.
   • Вызовы API Microsoft Graph можно выполнять с разрешениями только для приложений (например , Calendars.ReadWrite), передав ClientSecretCredential значение конструктору GraphServiceClient . Tenant IdClient Id Используется ClientSecretCredential и Client Secret значения из приложения идентификатора Microsoft Entra ID.

5. Open Services/GraphService.cs.

6. Ознакомьтесь с методом CreateMeetingEventAsync :

   using System;
   using System.Threading.Tasks;
   using Microsoft.Graph;
   using Microsoft.Extensions.Configuration;
   
   namespace GraphACSFunctions.Services;
   
   public class GraphService : IGraphService
   {
       private readonly GraphServiceClient _graphServiceClient;
       private readonly IConfiguration _configuration;
   
       public GraphService(GraphServiceClient graphServiceClient, IConfiguration configuration)
       {
           _graphServiceClient = graphServiceClient;
           _configuration = configuration;
       }
   
       public async Task<string> CreateMeetingAsync()
       {
           var userId = _configuration.GetValue<string>("USER_ID");
           var newMeeting = await _graphServiceClient
               .Users[userId]
               .Calendar
               .Events
               .PostAsync(new()
               {
                   Subject = "Customer Service Meeting",
                   Start = new()
                   {
                       DateTime = DateTime.UtcNow.ToString("yyyy-MM-ddTHH:mm:ss"),
                       TimeZone = "UTC"
                   },
                   End = new()
                   {
                       DateTime = DateTime.UtcNow.AddHours(1).ToString("yyyy-MM-ddTHH:mm:ss"),
                       TimeZone = "UTC"
                   },
                   IsOnlineMeeting = true
               });
           return newMeeting.OnlineMeeting.JoinUrl;
       }
   }
   

   • GraphServiceClient и IConfiguration объекты внедряются в конструктор и назначаются полям.
   • Функция CreateMeetingAsync() публикует данные в API событий календаря Microsoft Graph, который динамически создает событие в календаре пользователя и возвращает URL-адрес соединения.

7. Откройте TeamsMeetingFunctions.cs и выполните некоторое время для изучения конструктора. Вы GraphServiceClient посмотрели на более ранние версии и назначены полю _graphService .

   private readonly IGraphService _graphService;
   
   public TeamsMeetingFunction(IGraphService graphService) => _graphService = graphService;
   

8. Run Найдите метод:

   [Function("HttpTriggerTeamsUrl")]
   public async Task<HttpResponseData> Run(
       [HttpTrigger(AuthorizationLevel.Anonymous, "get", Route = null)] HttpRequestData req,
       ILogger log)
   {
       var response = req.CreateResponse(HttpStatusCode.OK);
       await response.WriteStringAsync(await _graphService.CreateMeetingAsync());
       return response;
   }
   

   • Он определяет имя HttpTriggerTeamsUrl функции, которую можно вызвать с помощью HTTP-запроса GET.
   • Он вызывает _graphService.CreateMeetingAsync()событие, которое создает новое событие и возвращает URL-адрес соединения.

9. Запустите программу, нажав клавишу F5 в Visual Studio или нажав кнопку "Отладка"> — начать отладку из меню. Это действие запускает проект Функции Azure и делает ACSTokenFunction доступным для вызова.

1. Откройте папку проекта samples/acs-to-teams-meeting/server/typescript в Visual Studio Code.

2. Создайте файл local.settings.json со следующими значениями:

   {
       "IsEncrypted": false,
       "Values": {
           "FUNCTIONS_WORKER_RUNTIME": "node",
           "TENANT_ID": "",
           "CLIENT_ID": "",
           "CLIENT_SECRET": "",
           "USER_ID": "",
           "ACS_CONNECTION_STRING": ""
       },
       "Host": {
           "LocalHttpPort": 7071,
           "CORS": "*",
           "CORSCredentials": false
       },
       "watchDirectories": [
           "Shared"
       ]
   }
   

   • Используйте значения, скопированные в локальный файл в предыдущем упражнении, чтобы обновить TENANT_IDCLIENT_ID и CLIENT_SECRET значения.
   • Определите USER_ID идентификатор пользователя, который вы хотите создать собрание Microsoft Teams.

   Идентификатор пользователя можно получить из портал Azure.

   • Войдите с помощью учетной записи администратора клиента разработчика Microsoft 365.
   • Выберите идентификатор Microsoft Entra,
   • Перейдите на вкладку "Пользователи" на боковой панели.
   • Найдите имя пользователя и выберите его, чтобы просмотреть сведения о пользователе.
   • Внутри сведений Object ID о пользователе представляет объект User ID. Object ID Скопируйте значение и используйте его для USER_ID значения в local.settings.json.

   

   Примечание.

   ACS_CONNECTION_STRING будет использоваться в следующем упражнении, поэтому его еще не нужно обновить.

3. Откройте файл package.json в VS Code и обратите внимание, что включены следующие пакеты Microsoft Graph и identity:

   @azure/communication-identity
   @azure/identity
   @microsoft/microsoft-graph-client
   

4. Откройте окно терминала в папке typescript и выполните npm install команду, чтобы установить зависимости приложения.

5. Откройте общий или graph.ts и изучите импорты в верхней части файла. Этот код обрабатывает импорт символов проверки подлинности и клиента, которые используются в функции Azure для вызова Microsoft Graph.

   import { startDateTimeAsync, endDateTimeAsync } from './dateTimeFormat';
   import { ClientSecretCredential } from '@azure/identity';
   import { Client } from '@microsoft/microsoft-graph-client';
   import { TokenCredentialAuthenticationProvider } from '@microsoft/microsoft-graph-client/authProviders/azureTokenCredentials';
   import 'isomorphic-fetch';
   

   Совет

   Вы также увидите импорт из dateTimeFormat.ts , которые используются далее в этом упражнении. startDateTimeAsync и endDateTimeAsync используются при создании ссылки на собрание Microsoft Teams для определения даты начала и окончания собрания.

6. Провести некоторое время, чтобы изучить clientSecretCredential и appGraphClient. Они будут использоваться позже в процессе проверки подлинности и при вызове API Microsoft Graph:

   let clientSecretCredential;
   let appGraphClient;
   

7. Найдите функцию ensureGraphForAppOnlyAuth :

   • ClientSecretCredentialTenant IdClient Id использует значения и Client Secret значения из приложения Идентификатора Microsoft Entra.
   • Объект authProvider определяется как приложение идентификатора Microsoft Entra, которое будет проходить проверку подлинности в фоновом режиме и использовать разрешения только для приложений (например Calendars.ReadWrite, для вызова API Microsoft Graph).

   function ensureGraphForAppOnlyAuth() {
       if (!clientSecretCredential) {
           clientSecretCredential = new ClientSecretCredential(
               process.env.TENANT_ID,
               process.env.CLIENT_ID,
               process.env.CLIENT_SECRET
           );
       }
   
       if (!appGraphClient) {
           const authProvider = new TokenCredentialAuthenticationProvider(
           clientSecretCredential, {
               scopes: [ 'https://graph.microsoft.com/.default' ]
           });
   
           appGraphClient = Client.initWithMiddleware({
               authProvider: authProvider
           });
       }
   }
   

8. Чтобы изучить эту функцию, сделайте некоторое createNewMeetingAsync время. Он публикует данные в API событий календаря Microsoft Graph, который динамически создает событие в календаре пользователя и возвращает новые сведения о событии:

   async function createNewMeetingAsync(userId) {
       ensureGraphForAppOnlyAuth();
       let startTime = await startDateTimeAsync();
       let endTime = await endDateTimeAsync();
       const newMeeting = `/users/${userId}/calendar/events`;
   
       const event = {
       subject: 'Customer Service Meeting',
       start: {
           dateTime: startTime,
           timeZone: 'UTC'
       },
       end: {
           dateTime: endTime,
           timeZone: 'UTC'
       },
       isOnlineMeeting: true
       };
   
       const newEvent = await appGraphClient.api(newMeeting).post(event);    
       return newEvent;     
   }
   
   export default createNewMeetingAsync;
   

9. Перейдите на сервер,typescript/src/functions/httpTriggerTeamsUrl.ts и изучите функцию триггера HTTP:

   • createNewMeetingAsync импортируется из graph.ts. Он обрабатывает создание и получение новых сведений о событии.
   • userId извлекается из local.settings.json внутри функции триггера Http. Это извлечение выполняется путем доступа к переменной USER_ID среды с помощью process.env.USER_ID.
   • При активации функции он вызывает createNewMeetingAsync определенный идентификатор пользователя и возвращает новые сведения о событии в teamMeetingLink параметре.
   • Функция обращается к URL-адресу присоединения к собранию Teams, вызывая meeting.onlineMeeting.joinUrl и возвращая значение в тексте ответа.

   import { app, HttpRequest, HttpResponseInit, InvocationContext } from "@azure/functions";
   import createNewMeetingAsync from '../../Shared/graph';
   
   let teamsMeetingLink;
   
   export async function httpTriggerTeamsUrl(request: HttpRequest, context: InvocationContext): Promise<HttpResponseInit> {
       context.log("Request received");
       const userId = process.env.USER_ID;
       context.log('UserId', userId);
   
       teamsMeetingLink = await createNewMeetingAsync(userId);
       const body = JSON.stringify(teamsMeetingLink);
       const meeting = JSON.parse(body);
       context.log("meeting:", meeting);
   
       return {
           // status: 200, /* Defaults to 200 */
           body: meeting.onlineMeeting.joinUrl
       }    
   };
   
   app.http('httpTriggerTeamsUrl', {
       methods: ['GET'],
       authLevel: 'anonymous',
       handler: httpTriggerTeamsUrl
   });
   
   export default httpTriggerTeamsUrl;
   

10. Используйте окно терминала для запуска npm start в папке samples/acs-video-to-teams-meeting/server/typescript для локального запуска функции.

1. Откройте local.settings.json и обновите ACS_CONNECTION_STRING значение с помощью строка подключения ACS, сохраненного в предыдущем упражнении.

2. Откройте Startup.cs в Visual Studio и изучите второй AddSingleton() вызов в методе ConfigureServices() .

   var host = new HostBuilder()
       .ConfigureFunctionsWebApplication()
       .ConfigureServices(services => {
   
           ...
   
           services.AddSingleton(static p =>
           {
               var config = p.GetRequiredService<IConfiguration>();
               var connectionString = config.GetValue<string>("ACS_CONNECTION_STRING");
               return new CommunicationIdentityClient(connectionString);
           });
   
           ...
   
       })
       .Build();
   }
   

3. Вызов AddSingleton() создает CommunicationIdentityClient объект с помощью ACS_CONNECTION_STRING значения из local.settings.json.

4. Откройте ACSTokenFunction.cs и найдите конструктор и определения полей.

   • Имя поля Scopes определяется, включающее CommunicationTokenScope.VoIP область. Эта область используется для создания маркера доступа для видеозвонка.

     private static readonly CommunicationTokenScope[] Scopes =
     [
         CommunicationTokenScope.VoIP,
     ];
     

   • Одноэлементный CommunicationIdentityClient экземпляр, созданный в Startup.cs, внедряется в конструктор и назначается полю_tokenClient.

     private readonly CommunicationIdentityClient _tokenClient;
     
     public ACSTokenFunction(CommunicationIdentityClient tokenClient)
     {
         _tokenClient = tokenClient;
     }
     

5. Изучите Run() метод в ACSTokenFunction.cs:

   [Function("HttpTriggerAcsToken")]
   public async Task<HttpResponseData> Run(
       [HttpTrigger(AuthorizationLevel.Anonymous, "get", Route = null)] HttpRequestData req,
       ILogger log)
   {
       var user = await _tokenClient.CreateUserAsync();
       var userToken = await _tokenClient.GetTokenAsync(user, Scopes);
   
       var response = req.CreateResponse(HttpStatusCode.OK);
       await response.WriteAsJsonAsync(
           new
           {
               userId = user.Value.Id,
               userToken.Value.Token,
               userToken.Value.ExpiresOn
           }
       );
       return response;
   }
   

   • Он определяет функцию с именем HttpTriggerAcsToken , которую можно вызвать с помощью HTTP-запроса GET.
   • Новый пользователь ACS создается путем _tokenClient.CreateUserAsync() вызова метода.
   • Маркер доступа, используемый для видеозвонков, создается путем вызова _tokenClient. GetTokenAsync() метода.
   • Идентификатор пользователя и маркер возвращаются из функции в виде объекта JSON.

6. Запустите программу, нажав клавишу F5 в Visual Studio или нажав кнопку "Отладка"> — начать отладку из меню. Это запустит проект Функции Azure и сделает ACSTokenFunction доступным для вызова.

   Примечание.

   Если вы используете VS Code, вы можете открыть окно терминала в папке GraphACSFunctions и запустить func start. В этом случае предполагается, что на компьютере установлен Функции Azure Core Tools.

7. Теперь, когда Функции Azure запущены локально, клиент должен иметь возможность вызывать их для получения удостоверений и маркеров ACS.

8. Откройте примеры/acs-to-teams-meeting/client/react/App.tsx-файл в редакторе.

9. userId Найдите переменные состояния и token переменные состояния компонента. Удалите жестко закодированные значения и замените их пустыми кавычками:

   const [userId, setUserId] = useState<string>('');
   const [token, setToken] = useState<string>('');
   

10. useEffect Найдите функцию и измените ее следующим образом, чтобы включить вызов функции Azure для получения удостоверения пользователя и маркера ACS:

    useEffect(() => {
        const init = async () => {
            setMessage('Getting ACS user');
            //Call Azure Function to get the ACS user identity and token
            let res = await fetch(process.env.REACT_APP_ACS_USER_FUNCTION as string);
            let user = await res.json();
            setUserId(user.userId);
            setToken(user.token);
    
            setMessage('Getting Teams meeting link...');
            //Call Azure Function to get the meeting link
            res = await fetch(process.env.REACT_APP_TEAMS_MEETING_FUNCTION as string);
            let link = await res.text();
            setTeamsMeetingLink(link);
            setMessage('');
            console.log('Teams meeting link', link);
        }
        init();
    
    }, []);
    

11. Сохраните файл перед продолжением.

12. Откройте окно терминала и запустите npm start его в папке react . После сборки и загрузки вы увидите отображаемый пользовательский интерфейс вызова ACS и вы можете вызвать собрание Teams, которое было динамически создано Microsoft Graph.

13. Остановите приложение React, нажав клавиши CTRL+C в окне терминала.

14. Остановите проект Функции Azure.

15. Зафиксируйте изменения Git и отправьте их в репозиторий GitHub с помощью Visual Studio Code:

    • Щелкните значок системы управления версиями (3-й вниз на панели инструментов Visual Studio Code).
    • Введите сообщение фиксации и нажмите кнопку "Фиксация".
    • Выберите "Синхронизировать изменения".

1. Откройте local.settings.json и обновите ACS_CONNECTION_STRING значение с помощью строка подключения ACS, сохраненного в предыдущем упражнении.

2. Откройте сервер или typescript/src/functions/httpTriggerAcsToken.ts в Visual Studio Code. Он содержит следующий код:

   import { app, HttpRequest, HttpResponseInit, InvocationContext } from "@azure/functions";
   import { CommunicationIdentityClient } from '@azure/communication-identity';
   
   export async function httpTriggerAcsToken(request: HttpRequest, context: InvocationContext): Promise<HttpResponseInit> {
       // Get ACS connection string from local.settings.json (or App Settings when in Azure)
       const connectionString = process.env.ACS_CONNECTION_STRING;
       let tokenClient = new CommunicationIdentityClient(connectionString);
       const user = await tokenClient.createUser();
       const userToken = await tokenClient.getToken(user, ["voip"]);
       return {
           jsonBody: { userId: user.communicationUserId, ...userToken }
       };
   }
   
   app.http('httpTriggerAcsToken', {
       methods: ['GET'],
       authLevel: 'anonymous',
       handler: httpTriggerAcsToken
   });
   
   export default httpTriggerAcsToken;
   

3. Функция выполняет следующие задачи:

   • Импортирует CommunicationIdentityClient данные, которые будут использоваться для создания удостоверения пользователя и маркера.

     import { CommunicationIdentityClient } from '@azure/communication-identity';
     

   • Возвращает строка подключения ACS из переменной среды с именемACS_CONNECTION_STRING.

     const connectionString = process.env.ACS_CONNECTION_STRING;
     

   Примечание.

   Это строка подключения значение, которое вы добавили в файл local.settings.json ранее.

   • Создает новый CommunicationIdentityClient экземпляр и передает в него строка подключения ACS.

     let tokenClient = new CommunicationIdentityClient(connectionString);
     

   • Создает пользователя ACS и получает маркер IP-адреса voice Over.

     const user = await tokenClient.createUser();
     const userToken = await tokenClient.getToken(user, ["voip"]);
     

   • Отправляет значения userId и маркера обратно вызывающей стороне.

     return {
         jsonBody: { userId: user.communicationUserId, ...userToken }
     };
     

4. Перейдите в папку server/typescript в окне терминала и выполните команду npm start.

5. Теперь, когда Функции Azure запущены локально, клиент должен иметь возможность вызывать их для получения удостоверений и маркеров ACS.

6. Откройте файл client/react/App.tsx в редакторе.

7. userId Найдите переменные состояния и token переменные состояния компонента. Удалите жестко закодированные значения и замените их пустыми кавычками:

   const [userId, setUserId] = useState<string>('');
   const [token, setToken] = useState<string>('');
   

8. useEffect Найдите функцию и измените ее следующим образом, чтобы включить вызов функции Azure для получения удостоверения пользователя и маркера ACS:

   useEffect(() => {
       const init = async () => {
           setMessage('Getting ACS user');
           //Call Azure Function to get the ACS user identity and token
           let res = await fetch(process.env.REACT_APP_ACS_USER_FUNCTION as string);
           let user = await res.json();
           setUserId(user.userId);
           setToken(user.token);
   
           setMessage('Getting Teams meeting link...');
           //Call Azure Function to get the meeting link
           res = await fetch(process.env.REACT_APP_TEAMS_MEETING_FUNCTION as string);
           let link = await res.text();
           setTeamsMeetingLink(link);
           setMessage('');
           console.log('Teams meeting link', link);
       }
       init();
   
   }, []);
   

9. Сохраните файл перед продолжением.

10. Откройте отдельный терминал и запустите npm start в папке React . После сборки и загрузки вы увидите отображаемый пользовательский интерфейс вызова ACS и вы можете вызвать собрание Teams, которое было динамически создано Microsoft Graph.

11. Остановите оба процесса терминала (React и Функции Azure), нажав клавиши CTRL+C.

12. Зафиксируйте изменения Git и отправьте их в репозиторий GitHub с помощью Visual Studio Code:

    • Щелкните значок системы управления версиями (3-й вниз на панели инструментов Visual Studio Code).
    • Введите сообщение фиксации и нажмите кнопку "Фиксация".
    • Выберите "Синхронизировать изменения".

1. samples/acs-video-to-teams-meeting/server/csharp/GraphACSFunctions.sln Откройте проект в Visual Studio.

2. Щелкните проект правой GraphACSFunctions кнопкой мыши и выберите " Опубликовать".

3. Выберите Azure в целевом разделе, а затем нажмите кнопку "Далее".

4. Выберите приложение-функцию Azure (Windows) и нажмите кнопку "Далее".

5. Выберите подписку, а затем нажмите кнопку "Создать".

6. Введите следующие данные:

   • Имя функции: требуется глобально уникальное имя. Пример: acsFunctions<YOUR_LAST_NAME>.
   • Подписка. Выберите нужную подписку.
   • Группа ресурсов. Выберите группу ресурсов, созданную ранее в этом руководстве, или вы также можете создать новую.
   • План размещения: план потребления.
   • Расположение. Выберите регион, в который вы хотите развернуть.
   • служба хранилища Azure. Создание нового. (Вы также можете выбрать существующую учетную запись хранения.)
   • Azure Insights: создайте новую. (Вы также можете выбрать существующую учетную запись хранения.)

   Примечание.

   Требуется глобально уникальное имя. Вы можете сделать имя более уникальным, добавив номер или фамилию в конец имени.

7. После создания приложения-функции Azure отобразится экран подтверждения. Убедитесь, что выбран параметр "Выполнить из пакета ", а затем нажмите кнопку "Готово".

8. Выберите "Опубликовать", чтобы развернуть функцию в Azure.

9. После развертывания функции в Azure перейдите к портал Azure и выберите созданное приложение-функцию.

10. Скопируйте URL-адрес развернутой функции. Далее в этом упражнении вы будете использовать это значение.

11. Выберите "Параметры".> Конфигурация в меню слева.

12. Нажмите кнопку " Создать приложение" и добавьте следующие ключи и значения в параметры приложения. Эти значения можно изменить из local.settings.json GraphACSFunctions проекта.

    # Retrieve these values from local.settings.json
    TENANT_ID: <YOUR_VALUE>
    CLIENT_ID: <YOUR_VALUE>
    CLIENT_SECRET: <YOUR_VALUE>
    USER_ID: <YOUR_VALUE>
    ACS_CONNECTION_STRING: <YOUR_VALUE>
    

13. Нажмите кнопку "Сохранить", чтобы сохранить параметры.

14. Наконец, необходимо включить CORS (совместное использование ресурсов между источниками) для приложения-функции, чтобы сделать API-интерфейсы приложения-функции доступными из-за пределов вашего домена. Выберите параметры —> CORS в меню слева.

15. Введите * (доступное из любых доменов) в текстовом поле "Разрешенные источники" и нажмите кнопку "Сохранить".

Начнем с использования VS Code для развертывания кода функций в Функции Azure.

1. Откройте папку проекта server/typescript .

2. Вы уже должны запустить npm install и увидеть папку node_modules в корневом каталоге проекта. В противном случае откройте командное окно и запустите npm install для установки зависимостей.

3. Откройте поддон команды VS Code (SHIFT+CMD+P на Mac | Shift+CTRL+P в Windows) и выберите Функции Azure: Создать приложение-функцию в Azure.

   

   Примечание.

   Если этот параметр не отображается, убедитесь, что в VS Code установлено расширение Функции Azure.

4. Вам будет предложено ввести следующие сведения:

   • Имя подписки Azure.
   • Имя функции: acsFunctions<YOUR_LAST_NAME>.

   Примечание.

   Требуется глобально уникальное имя. Вы можете сделать имя более уникальным, добавив номер или фамилию в конец имени.

   • Стек среды выполнения — выберите последнюю версию Node.js LTS .
   • Регион (выберите любой регион, который вы хотите).

5. После создания приложения-функции Azure появится сообщение о просмотре сведений.

6. Вернитесь к поддону команды в VS Code и выберите Функции Azure: Развертывание в приложении-функции. Вам будет предложено выбрать подписку и имя приложения-функции, созданное ранее.

7. После развертывания функции в Azure сделайте следующее:

   • Выберите расширение Azure в VS Code (щелкните значок Azure на боковой панели).
   • Разверните подписки.
   • Разверните приложение-функцию.
   • Щелкните правой кнопкой мыши функцию и выберите "Обзор веб-сайта". Перед продолжением работы приложения-функции убедитесь, что приложение-функция работает правильно.

8. Скопируйте домен функции Azure в локальный файл. Далее в этом упражнении вы будете использовать это значение.