個人搭建小網站教程(云服務器Ubuntu版本)

目錄

1.配置云服務器(略講)

2.vscode連接(ssh連接)

3.本地壓縮項目包

4.傳輸項目

5.配置項目依賴

6.運行項目

1.啟動 FastAPI 后端(Python 部分)

2.啟動 Next.js 前端(Node.js 部分)

3.本地電腦訪問項目

7.域名解析(要備案)

域名解析所需條件

操作流程

注意事項

8.部署項目

第一步:檢查Nginx

第二步:配置nginx

第三步:(按i進入編輯模式)

第四步:(激活配置文件)

第五步:(重啟Nginx)


1.配置云服務器(略講)

擁有自己的云服務器和域名

推薦阿里云和騰訊云

以阿里云為例,先創建密鑰對,然后配置服務器。

新手默認選擇ecs-user用戶,除非特別了解自己在做什么,不然這個最安全。

2.vscode連接(ssh連接)

記得自己的服務器公網ip密鑰位置

本地計算機安裝了vscode之后,然后下載這個插件Remote - SSH

接著打開小電腦

右鍵SSH,打開config配置,新手用上面那個配置,針對個人。

以下是用戶級配置文件與系統級配置文件的對比表格:

對比維度用戶級配置文件(C:\Users\34970\.ssh\config系統級配置文件(C:\ProgramData\ssh\ssh_config
作用范圍僅對當前用戶(34970賬戶)生效,不影響其他用戶的 SSH 連接設置對計算機上所有用戶生效,所有用戶的 SSH 連接都會受其配置影響
權限要求當前用戶擁有完全讀寫權限,無需管理員權限即可修改需管理員權限才能修改,普通用戶默認無修改權限
默認存在性系統不自動創建,需用戶手動創建或通過工具(如 VS Code)自動生成安裝 OpenSSH 組件時可能自動生成,包含默認全局配置項
配置優先級優先級更高,若與系統級配置沖突,會覆蓋系統級配置中的對應項優先級較低,僅在用戶級配置中無對應設置時生效
適用場景個人化連接需求(如特定服務器的用戶名、密鑰、端口等個性化配置)全局通用配置(如所有用戶的統一代理、超時時間等公共設置)
修改風險誤操作僅影響當前用戶,風險范圍小誤操作可能導致所有用戶連接異常,風險范圍大

然后點擊箭頭在當前窗口連接,如果之前連結果,那么第二次連接主機保存密鑰會改變,要清空一下主機記錄。

本地終端輸入ssh-keygen -R 云服務器公網ip

接著再進行連接,他會給云服務器下載vscode配置,然后連接成功進入云服務器頁面。

3.本地壓縮項目包

由于項目里面存在許多依賴,所以安裝7zip,只壓縮項目本身文件集。

:: 進入項目根目錄(假設項目在 C:\Users\34970\Desktop\partjava)
cd C:\Users\34970\Desktop\partjava

:: 執行 7-Zip 壓縮(使用你的 7z.exe 路徑)

"C:\Program Files\7-Zip\7z.exe" a -tzip ../partjava.zip . -xr!node_modules (根據個人情況看哪些不要)

進入項目終端,壓縮除依賴部分到項目所處主目錄。壓縮之后就剩下主文件。

左邊是項目文件夾,右邊是壓縮包。

4.傳輸項目

把項目傳到服務器,在主頁創建文件夾傳到文件夾內。

scp "本地壓縮包位置" ecs-user@公網ip:/home/ecs-user/i/

打開本地終端傳遞。

傳輸成功后,在云服務器下載unzip

可以先更新一下sudo apt update

sudo apt install unzip安裝unzip

到壓縮包指定位置cd /home/ecs-user/i? 輸入ls看看是不是指定位置

解壓文件到當前文件夾unzip partjava.zip

5.配置項目依賴

由于我項目包含了vue3和python,所以我得安裝node.js和npm(或者yarn)以及python3 python3-pip

# 安裝 Node.js 18(長期支持版)
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt install -y nodejs

輸入npm -v以及node -v

開始安裝vue3依賴npm install

開始安裝python依賴,進入python項目文件,然后看看有沒有python環境,一般Ubuntu是有python3環境的,python3 -v?pip3 -v

python3 -version輸出版本號

先進python項目文件夾

開始下載python依賴庫(看看python版本安裝對應虛擬環境sudo apt install python3.10-venv)

1.創建虛擬環境:python3 -m venv venv

2.激活虛擬環境(Linux):source venv/bin/activate

3.下載庫:pip3 install -r requirements.txt

6.運行項目

1.啟動 FastAPI 后端(Python 部分)

進入項目根目錄(確保在 partjava-ai 目錄下):
cd ~/i/partjava-ai ?# 替換為你的實際路徑
激活虛擬環境(已創建并安裝依賴的前提下):
source venv/bin/activate ?# Linux/Mac 系統,終端會顯示 (venv)
啟動 FastAPI 服務(關鍵:綁定公網訪問):
uvicorn main:app --host 0.0.0.0 --port 8000
main:app:表示運行 main.py 中的 app 實例(FastAPI 應用入口)。
--host 0.0.0.0:允許外部(包括你的本地電腦)訪問服務器上的后端。
--port 8000:指定后端運行在 8000 端口(可自定義,需與前端調用一致)。
啟動成功后,終端會顯示:Uvicorn running on http://0.0.0.0:8000。

2.啟動 Next.js 前端(Node.js 部分)

打開新終端(避免與后端終端沖突,VS Code 中可點擊終端右上角 + 號新建)。
進入前端目錄(通常是項目根目錄,包含 package.json):
cd ~/i ?# 替換為前端代碼所在路徑
啟動前端開發服務器:
npm run dev ?# 或 yarn dev(根據項目依賴管理工具選擇)
啟動成功后,終端會顯示:Local: http://localhost:3000。

3.本地電腦訪問項目

端口轉發(通過 VS Code 實現本地 ? 云服務器通信):
按 Ctrl+Shift+P 打開命令面板,輸入 Ports: Show Ports 調出端口視圖。
分別轉發兩個端口:
后端端口:輸入 8000 → 轉發后本地可通過 http://localhost:8000 訪問后端。
前端端口:輸入 3000 → 轉發后本地可通過 http://localhost:3000 訪問前端。

在本地瀏覽器查看:
訪問 http://localhost:3000 → 看到前端頁面(Next.js 應用)。
前端會自動調用后端 API(若代碼中已配置 http://localhost:8000 作為后端地址),實現全棧交互。

7.域名解析(要備案)

域名解析所需條件

域名注冊
需要擁有一個已注冊的有效域名,域名需通過ICANN認證的注冊商購買(如GoDaddy、阿里云等)。

DNS服務器
需配置權威DNS服務器(如Cloudflare、AWS Route 53)或使用注冊商提供的免費DNS服務。DNS服務器負責存儲域名對應的解析記錄。

解析記錄類型
根據需求添加以下常見記錄:

  • A記錄:將域名指向IPv4地址。
  • AAAA記錄:將域名指向IPv6地址。
  • CNAME記錄:將域名別名指向另一個域名。
  • MX記錄:指定郵件服務器地址。
  • TXT記錄:用于驗證或SPF配置。

操作流程

配置DNS解析

  1. 登錄域名注冊商或DNS服務商的管理后臺。
  2. 進入域名解析設置頁面,添加或修改解析記錄。
  3. 保存變更,等待全球DNS緩存刷新(通常需10分鐘至48小時)。

驗證解析生效
使用以下工具檢查解析是否正確:

  • 命令行:nslookup example.comdig example.com
  • 在線工具:DNSChecker、WhatsMyDNS。

注意事項

  • 確保域名未過期且狀態正常(無鎖定或暫停)。
  • 多層緩存可能導致延遲,修改記錄后需耐心等待。
  • 復雜場景(如CDN、負載均衡)需結合CNAME或NS記錄配置。

8.部署項目

可以先ctrl+c暫停前端,然后配置Nginx。

也可以不暫停,新建一個終端。

第一步:檢查Nginx

# 檢查是否安裝
nginx -v

# 未安裝則執行(Debian/Ubuntu)
sudo apt update && sudo apt install nginx -y

# 或(CentOS/RHEL)
yum install nginx -y

第二步:配置nginx

# 進入配置目錄 cd /etc/nginx/sites-available/

# 創建并編輯配置文件(用你的域名命名,如 example.com)

sudo vim example.com

第三步:(按i進入編輯模式)

server { # 監聽 80 端口(HTTP) listen 80;

# 填寫你的域名(如 example.com 或 www.example.com)

server_name example.com www.example.com;

# 前端項目:將域名根路徑代理到前端服務(3000 端口)

location / { proxy_pass http://localhost:3000; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; }

# 后端 API:將 /api 開頭的請求代理到后端服務(8000 端口)

location /api { proxy_pass http://localhost:8000; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; } }

保存配置(按 Esc 后輸入 :wq 回車)

第四步:(激活配置文件)

刪除默認配置的軟鏈接(關鍵!)
sudo rm /etc/nginx/sites-enabled/default

# 創建軟鏈接到生效目錄

sudo ln -s /etc/nginx/sites-available/example.com /etc/nginx/sites-enabled/

檢查配置是否有誤

sudo nginx -t

第五步:(重啟Nginx)

sudo systemctl restart nginx

然后瀏覽器訪問域名就ok了。

9.云服務器后臺持續進程

# 安裝 pm2(全局) npm install -g pm2

兩個終端:

# 啟動前端(后臺持久化)cd /home/ecs-user/

pm2 start npm --name "frontend" -- run dev

# 啟動后端(后臺持久化)

pm2 start "uvicorn main:app --host 0.0.0.0 --port 8000" --name "backend"

# 重啟運行Nginx

sudo systemctl restart nginx

10.數據庫擴展

Ubuntu 系統
更新軟件包列表:

打開終端,執行以下命令,確保軟件包列表是最新的:
sudo apt update

安裝 MySQL 服務器:
執行命令安裝 MySQL 軟件包:
sudo apt install mysql-server

配置 MySQL(可選):
安裝完成后,可以使用 mysql_secure_installation 腳本進行一些安全配置,如設置 root 用戶密碼、刪除匿名用戶、禁止 root 遠程登錄等:
sudo mysql_secure_installation
按照提示輸入密碼并選擇相應的操作即可。
驗證安裝:
通過以下命令檢查 MySQL 服務是否正在運行:
sudo systemctl status mysql
如果服務狀態顯示為 active (running),表示安裝成功。可以使用 mysql 命令進入 MySQL 命令行客戶端,驗證能否正常登錄和操作數據庫:
sudo mysql -u root -p
輸入密碼后回車進入。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/96745.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/96745.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/96745.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

pion/webrtc v4.1.4 版本發布:關鍵特性與性能優化全面解析

引言 實時通信技術在現代互聯網應用中扮演著越來越重要的角色,從視頻會議到在線教育,從遠程醫療到物聯網設備交互,WebRTC技術已經成為實時音視頻通信的事實標準。作為Go語言中最成熟且廣泛使用的WebRTC實現,pion/webrtc項目持續推…

集成算法(聚類)

下面簡單集成算法代碼from sklearn.datasets import make_blobs from sklearn.cluster import KMeans import matplotlib.pyplot as plt# 創建數據集,生成 3 個中心的聚類數據,共 300 個樣本,每個樣本 2 個特征 X, _ make_blobs(n_samples30…

01 網絡信息內容安全--緒論

1 課程內容 網絡信息內容獲取技術網絡信息內容預處理技術網絡信息內容過濾技術社會網絡分析技術入侵檢測技術異常流量檢測技術對抗攻擊技術 2 理論研討 分為16個組 2.1 網絡信息內容獲取技術:第1組 【用DeepSeek網站爬蟲,數據獲取零成本&#xff01…

GPT-5:天變了嗎?還是風停了?

2025年8月8日,OpenAI 發布了 GPT-5。這次更新被許多人寄予厚望,也引發了不少爭議。對普通用戶來說,這是一場“又快又會做事”的智能盛宴;而對資深開發者和 AI 研究者而言,GPT-5 可能更像是一次不夠激進、略顯保守的版本…

生信分析自學攻略 | R語言數據篩選和修改

在《生信小白自學攻略》系列的前幾篇文章中,我們已經了解了 R 和 RStudio 的安裝、RStudio 的深度探索,以及 R 語言的基本數據類型和數據結構。現在,是時候深入探討如何運用 R 語言對數據進行精細化處理了。本篇推文將詳細介紹如何在 R 中對數…

從零開始學習概念物理(第13版)(1)

前言:對我來說,最有用的就是物理了,尤其是電磁學。但是要學好它,我得夯實我的基礎,前面更加基礎的數學和物理都不能拉下。現在我問了Deepseek推薦的國外物理書,這本《概念物理》是最適合我,等入…

CSS變量

元素背景需要統一,一個個設置修改起來很麻煩,也沒有全局變量? CSS中的變量_css變量-CSDN博客 -- 前綴定義變量,var(--) 使用變量,:root 表示根元素。 :root { --bg:#222; --fg:#bbb; } body { background:var(--bg)…

C++(Qt)軟件調試---vscode配置clang-tidy靜態分析(30)

C(Qt)軟件調試—vscode配置clang-tidy靜態分析(30) 文章目錄C(Qt)軟件調試---vscode配置clang-tidy靜態分析(30)[toc]1 概述2 clang-tidy基本用法3 目前已有檢查項4 vscode配置clang-tidy5 .clang-tidy配置文件6 參考地址更多精彩…

每天自動備份oracle

oracle數據庫比其他數據庫都貴,但是自帶的管理工具卻很差,真不知道咋想的。想完成每天自動備份,只能自己動手(window環境):1、創建個備份目錄,如D:\databack2、創建個腳本:backup.bat核心內容如下&#xff…

HBase Coprocessor:擴展HBase功能的利器

HBase Coprocessor:擴展HBase功能的利器 關鍵詞:HBase, Coprocessor, 協處理器, RegionServer, 分布式計算, 擴展功能, 二級索引 摘要:HBase作為Hadoop生態中的分布式列存儲數據庫,以高可靠性、高吞吐量和強一致性著稱&#xff0c…

【Java后端】Spring Boot 實現請求設備來源統計與UA解析全攻略

Spring Boot 實現請求設備來源統計與UA解析全攻略 在 Web 應用的實際場景中,我們經常需要知道 請求來自哪里 —— 是 Android 手機?還是 iOS?或者是 PC 瀏覽器? 這類信息往往可以通過 User-Agent (UA) 來統計,進而幫助…

技術框架搭建:支撐競拍全流程

純競拍的技術框架是一個多層協同的系統,從用戶交互到數據處理,每個環節都有專門的技術組件提供支持。?前端層是用戶與競拍系統交互的窗口,核心目標是提供流暢、實時、直觀的操作體驗。采用 React、Vue 等主流前端框架構建單頁應用&#xff0…

2025.8.18-2025.8.24第34周:有內耗有掙扎

🌟 本周完成的3件亮點事情(可具體寫過程): openvla debug起來了把上周的演講視頻發給了導師,人家幫我提了很多建議。羅永浩,李想4小時訪談看完了即興演講開始不內耗,直接講,這樣才能…

點播視頻預覽是怎么做到的?

看進度條上的小窗口,你有沒有想過,嗶哩嗶哩是如何在進度條上顯示視頻預覽的? 這個功能非常有用,尤其是在播放長視頻時。 如何才能實現? 實現這一點有三種方法。 預先為視頻生成 CSS sprites,并通過 API 獲取預先為視頻生成 W…

prometheus監控kubernetes集群并使用 grafana展示數據

目錄 Prometheus組成及架構 prometheus核心組件 1.Prometheus Server 2.Exporters 3.Alertmanager 4.Pushgateway 數據流程 在k8s中部署PrometheusGrafana釘釘告警郵件告警 將kube-Prometheus包下載后傳入虛擬機 tar -xzv kube-promethus.zip cd 進入 ll 顯示目錄 …

K8s 實戰:Pod 版本更新回滾 + 生命周期管控

一、版本更新與回滾實驗背景本實驗通過 Kubernetes 的 Deployment 資源演示應用的版本更新與回滾流程。Deployment 是 Kubernetes 中用于管理 Pod 和 ReplicaSet 的核心資源,支持滾動更新(避免服務中斷)和版本回滾(應對更新故障&a…

靜電服漏檢率↓79%!陌訊多模態識別算法在智慧安檢的實戰解析

?原創聲明??:本文技術方案引自《陌訊視覺算法技術白皮書V3.1》,實測數據來自工業場景部署驗證 一、行業痛點:靜電防護失效的隱形風險 據《電子制造業安防報告2025》統計,精密電子車間因靜電服穿戴不規范導致的次品率高達23%&a…

StarRocks不能啟動 ,StarRocksFe節點不能啟動問題 處理

StarRocks不能啟動 ,StarRocksFe節點不能啟動問題 處理 問題描述 mysql:[Warning] Using a passwordon the command line interface can be insecureERROR 2003 (HYa00): Can’t connect to MysoL server on ‘192.168.5.128:9030’(111)Error: failed to query fE…

麒麟系統播放圖片 速度比較

pygame效果比opencv好,opencv有鋸齒:import pygame import os import timedef show_image_sdl(image_path):"""使用SDL2快速顯示圖片"""# 初始化pygamepygame.init()# 獲取屏幕信息info pygame.display.Info()screen_wid…

復雜場景橫幅識別準確率↑91%!陌訊多模態融合算法在智慧園區的實戰解析

一、行業痛點:園區違規橫幅識別的三重挑戰 據《2024智慧園區安防報告》(來源:CCSA TC10)統計: ??強光干擾??:玻璃幕墻反光導致文字識別錯誤率超50% ??形變干擾??:橫幅褶皺、飄動造成關…