1.準備

服務器: 騰訊云主機(Centos 7.1)

http://www.qcloud.com/

項目:aspnetcore+angular2開源項目模版

https://www.npmjs.com/package/generator-aspnetcore-angular2

該項目使用webpack 打包Angular2, 內網涉及到npm請使用tnpm

2.環境安裝

(1)安裝dotnetcore

https://www.microsoft.com/net/core#linuxcentos

根據官方指導進行安裝;

官網給出的安裝引導是安裝dotnet core 1.1 ,但是我們項目使用的dotnetcore 1.0.1

所以必須再安裝1.0.1 (備注dotnet core 可以多個版本并存)

curl -sSL -o dotnet.tar.gz https://go.microsoft.com/fwlink/?LinkID=827529tar zxf dotnet.tar.gz -C /opt/dotnet

?(下載的地址不一樣)

(2)禁用防火墻

systemctl stop firewalld.service #停止firewallsystemctl disable firewalld.service #禁止firewall開機啟動

?由于是學習項目,可以先關閉防火墻, 生成環境請配置防火墻iptable

(3)安裝Nginx

　yum install nginxsystemctl start nginx

?使用命令行測試 curl http://127.0.0.1 ?能訪問到html內容則正常

3.項目構建

(1)構建項目

在windows環境 構建 ?指引 參考?https://www.npmjs.com/package/generator-aspnetcore-angular2

npm如果訪問問題可以使用tnpm (http://tnpm.oa.com/)

npm install -g yonpm install -g generator-aspnetcore-angular2

?創建項目

選擇高級模版

取消npm 安裝 使用 tnpm?

編譯項目

編譯dotnet ,編譯angular2

dotnet 程序集restore,webpack 打包Angular2 ,本地運行項目

有興趣的同學可以多了解快命令具體做了啥

本地訪問

http://localhost:3000/

4.部署項目

(1)執行發布腳本

dotnet publish

?該命令會執行project.json 的構建命令

"scripts": {
"prepublish": [ "npm install", "npm run rebuild-sass", "npm run build" ],
"postpublish": [ "dotnet publish-iis --publish-folder %publish:OutputPath% --framework %publish:FullTargetFramework%" ]
}

(2)壓縮生成文件

目錄:

\test\src\test\bin\Debug\netcoreapp1.0\publish

壓縮成zip ?,稍后上傳到linux進行部署

(3)上傳項目

使用ftp工具上傳只centos ?(我使用的xshell+xftp)

解壓文件: unzip test.zip

(4)啟動項目

set ASPNETCORE_ENVIRONMENT=Developmentdotnet test.dll server.urls=http://127.0.0.1:3000/

?(備注 此處沒有使用localhost ,是因為ip6 下bind錯誤 )

已經監聽了?

(5)測試

發現上面雖然打開了我們的頁面其實是爆了一個錯誤

需要修改?Views\Home\Index.cshtml 文件

<app-root asp-prerender-module="wwwroot/src/server"
asp-prerender-webpack-config="webpack.config.js">Loading...</app-root>

?去掉如下代碼

?asp-prerender-module="wwwroot/src/server" asp-prerender-webpack-config="webpack.config.js"

curl ?測試html正常

(6)配置代理

3000端口不適合暴露外網, 配置Nginx 反向代理

vim /etc/nginx/nginx.conf

?

添加 cgi

proxy_pass http://127.0.0.1:3000;
? proxy_http_version 1.1; ? ? ?
?proxy_set_header Upgrade $http_upgrade; ? ?
?proxy_set_header Connection keep-alive; ? ? ?
?proxy_set_header Host $host; ? ? ?
?proxy_cache_bypass $http_upgrade; ? ?
?proxy_set_header X-Real-IP $remote_addr; ? ?
?proxy_set_header REMOTE-HOST $remote_addr; ?
?proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

?檢查nginx配置

重啟nginx

/usr/sbin/nginx -t service nginx restart#獲取使用reloadnginx -s reload

?

(7)查看成果

使用外網ip訪問站點, 直接訪問80端口就好了

5.其他

該項目目前只是用于學習dotnetcore ,Angular2 , 順便熟悉一下 npm,webpack,linux ;

原文地址： https://www.qcloud.com/community/article/239

---

.NET社區新聞，深度好文，微信中搜索dotNET跨平臺或掃描二維碼關注

贊賞

人贊賞

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的centos 7 部署 dotnetcore+Angular2 实践的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。