feat: add cloud functions

front/package.json

@@ -27,6 +27,7 @@
     "@angular-devkit/build-angular": "^14.2.9",
     "@angular/cli": "~14.2.9",
     "@angular/compiler-cli": "^14.2.0",
+    "@azure/static-web-apps-cli": "^1.1.6",
     "@types/jasmine": "~4.0.0",
     "jasmine-core": "~4.3.0",
     "karma": "~6.4.0",

front/src/app/app.component.ts

@@ -1,10 +1,17 @@
 import { Component } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
 
 @Component({
   selector: 'app-root',
+  template: `<div>{{message}}</div>`,
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss'],
 })
 export class AppComponent {
+  message = '';
   isCollapsed = false;
-}
+  constructor(private http: HttpClient) {
+    this.http.get('/api/message')
+      .subscribe((resp: any) => this.message = resp.text);
+  }
+}

front/src/app/services/api.service.ts

@@ -7,7 +7,7 @@ import { NzMessageService } from 'ng-zorro-antd/message';
   providedIn: 'root',
 })
 export class ApiService {
-  _baseUrl = 'http://127.0.0.1:5000/api/v1';
+  _baseUrl = '/api/';
   constructor(
     private httpClient: HttpClient,
     private dialogService: NzMessageService

readme.md

@@ -1,51 +1,7 @@
-# Netflix电影/电视剧数据web展示
-数据来源见项目地址:backend/dataset/netflix_titles.csv     
-数据已经爬取到本地，可以直接使用     
-数据库连接用内网穿透的，在db.py中修改连接地址
-# 一、项目启动
-### 1.1、前端启动
-见front文件夹下的readme.md
-### 1.2、后端启动
-`python backend/app.py`
-
-
-# 二、通用接口（登录/注册）
-## 1 登录、注册
-### 1.1 登录
-post /login
-#### 参数
-| 参数名       | 类型 | 说明 |
-|:----------| :--- | :--- |
-|  username | string | 用户名|
-|  password | string | 密码|
-
-#### 返回值
-| 参数名       | 类型 | 说明          |
-|:----------| :--- |:------------|
-|  code | int | 状态码,0成功1失败. |
-|  msg | string | 提示信息        |
-|  data | object | 返回数据        |
-
-### 1.2 注册
-post /register
-#### 参数
-| 参数名       | 类型 | 说明 |
-|:----------| :--- | :--- |
-|  username | string | 用户名|
-|  password | string | 密码|
-
-#### 返回值
-| 参数名       | 类型 | 说明          |
-|:----------| :--- |:------------|
-|  code | int | 状态码,0成功1失败. |
-|  msg | string | 提示信息        |
-|  data | object | 返回数据        |
-
-## 3、其他接口文档
-### (当前仅实现login/register/getMovies三个接口)
-- 全部功能包括   
-1、登陆/注册   
-2、首页展示游戏信息,需分页(可以参考数据来源地址的页面)，首页搜索功能（一个搜索框即可）   
-3、首页列表项的增删改查   
-4、详情信息中评论添加/删除   
-- 完整接口文档见postman导出文件`./backend/netflixApi.json`   
+## 需要安装的vscode插件进行云开发的
+- Azure Resources
+- Azure Static Web Apps
+- Azure Functions
+> 云函数的部署操作参考: https://learn.microsoft.com/en-us/azure/static-web-apps/add-api?tabs=angular#create-the-api
+    - 本地测试：` swa start dist/ng_front --api-location api `
+- Github Actions