行业动态

澎峰科技(PerfXLab),核心团队来自中科院,致力于计算软件栈技术的研发,聚集HPC、AI、RISC-V三大领域。 国际领先的加速计算机技术解决方案商,赋能计算芯片、科学计算和高性能计算应用软件企业。澎峰科技在高性能计算领域有着上十年的技术沉淀,致力于算力基础软件研发。即使是在计算技术体系被国际巨头所把持的时代,仍坚持进行底层和基础技术的软件研发,因为我们坚信中国必须构建自主可控的计算技术体系,计算硬件技术和算力基础软件是新一代信息技术的基础建设。今天,我们厚积薄发,正在积极与各大国产计算硬件伙伴携手迎接新一代计算技术的挑战。

RISC-V公测平台发布 · 在SG2042上玩转docker

实验介绍:

Docker 是一个开源的应用容器引擎,基于Go语言并遵从Apache2.0协议开源。可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化。容器完全使用沙箱机制,相互之间不会有任何接口(类似iPhone的app),更重要的是容器性能开销极低。Docker 从 17.03 版本之后分为 CE(Community Edition: 社区版)和 EE(Enterprise Edition: 企业版)。在此次教程中,我们只要使用社区版即可。

实验材料:

HS-2服务器一台

服务器配置:

CPU:SG2042

内存:128GB

操作系统:Ubuntu 22.10 (GNU/Linux 6.1.31 riscv64)

实验步骤:

安装docker: sudo apt install docker.io 接下来拉取一个Ubuntu镜像(我这里使用的是22.04的镜像): sudo docker pull riscv64/ubuntu:22.04 新建一个测试用的容器并启动: sudo docker run --name ubuntu -itd riscv64/ubuntu:22.04 sudo docker start ubuntu 查看容器状态: sudo docker ps

访问该容器中的shell: sudo docker exec -it ubuntu /bin/bash

由于目前docker绝大多数的包都只支持x86和ARM架构,而支持RISC-V的容器非常少,要了解所有支持riscv64的容器,可以参考Docker Hub上的riscvV64专区,在这篇文章中我们就直接新建一个Ubuntu 20.04镜像来运行两个服务:Flask和Nginx。

新建一个名叫ubuntu-web的容器,但是开放并转发两个端口(5000转5050,80转8008),并创建共享文件夹(便于将静态网站传入容器内): sudo docker run -p 5050:5000 -p 8008:80 -v /home/sputnik/ubuntu_web_share:/root --name ubuntu-web -itd riscv64/ubuntu:22.04

启动容器: sudo docker start ubuntu-web

进入容器: sudo docker exec -it ubuntu-web /bin/bash

进入容器中的home目录然后更新库: 先将系统升级到完整版(如果嫌官方Ubuntu Ports镜像下载速度慢的话可以参考清华大学Tuna镜像站上的教程,但是需要先要更新apt缓存才能安装vim和ca-certificates,然后才能按照镜像站上的教程操作,当然其他国内镜像站也行,只要有Ubuntu Ports镜像就行) unminimize

安装所需的软件包(如果之前没有安装vim,需要在后面加上vim): apt install python3 python3-pip libpython3-dev libffi-dev unzip

使用Tuna PyPi源: pip config set global.index-url https://pypi.tuna.tsinghua.edu.cn/simple

安装Flask及其他必备组件: pip install flask gevent flask-cors

新建一个app.py文件,编写以下代码: from flask import Flask import platform app = Flask(name) @app.route('/') def hello_world(): return "Greeting from a container({} {} {})!".format(platform.uname()[0],platform.uname()[2],platform.uname()[-1]) if name == 'main': app.run(host="0.0.0.0", port=5000)

保存并运行: python3 app.py

访问[你的ip地址]:[你的flask端口号]即可看到以下内容:

接下来我们来搭建一个简易网站,该网站采用Vue.js+Nginx+Flask组合。 首先我们安装Nginx: apt install nginx

启动Nginx服务: service nginx start

访问[服务器地址]:[你的Nginx端口号]:

接下来咱们就写一个简单的网站,这次我们使用Vite来构建(使用cnpm会更快): cnpm create vite@latest cd riscv-site cnpm install

测试一下: cnpm run dev

接下来就是参考Vite或Vue文档来编写前端内容(内容自定,也可以直接修改Vite官方例子)如果直接使用Axios发起请求,这时就会提示因CORS限制拒绝访问。 先引入flask_cors中的CORS: from flask_cors import CORS

然后在app.py中的“app = Flask(name)”下添加下列两行代码: CORS(app, resources={"/": {"origins": "http://"}}) CORS(app, resources={"/": {"origins": "https://"}})

剩下的可根据需要自行修改,也可以参考下面的代码。 最终代码如下(Flask): from flask import Flask from flask_cors import CORS import platform from gevent import pywsgi app = Flask(name) CORS(app, resources={"/": {"origins": "http://"}}) CORS(app, resources={"/": {"origins": "https://"}}) @app.route('/') def hello_world(): return "Greeting from {} ({} {})!".format(platform.uname()[0],platform.uname()[2],platform.uname()[-1]) if name == 'main': server = pywsgi.WSGIServer(('0.0.0.0',5000), app) server.serve_forever() # app.run()

注意:可以搭配pywsgi使用以用于生产环境。 前端部分(Vue.js)代码如下:

App.vue
<script setup>
import axios from 'axios'
import { ref } from 'vue';
import HelloWorld from './components/HelloWorld.vue'
let text = ref("")
const show_text = async () => {
try {
const response = await axios.get("[你的Flask服务器地址]");
console.log(response.data)
text.value = response.data
} catch (error) {
console.error(error);
}
}
show_text()
</script>
<template>
<div>
<a href="https://riscv.org" target="_blank">
<img src="./assets/RISC-V_Stacked_Color.svg" class="logo" alt="Vite logo" />
</a>
<a href="https://vuejs.org/" target="_blank">
<img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
</a>
</div>
<HelloWorld :msg="text" />
</template>
<style scoped>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
}
.logo:hover {
filter: drop-shadow(0 0 2em #003262);
}
.logo.vue:hover {
filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
HelloWorld.vue
<script setup>
import { ref } from 'vue'
defineProps({
msg: String,
})
const count = ref(0)
</script>
<template>
<h1>{{ msg }}</h1>
<p>
Check out
<a href="http://blog.rvv.top:8002/"
>RISC-V Growth Diary</a
> for further information
</p>
<p class="read-the-docs">Click on the RISC-V and Vue logos to learn more</p>
</template>
<style scoped>
.read-the-docs {
color: #888;
}
</style>

注意:在Vite项目中,可以根据自身需求安装其他npm包(如Echarts,Element+等) 接下来就是将网站部署到Web容器中。 首先,我们将Vite项目打包成静态文件:

cnpm run build

打包成功后会出现以下内容:

会出现一个dist文件夹。 打包dist文件夹并上传到服务器,然后将dist.zip传进服务器上的共享文件夹内: sudo cp dist.zip ./ubuntu_web_share/ 清空/var/www/html/下的内容: rm -rf /var/www/html/ 将dist文件夹下的内容全部复制到/var/www/html/下: cp -R ./ /var/www/html/ 浏览器访问[服务器地址]:[NGINX服务器端口]:

实验总结: 通过此次试验,我们快速上手了Docker,得益于Docker的沙箱机制,我们可以在不影响宿主机的环境下配置独立的开发环境,然后打包成镜像以便部署到生产环境中。 同时,使用Vite,可以更方便地调试Vue.js网站,并且还支持打包生成静态文件以便部署到Nginx服务器或Github Pages上。 参考资料: https://hub.docker.com/u/riscv64/ https://mirror.tuna.tsinghua.edu.cn/help/ubuntu-ports/ https://juejin.cn/post/7220696133730811960 https://blog.csdn.net/dreamerrrrrr/article/details/107030289

澎峰科技

澎峰科技(PerfXLab),核心团队来自中科院,致力于计算软件栈技术的研发,聚集HPC、AI、RISC-V三大领域。 国际领先的加速计算机技术解决方案商,赋能计算芯片、科学计算和高性能计算应用软件企业。


地址


北京·海淀·紫雀路55号院9号楼
长沙·岳麓区·德必 511室

邮箱


info@perfxlab.com

电话


010-62600621