简单搭建qiankun的主应用和子应用并且用Docker进行服务器部署
在node18环境下,用react18创建qiankun主应用和两个子应用,react路由用V6版本,都在/main路由下访问子应用,用Dockerfile部署到腾讯云CentOS7.6服务器的8000端口进行访问,且在部署过程中进行nginx配置以进行合理的路由访问
要在 Node.js 18 环境下,用 React 18 创建一个基于 qiankun 的主应用和两个子应用,并使用 React Router v6 进行路由管理,所有子应用都在 /main 路由下访问,并使用 Docker 和 Nginx 部署到腾讯云 CentOS 7.6 服务器的 8000 端口,可以按照以下步骤进行:
1. 创建主应用和子应用
主应用
- 创建主应用:
npx create-react-app main-app --template typescript
cd main-app
- 安装 qiankun 和 react-router-dom:
npm install qiankun react-router-dom@6
- 配置主应用:
在 index.tsx 中配置 qiankun:
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
import { registerMicroApps, start } from 'qiankun';
import App from './App';registerMicroApps([{name: 'sub-app-1',entry: '//localhost:7100',container: '#subapp-viewport',activeRule: '/main/sub-app-1',},{name: 'sub-app-2',entry: '//localhost:7200',container: '#subapp-viewport',activeRule: '/main/sub-app-2',},
]);start();ReactDOM.render(<React.StrictMode><Router><Routes><Route path="/*" element={<App />} /></Routes></Router></React.StrictMode>,document.getElementById('root')
);
- 修改 App.tsx:
import React from 'react';
import { Link } from 'react-router-dom';const App = () => (<div><nav><ul><li><Link to="/main/sub-app-1">Sub App 1</Link></li><li><Link to="/main/sub-app-2">Sub App 2</Link></li></ul></nav><div id="subapp-viewport"></div></div>
);export default App;
子应用 1
- 创建子应用 1:
npx create-react-app sub-app-1 --template typescript
cd sub-app-1
- 安装 qiankun 和 react-router-dom:
npm install qiankun react-router-dom@6
- 配置子应用 1:
在 index.tsx 中添加 qiankun 的生命周期函数:
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
import App from './App';if (window.__POWERED_BY_QIANKUN__) {// eslint-disable-next-line @typescript-eslint/ban-ts-comment// @ts-ignore__webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
}function render(props) {const { container } = props;ReactDOM.render(<React.StrictMode><Router basename={window.__POWERED_BY_QIANKUN__ ? '/main/sub-app-1' : '/'}><Routes><Route path="/*" element={<App />} /></Routes></Router></React.StrictMode>,container ? container.querySelector('#root') : document.getElementById('root'));
}if (!window.__POWERED_BY_QIANKUN__) {render({});
}export async function bootstrap() {console.log('sub-app-1 bootstraped');
}export async function mount(props) {console.log('sub-app-1 mounted');render(props);
}export async function unmount(props) {console.log('sub-app-1 unmounted');const { container } = props;ReactDOM.unmountComponentAtNode(container ? container.querySelector('#root') : document.getElementById('root'));
}
- 配置 package.json:
{"name": "sub-app-1","version": "0.1.0","private": true,"homepage": "/main/sub-app-1","dependencies": {"react": "^18.0.0","react-dom": "^18.0.0","react-scripts": "5.0.0","qiankun": "^2.4.0","react-router-dom": "^6.0.0"},"scripts": {"start": "PORT=7100 react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"}
}
子应用 2
子应用 2 的步骤和 子应用 1 基本一致,项目名不一样和Router的 basename 不一样即可;端口为 7200,或者自行定义,和主应用和子应用1端口不一样即可
2. 创建 Dockerfile
为每个应用创建 Dockerfile,并使用 Nginx 作为静态文件服务器。
主应用 Dockerfile
在 main-app 目录下创建 Dockerfile:
# Build stage
FROM node:18 AS build# Set the working directory
WORKDIR /app# Copy the package.json and package-lock.json files
COPY package*.json ./# Install dependencies
RUN npm install# Copy the rest of the application code
COPY . .# Build the application
RUN npm run build# Production stage
FROM nginx:alpine# Copy the built files from the build stage
COPY --from=build /app/build /usr/share/nginx/html# Copy the Nginx configuration file
COPY nginx.conf /etc/nginx/nginx.conf# Expose port 80
EXPOSE 80# Start Nginx
CMD ["nginx", "-g", "daemon off;"]
子应用 1 Dockerfile
在 sub-app-1 目录下创建 Dockerfile:
# Build stage
FROM node:18 AS build# Set the working directory
WORKDIR /app# Copy the package.json and package-lock.json files
COPY package*.json ./# Install dependencies
RUN npm install# Copy the rest of the application code
COPY . .# Build the application
RUN npm run build# Production stage
FROM nginx:alpine# Copy the built files from the build stage
COPY --from=build /app/build /usr/share/nginx/html# Copy the Nginx configuration file
COPY nginx.conf /etc/nginx/nginx.conf# Expose port 80
EXPOSE 80# Start Nginx
CMD ["nginx", "-g", "daemon off;"]
子应用 2 Dockerfile
在 sub-app-2 目录下创建 Dockerfile:
# Build stage
FROM node:18 AS build# Set the working directory
WORKDIR /app# Copy the package.json and package-lock.json files
COPY package*.json ./# Install dependencies
RUN npm install# Copy the rest of the application code
COPY . .# Build the application
RUN npm run build# Production stage
FROM nginx:alpine# Copy the built files from the build stage
COPY --from=build /app/build /usr/share/nginx/html# Copy the Nginx configuration file
COPY nginx.conf /etc/nginx/nginx.conf# Expose port 80
EXPOSE 80# Start Nginx
CMD ["nginx", "-g", "daemon off;"]
3. 创建 Nginx 配置文件
为每个应用创建一个 Nginx 配置文件 nginx.conf。
主应用 Nginx 配置文件
在 main-app 目录下创建 nginx.conf:
server {listen 80;server_name localhost;location / {root /usr/share/nginx/html;index index.html index.htm;try_files $uri $uri/ /index.html;}location /main/sub-app-1/ {proxy_pass http://localhost:7100/;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}location /main/sub-app-2/ {proxy_pass http://localhost:7200/;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}
子应用 1 和子应用 2 Nginx 配置文件
在 sub-app-1 和 sub-app-2 目录下分别创建 nginx.conf:
server {listen 80;server_name localhost;location / {root /usr/share/nginx/html;index index.html index.htm;try_files $uri $uri/ /index.html;}
}
4. 构建和运行 Docker 容器
在每个应用的目录下,运行以下命令构建 Docker 镜像:
docker build -t main-app .
docker build -t sub-app-1 .
docker build -t sub-app-2 .
然后运行 Docker 容器:
docker run -d -p 8000:80 main-app
docker run -d -p 7100:80 sub-app-1
docker run -d -p 7200:80 sub-app-2
5. 部署到腾讯云 CentOS 7.6 服务器
- 连接到腾讯云服务器:
使用 SSH 连接到你的腾讯云 CentOS 7.6 服务器。
ssh your-username@your-server-ip
- 安装 Docker:
如果你的服务器上还没有安装 Docker,可以使用以下命令安装:
sudo yum update -y
sudo yum install -y docker
sudo systemctl start docker
sudo systemctl enable docker
- 将 Docker 镜像推送到 Docker Hub:
在本地机器上,将构建的 Docker 镜像推送到 Docker Hub:
docker tag main-app your-dockerhub-username/main-app
docker tag sub-app-1 your-dockerhub-username/sub-app-1
docker tag sub-app-2 your-dockerhub-username/sub-app-2docker push your-dockerhub-username/main-app
docker push your-dockerhub-username/sub-app-1
docker push your-dockerhub-username/sub-app-2
- 在服务器上拉取并运行 Docker 镜像:
在服务器上,拉取并运行 Docker 镜像:
docker pull your-dockerhub-username/main-app
docker pull your-dockerhub-username/sub-app-1
docker pull your-dockerhub-username/sub-app-2docker run -d -p 8000:80 your-dockerhub-username/main-app
docker run -d -p 7100:80 your-dockerhub-username/sub-app-1
docker run -d -p 7200:80 your-dockerhub-username/sub-app-2
通过这些步骤,你可以在 Node.js 18 环境下,用 React 18 创建一个基于 qiankun 的主应用和两个子应用,并使用 Nginx 作为静态文件服务器,部署到腾讯云 CentOS 7.6 服务器的 8000 端口进行访问。这样可以确保各个应用的隔离性和独立性,同时通过 /main 路由访问子应用。
相关文章:
简单搭建qiankun的主应用和子应用并且用Docker进行服务器部署
在node18环境下,用react18创建qiankun主应用和两个子应用,react路由用V6版本,都在/main路由下访问子应用,用Dockerfile部署到腾讯云CentOS7.6服务器的8000端口进行访问,且在部署过程中进行nginx配置以进行合理的路由访…...
等保三级安全架构设计方案
一、概述 等保三级,全称为“信息系统安全等级保护三级”,是根据信息安全保护的需求,将系统的安全保护划分为五个等级中的第三级,主要针对相对重要的信息系统进行保护。根据《信息系统安全等级保护基本要求》(GB/T 222…...
【Stable Diffusion】安装教程
目录 一、python 安装教程 二、windows cuda安装教程 三、Stable Diffusion下载 四、Stable Diffusion部署(重点) 一、python 安装教程 (1)第一步下载 打开python下载页面,找到python3.10.9,点击右边…...
05—如何设计和仿真阻抗匹配网络
如何设计和仿真阻抗匹配网络 1. 介绍 在设计电路时,大部分同学只是想把布局布置的更专业,可能没有考虑串扰、电源完整性或阻抗匹配等问题。当了解天线和其他射频设备的匹配网络后,才会意识到阻抗匹配在高速和高频电路中的重要性。 但是,什么时候应该使用阻抗匹配网络?哪…...
Trimble X12助力电力管廊数据采集,为机器人巡视系统提供精准导航支持
地下电缆是一个城市重要的基础设施,它不仅具有规模大、范围广、空间分布复杂等特点,更重要的是它还承担着信息传输、能源输送等与人们生活息息相关的重要功能,也是一个城市赖以生存和发展的物质基础。 01、项目概述 本次项目是对某区域2公里左…...
新质驱动·科东软件受邀出席2024智能网联+低空经济暨第二届湾区汽车T9+N闭门会议
为推进广东省加快发展新质生产力,贯彻落实“百县千镇万村高质量发展工程”,推动韶关市新丰县智能网联新能源汽车、低空经济与数字技术的创新与发展,充分发挥湾区汽车产业链头部企业的带动作用。韶关市指导、珠三角湾区智能网联新能源汽车产业…...
UE5_建立自己的资产库
资产库需要用到一个插件: UAsset Browser - 直接在当前项目预览其他UE项目资产(.uasset 文件) - 直接迁移其他UE项目资产到当前项目 - 不用另外打开资产项目查看资产,迁移资产(麻烦) 插件官网插件文档插…...
Matlab搜索路径添加不上
发现无论是右键文件夹添加到路径,还是在“设置路径”中专门添加,我的路径始终添加不上,导致代码运行始终报错,后来将路径中的“”加号去掉后,就添加成功了,经过测试,路径中含有中文也可以添加成…...
跨UI发送信号
如何自定义信号 1.使用signals声明 2.返回值是void 3.在需要发送的地方使用 emit 信号名字(参数); 进行发送 4.在需要链接的地方使用connect进行链4 接 signals:void sig_addOne(int value); connect(&dlg,&SetDialog::sig_addOne,[](int value){ui->lineEdit…...
宠物领养平台构建:SpringBoot技术路线图
摘 要 如今社会上各行各业,都在用属于自己专用的软件来进行工作,互联网发展到这个时候,人们已经发现离不开了互联网。互联网的发展,离不开一些新的技术,而新技术的产生往往是为了解决现有问题而产生的。针对于宠物领养…...
uniapp App端在renderjs层渲染echarts获取不到service层id的问题
报错信息:Cannot read properties of undefined (reading id) at app-view.js 这样的写法App端有时在renderjs视图层获取不到server逻辑层的数据 server层 renderjs层 解决方法:需要把数据(id)通过server层向renderjs层传值 server层 renderjs层...
标准输入输出函数scanf()/gets()/printf()/puts()的功能和区别
前言: 这两个函数都是用来从标准输入设备(通常是键盘)读取字符串的,但是它们有一些区别和注意事项。 scanf函数 scanf函数是C语言中的一个输入函数,它可以按照指定的格式从标准输入设备(通常是键盘&#…...
JavaScript 中的原型和原型链
JavaScript 中的原型和原型链也是一个相对较难理解透彻的知识点,下面结合详细例子来进行说明: 一、原型的概念 在 JavaScript 中,每个函数都有一个 prototype 属性,这个属性指向一个对象,这个对象就是所谓的 “原型对…...
tensorflow.python.framework.errors_impl.FailedPreconditionError
以下是我的报错 Traceback (most recent call last):File "e:\tool\anaconda\envs\openmmlab\lib\runpy.py", line 194, in _run_module_as_mainreturn _run_code(code, main_globals, None,File "e:\tool\anaconda\envs\openmmlab\lib\runpy.py", line 8…...
lua-cjson 例子
apt install -y lua-cjson 安装 编辑 tmp.lua cjson require "cjson" p 666 d "23.42" payload{"d":[{"pres":..(p)..,"temp":"..(d).."}]} print("payload " .. payload) j cjson.decode(payloa…...
《白帽子讲Web安全》15-16章
《白帽子讲Web安全》15-16章 《白帽子讲Web安全》15章15、Web Server配置安全15.1、Apache安全15.2、Nginx安全15.3、jBoss远程命令执行15.4、Tomcat远程命令执行15.5、HTTP Parameter Pollution15.6、小结 第四篇 互联网公司运营安全《白帽子讲Web安全》16章16、互联网业务安全…...
挑战用React封装100个组件【001】
项目地址 https://github.com/hismeyy/react-component-100 组件描述 组件适用于需要展示图文信息的场景,比如产品介绍、用户卡片或任何带有标题、描述和可选图片的内容展示 样式展示 代码展示 InfoCard.tsx import ./InfoCard.cssinterface InfoCardProps {ti…...
在 macOS 上安装 MongoDB Community Edition
https://www.mongodb.com/zh-cn/docs/manual/tutorial/install-mongodb-on-os-x/...
网络安全运行与维护高级 - 题库汇总百题
1. 单选题 内部信息安全管理组织中的()担负保护系统安全的责任,但工作重点偏向于监视系统的运行情况,并且对安全管理制度的贯彻执行情况进行监督和检查。 A. 安全审查和决策机构 B. 安全主管机构 C. 安全运行维护机构 D. 安全审计机构 正确答案:D 2. 单选题 下列那…...
在html页面显示一个变量,而这个变量中有xss脚本,如何安全的把这个变量原样展示出来
当你想要在HTML页面安全地展示一个可能包含XSS(跨站脚本攻击)脚本的变量原样内容时,可以通过以下几种常见的方式来实现安全展示: 方法一:使用文本节点 在JavaScript中,当你要将变量插入到HTML页面的某个元…...
【Linux】TCP网络编程
目录 V1_Echo_Server V2_Echo_Server多进程版本 V3_Echo_Server多线程版本 V3-1_多线程远程命令执行 V4_Echo_Server线程池版本 V1_Echo_Server TcpServer的上层调用如下,和UdpServer几乎一样: 而在InitServer中,大部分也和UDP那里一样&…...
openGauss你计算的表大小,有包含toast表么?
openGauss你计算的表大小,有包含toast表么? 最近有一个同事问我说“openGauss中pg_relation_size函数在计算表的大小时是否包含了大字段的大小?”,经过思考后,自己觉得表的大小是不包含大字段的大小的,然后…...
Python字典的用法(定义、增加、删除、修改、查询、遍历)
一.字典的介绍 dictionary(字典)是除了列表以外的 Python 中最灵活的数据类型。dict(字典)可以采用多个数据,通常用于存储描述一个物体的相关信息。 字典和列表最主要的区别是,字典是无序的对象集合&#x…...
分布式锁的实现原理
作者:来自 vivo 互联网服务器团队- Xu Yaoming 介绍分布式锁的实现原理。 一、分布式锁概述 分布式锁,顾名思义,就是在分布式环境下使用的锁。众所周知,在并发编程中,我们经常需要借助并发控制工具,如 mute…...
linux(centos) 环境部署,安装JDK,docker(mysql, redis,nginx,minio,nacos)
目录 1.安装JDK (非docker)1.1 将文件放在目录下: /usr/local/jdk1.2 解压至当前目录1.3 配置环境变量 2.安装docker2.1 验证centos内核2.2 安装软件工具包2.3 设置yum源2.4 查看仓库中所有docker版本,按需选择安装2.5 安装docker2.6 启动docker 并 开机…...
批量生成不同用户的pdf 文件(html样式)
技术 selenium thymeleaf itextpdf chromedriver 使用thymeleaf 将动态数据替换 使用selenium chromedriver 进行js ,css等逻辑运算后渲染视图 使用itextpdf 将html 转为pdf 文件 html模板 <!DOCTYPE html> <html xmlns:th"http://www.thymeleaf…...
常见的排序算法
一、基于比较的排序算法 基于比较的排序算法通过比较元素之间的大小来完成排序。 1.1 冒泡排序(Bubble Sort) 特点:通过多次交换相邻元素,将最大(或最小)元素“冒泡”到序列末端。时间复杂度:…...
从语法、功能、社区和使用场景来比较 Sass 和 LESS
一:可以从语法、功能、社区和使用场景来比较 Sass 和 LESS: 1:语法 原始的 Sass 采用的是缩进而不是大括号,后续的 Sass 版本与 LESS 一样使用与 CSS 类似的语法: address {.fa.fa-mobile-phone {margin: 0 3px 0 2…...
hdlbits系列verilog解答(Exams/m2014 q4b)-87
文章目录 一、问题描述二、verilog源码三、仿真结果一、问题描述 本节学习如何实现下图中的电路。 模块声明 module top_module ( input clk, input d, input ar, // asynchronous reset output q); 思路: 只是实现一种带异步复位的D触发器。 时钟边沿两种触发方式的关键字…...
Python 和 Pyecharts 对Taptap相关数据可视化分析
结果展示: 数据来源: Python爬取TapTap 热门游戏信息并存储到数据库(详细版) 目录 结果展示: 数据来源: Python爬取TapTap 热门游戏信息并存储到数据库(详细版 一、引言 二、准备工作 三、…...
系统学习算法: 专题二 滑动窗口
题目一: 算法原理: 依然第一反应是暴力枚举,将所有的子数组都枚举出来,找到满足条件的长度最小的子数组,但是需要两层循环,时间复杂度来到O(N^2) 接下来就该思考如何进行优化 如果…...
Docker的save和export命令的区别,load和import的区别 笔记241124
Docker的save和export命令的区别,load和import的区别 解说1: Docker的save和export命令,以及load和import命令,在功能和使用场景上存在显著的区别。以下是对这两组命令的详细对比和解释: Docker save和export命令的区别 使用方式和目的&am…...
cad中为什么不使用C0C1C2连续,而使用G0G1G2连续
在CAD中,之所以使用G0、G1、G2连续而不是C0、C1、C2连续,主要是因为G连续性更侧重于几何空间的连续性,与视觉感知和制造过程更为相关。 • G0连续:保证曲线或曲面在连接点处没有断开,即位置连续。这在CAD中非常重要&a…...
Linux:makefile的使用
makefile小结: makefile的应用: 一个简单的 Makefile 文件包含一系列的“规则”,其样式如下: 目标(target)…: 依赖(prerequiries)… 命令(command) 目标(target)通常是要生成的文件的名称,可以是可执行文件或OBJ文件…...
局域网的网络安全
网络安全 局域网基本上都采用以广播为技术基础的以太网,任何两个节点之间的通信数据包,不仅为这两个节点的网卡所接收,也同时为处在同一以太网上的任何一个节点的网卡所截取。因此,黑客只要接入以太网上的任一节点进行侦听&#…...
【Leetcode 每日一题 - 补卡】3235. 判断矩形的两个角落是否可达
问题背景 给你两个正整数 x C o r n e r xCorner xCorner 和 y C o r n e r yCorner yCorner 和一个二维整数数组 c i r c l e s circles circles,其中 c i r c l e s [ i ] [ x i , y i , r i ] circles[i] [x_i, y_i, r_i] circles[i][xi,yi,ri] 表示…...
Android Studio安装TalkX AI编程助手
文章目录 TalkX简介编程场景 TalkX安装TalkX编程使用ai编程助手相关文章 TalkX简介 TalkX是一款将OpenAI的GPT 3.5/4模型集成到IDE的AI编程插件。它免费提供特定场景的AI编程指导,帮助开发人员提高工作效率约38%,甚至在解决编程问题的效率上提升超过2倍…...
C++类型转换
C类型转换 1.C语言中的类型转换2.C强制类型转换2.1.static_cast2.2.reinterpret_cast2.3.const_cast2.4.dynamic_cast 3.RTTI 🌟🌟hello,各位读者大大们你们好呀🌟🌟 🚀🚀系列专栏:【…...
241127学习日志——[CSDIY] [InternStudio] 大模型训练营 [20]
CSDIY:这是一个非科班学生的努力之路,从今天开始这个系列会长期更新,(最好做到日更),我会慢慢把自己目前对CS的努力逐一上传,帮助那些和我一样有着梦想的玩家取得胜利!!&…...
关于函数式接口和编程的解析和案例实战
文章目录 匿名内部类“匿名”在哪里 函数式编程lambda表达式的条件Supplier使用示例 ConsumeracceptandThen使用场景 FunctionalBiFunctionalTriFunctional 匿名内部类 匿名内部类的学习和使用是实现lambda表达式和函数式编程的基础。是想一下,我们在使用接口中的方…...
基于米尔全志T527开发板的FacenetPytorch人脸识别方案
本篇测评由优秀测评者“小火苗”提供。 本文将介绍基于米尔电子MYD-LT527开发板(米尔基于全志 T527开发板)的FacenetPytorch人脸识别方案测试。 一、facenet_pytorch算法实现人脸识别 深度神经网络 1.简介 Facenet-PyTorch 是一个基于 PyTorch 框架实…...
Java基础面试题11:简述System.gc()和Runtime.gc()的作用?
System.gc() 和 Runtime.gc() 是 Java 中用于提示 JVM(Java 虚拟机)进行垃圾回收的两个方法。它们的作用类似,但也有一些细微的区别。下面我们来详细说明。 System.gc() 和 Runtime.gc() 的区别 简单来说,System.gc() 等同于 Run…...
物料理解笔记·蓝白段子线·端子线座子焊接反了怎么处理!!!
目录 蓝白端子排线 端子线座子焊接错了怎么办 端子线如何拆线 编写不易,请勿搬运,仅供学习,感谢理解 蓝白端子排线 蓝白端子排线,这种端子线常用与编码电机的接线,或者在板子上通过提供段子线的接口,通…...
string接口模拟实现2
文章目录 浅拷贝insert插入一个字符insert插入一个字符串删除erasefind(查找一个字符)\\\\\\\find(查找一个字符串:子串substr)查找的练习(网址)赋值operator比较大小 浅拷贝 //浅拷贝string::string(const string& str){//开一样大的空间࿰…...
第 42 章 - Go语言 设计模式
在Go语言中,设计模式是一种被广泛接受的解决常见问题的最佳实践。这些模式可以分为三类:创建型模式、结构型模式和行为型模式。下面我将结合案例以及源代码对这三种类型的设计模式进行详细讲解。 创建型模式 创建型模式主要关注对象的创建过程…...
使用redis-plus-plus库连接redis
使用redis-plus-plus库连接redis 一、安装redis-plus-plus1.1安装hiredis1.2编译安装redis-plus-plus 二、redis的连接使用2.1创建redis对象2.2向redis中添加元素2.3判断元素是否存在2.4获取元素2.5设置获取过期时间2.6获取类型2.7 删除当前数据库 一、安装redis-plus-plus C …...
qt QGraphicsRotation详解
1、概述 QGraphicsRotation 是 Qt 框架中 QGraphicsTransform 的一个子类,它专门用于处理图形项的旋转变换。通过 QGraphicsRotation,你可以对 QGraphicsItem(如形状、图片等)进行旋转操作,从而创建动态和吸引人的视觉…...
嵌入式Qt使用ffmpeg视频开发记录
在此记录一下Qt下视频应用开发的自学历程,可供初学者参考和避雷。 了解常用音频格式yuv420p、h264等了解QML,了解QVideoOutput类的使用,实现播放yuv420p流参考ffmpeg官方例程,调用解码器实现h264解码播放 不需要手动分帧。ffmpeg…...
《String类》
目录 一、定义与概述 二、创建字符串对象 2.1 直接赋值 2.2 使用构造函数 三、字符串的不可变性 四、常用方法 4.1 String对象的比较 4.1.1 比较是否引用同一个对象 4.1.2 boolean equals(Object anObject)方法:按照字典序比较 4.1.3 int compareTo(Strin…...
Java—Properties类
Properties类是Java中用于处理属性文件(.properties文件)的类。属性文件是一种简单的文本文件,用于存储键值对数据,常用于保存配置信息。 Properties类继承自Hashtable类,它的键和值都是字符串类型。它提供了一些方法…...