81.go + vue實(shí)現(xiàn)web應(yīng)用程序

前端框架越來(lái)越豐富，前后端分離已經(jīng)是大多數(shù)軟件團(tuán)隊(duì)采取的模式了。vue使用的場(chǎng)景也越來(lái)越多。

創(chuàng)新互聯(lián)建站專注于企業(yè)全網(wǎng)整合營(yíng)銷推廣、網(wǎng)站重做改版、大竹網(wǎng)站定制設(shè)計(jì)、自適應(yīng)品牌網(wǎng)站建設(shè)、H5網(wǎng)站設(shè)計(jì)、購(gòu)物商城網(wǎng)站建設(shè)、集團(tuán)公司官網(wǎng)建設(shè)、成都外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)等建站業(yè)務(wù)，價(jià)格優(yōu)惠性價(jià)比高，為大竹等各大城市提供網(wǎng)站開發(fā)制作服務(wù)。

go本來(lái)使用template模板來(lái)進(jìn)行前端的表現(xiàn)，現(xiàn)在可以用vue來(lái)分擔(dān)很大一部分工作了。

通常直接使用go語(yǔ)言寫后端，然后使用靜態(tài)模板加載渲染前端，前端獲取后端提供的數(shù)據(jù)是使用{{ }}符號(hào)，2個(gè)套在一起的花括號(hào)。這個(gè)也是vue使用的數(shù)據(jù)表現(xiàn)方式。

如果go+vue來(lái)協(xié)同工作的話，需要對(duì)vue進(jìn)行一點(diǎn)設(shè)置。比如把{{ }}的方式改為[[ ]]的方式。

首先我們要知道，vue的使用，需要在頁(yè)面中加載vue.js或vue.min.js

純靜態(tài)網(wǎng)頁(yè)使用vue是這樣的（給個(gè)html例子）

然后我們實(shí)現(xiàn)一個(gè)go的簡(jiǎn)單web服務(wù)和模板頁(yè)面

這個(gè)go服務(wù)器通過(guò)端口 1989 展示服務(wù)器頁(yè)面，提供了一個(gè)靜態(tài)文件路徑 htmlpage，我們把vue.js和index.html文件都放置在htmlpage路徑里。

go服務(wù)器還用模板給前臺(tái)頁(yè)面提供了一個(gè)News結(jié)構(gòu)的數(shù)據(jù)，數(shù)據(jù)包括：Title,Content,Author的值。

在index.html頁(yè)面中，加載vue.js的時(shí)候需要帶上靜態(tài)路徑 htmlpage

在 new 一個(gè) vue 變量的時(shí)候，必須有一句來(lái)設(shè)置包裹數(shù)據(jù)的符號(hào)，我們這里設(shè)置這個(gè)符號(hào)為[[ ]]

同時(shí)，所有需要由 vue 渲染的數(shù)據(jù)，都寫成類似這樣的樣子

在 go + vue 方式下的完整模板文件 index.html

此頁(yè)面中{{ }}包裹的數(shù)據(jù)是由go從后端提供的數(shù)據(jù)（ 例如：{{.Title}}），而[[ ]]包裹的數(shù)據(jù)，是vue渲染的數(shù)據(jù)。

只是把 Vue里的數(shù)據(jù)，改為由go后端提供即可。

好吧，作者已經(jīng)在向月亮示愛了。呵呵 _

運(yùn)行一下程序，看修改模板后的效果。

vue + go 合二為一套路

go get -u github.com/mjibson/esc （go 文件嵌入器）

esc -o static.go admin

admin 是vue 打包出來(lái)得dist 文件夾。（只不過(guò)改了個(gè)名字， dist - admin）

使用 vue-admin-template 項(xiàng)目。

// clone the project

git clone

// enter the project directory

cd vue-admin-template

// install dependency

npm install

// develop

npm run dev

執(zhí)行npm run build:prod

src 同級(jí)（項(xiàng)目根目錄）目錄創(chuàng)建admin 目錄

拷貝vue build 出來(lái)得內(nèi)容到admin 目錄

gin 框架， / 后邊必須有個(gè)名字， 一般就是/ filepath，表示多級(jí)目錄

這時(shí)候 直接 GET /admin/就能訪問(wèn)我們的系統(tǒng)

后端go前端vue連接websocket失敗failed

是Vue.config.js配置代理的問(wèn)題。

后端工程師隸屬于軟件研發(fā)工程師，是從事軟件開發(fā)相關(guān)工作人員，其主要職責(zé)是平臺(tái)設(shè)計(jì)、接口設(shè)計(jì)和功能實(shí)現(xiàn)。

主要職責(zé)集中在三大部分，分別是平臺(tái)設(shè)計(jì)、接口設(shè)計(jì)和功能實(shí)現(xiàn)。平臺(tái)設(shè)計(jì)主要是搭建后端的支撐服務(wù)容器;接口設(shè)計(jì)主要針對(duì)于不同行業(yè)進(jìn)行相應(yīng)的功能接口設(shè)計(jì)，通常一個(gè)平臺(tái)有多套接口，就像衛(wèi)星導(dǎo)航平臺(tái)設(shè)有民用和軍用兩套接口一樣;功能實(shí)現(xiàn)則是完成具體的業(yè)務(wù)邏輯實(shí)現(xiàn)。