如何搭建乙個前後端分離的專案

2021-09-25 12:43:05 字數 1812 閱讀 5775

如下:

動態請求,client->nginx->tomcat->nginx->client

靜態請求,client->nginx->client

nginx作用:

1、處理靜態請求

2、負載均衡

3、**解決跨域問題

自定義標識

呼叫controller請求時都加上乙個字首,比如(/con),nginx處理請求時,請求如果以/con開頭,**給tomcat,非/con開頭的,直接返回靜態資源。

示例

在前端傳送請求時,新增統一請求字首

//在乙個js檔案中定義,(這裡叫basequest.js)

const service = axios.

create()

//(axios可參考

//在vue中的js業務檔案中,引入這個檔案:

import request from

'@/basequest'

const con =)}

}export

default con

在後端處理請求時,過濾/con開頭的請求,在web-inf/web.xml中定義

>

>

springmvcservlet-name

>

>

org.springframework.web.servlet.dispatcherservletservlet-class

>

>

>

contextconfiglocationparam-name

>

>

classpath:spring-mvc-servlet.xmlparam-value

>

init-param

>

>

1load-on-startup

>

servlet

>

>

>

springmvcservlet-name

>

>

/con/*url-pattern

>

>

nginx配置nginx配置相關,可參考:

nginx配置upstream實現負載均衡:

nginx中文站 › nginx中文文件:

nginx配置檔案詳解:

upstream my.controller.local 

upstream my.static.local

server

#其他請求**到就是到real.my.static.local網域名稱下

location /

}

可參考:

1、後記(初衷):

作為乙個後端開發,對於帶頁面的工程,就會寫jsp,vm是不是有點落後了。

另外,前後端分離好處多多:

1、nginx**方便解決跨域問題

2、工程開發部署方便等pa

gere

sult

)前端頁

面通過!pageresult) 前端頁面通過

!pager

esul

t)前端

頁面通過

!取值,這裡pageresult是個list。

如何做乙個前後端分離專案

程式設計師工作 4.前後端整合測試 前後端請求流程 專案是基於前後端分離的架構進行開發,前後端分離架構總體上包括前端和服務端,通常是多人協作並行開發,對於不同職位的人來說,有不同的側重點。1 需求分析 梳理使用者的需求,分析業務流程 2 介面定義 根據需求分析定義介面 3 服務端和前端並行開發 依據...

乙個vue go echo前後端分離的專案的上線

這是乙個web前後端分離專案的上線過程。解決了跨域問題 前端用的axios,一定會遇到跨域的問題。這裡先說一下axios的乙個坑,傳送post請求的時候,如果不是發json資料,一定要先設定一下 複製 新增引數為 var params new urlsearchparams axios then 複...

用nginx實現前後端分離的專案的前後端訪問

現在幾乎都是前後端分析的專案,在開發和線上一般都會使用nginx做 來實現跨域和負債均衡。nginx安裝前面已經講過,現在寫寫如何配置,前端技術為vue。server location web server location web 前端 在路徑 var www html yanwei privat...