前後端分離專案之資料匯出為word例項
阿新 • • 發佈：2019-01-13
1.後臺restful api，組裝檔案輸出流物件到response響應包輸出到前端(vue+webpack node管理)。
後臺介面：根據projectId查詢相關資料，並將相關欄位封裝到word模板中，最後用流輸出檔案。
控制層程式碼
@RequestMapping("/exportToWord")
@ResponseBody
public void exportToWord(HttpServletRequest request,
HttpServletResponse response,
@RequestParam(value = "projectId" 業務層程式碼
public void exportToWord(HttpServletResponse response,String projectId,String path) throws Exception{
HashMap<String,Object> params=new HashMap<String,Object>();
params.put("projectId", projectId);
HashMap<String, Object> projectMap = projectDao. 匯出的word模板如下圖：
public void operatorProject(Map<String, Object> projectMap, String path) throws Exception {
HashMap<String, Object> map = new HashMap<String, Object>();
//事項基本資訊
map.put("${projectNo}", projectMap.get("projectNo"));
map.put("${projectName}", projectMap.get("projectName"));
map.put("${PROJECTNAMEBIAOTI}", projectMap.get("projectName"));
map.put("${deptName}", projectMap.get("deptName"));
map.put("${itemName}", projectMap.get("itemName"));
map.put("${projectItemNo}", projectMap.get("projectItemNo"));
map.put("${projectShowNo}", projectMap.get("projectShowNo"));
map.put("${gridNo}", projectMap.get("gridNo"));
map.put("${PROJECT_TYPE_NAME}", projectMap.get("PROJECT_TYPE_NAME"));
map.put("${SERVICE_TYPE_NAME}", projectMap.get("SERVICE_TYPE_NAME"));
map.put("${CASE_TYPE_NAME}", projectMap.get("CASE_TYPE_NAME"));
map.put("${DEAL_TYPE_NAME}", projectMap.get("DEAL_TYPE_NAME"));
map.put("${TONGBAN_RANGE_NAME}", projectMap.get("TONGBAN_RANGE_NAME"));
map.put("${RUN_SYSTEM_TYPE_NAME}", projectMap.get("RUN_SYSTEM_TYPE_NAME"));
map.put("${POWER_UPDATE_TYPE_NAME}", projectMap.get("POWER_UPDATE_TYPE_NAME"));
map.put("${POWER_STATE_NAME}", projectMap.get("POWER_STATE_NAME"));
map.put("${ACCEPTING_RANGE_NAME}", projectMap.get("ACCEPTING_RANGE_NAME"));
map.put("${IMPLEMET_SUBJECT_NATURE_NAME}", projectMap.get("IMPLEMET_SUBJECT_NATURE_NAME"));
map.put("${AUTHORITY_DIVISION_NAME}", projectMap.get("AUTHORITY_DIVISION_NAME"));
map.put("${STREET_DEAL_AUTHORITY_NAME}", projectMap.get("STREET_DEAL_AUTHORITY_NAME"));
map.put("${DISTRIBUTE_SYS_TYPE_NAME}", projectMap.get("DISTRIBUTE_SYS_TYPE_NAME"));
map.put("${distributeSysUrl}", projectMap.get("distributeSysUrl"));
SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd");
String date =sdf.format(new Date());
map.put("${riqi}", date);
//查詢字典表--審批型別
HashMap<String,Object> projectTypeMap = new HashMap<String,Object>();
projectTypeMap.put("dictCode", "1003");
List<HashMap<String, Object>> projectTypeList = sysDictInfoDao.findList(new RowBounds(), projectTypeMap);
String projectType = combinationString(projectTypeList, String.valueOf(projectMap.get("projectType")));
// 事項型別
map.put("${SHIXIANGLEIXING}", projectType);
//查詢字典表--辦理型別
HashMap<String,Object> dealTypeMap = new HashMap<String,Object>();
dealTypeMap.put("dictCode", "1004");
List<HashMap<String, Object>> dealTypeList = sysDictInfoDao.findList(new RowBounds(), dealTypeMap);
String dealType = combinationString(dealTypeList, String.valueOf(projectMap.get("dealType")));
// 辦理型別
map.put("${BANLILEIXING}", dealType);
//辦事指南基本資訊
HashMap<String, Object> paramsMap = new HashMap<String, Object>();
paramsMap.put("projectId",String.valueOf(projectMap.get("projectId")));
HashMap<String, Object> summaryList = projectSummaryDao.queryProjectSummaryById(paramsMap);
summaryList=StringUtils.clobToStringByMap(summaryList);//辦事指南資訊
List<HashMap<String,Object>> projectFoundationList=projectFoundationDao.findList(new RowBounds(), paramsMap);
projectFoundationList=StringUtils.clobToStringByList(projectFoundationList);//設立依據資訊
String foundation="";
if(projectFoundationList!=null && projectFoundationList.size()>0){
for(HashMap<String,Object> map1:projectFoundationList){
String categoryName=map1.get("categoryName")==null?"":map1.get("categoryName").toString();
String name=map1.get("name")==null?"":map1.get("name").toString();
String organization=map1.get("organization")==null?"":map1.get("organization").toString();
String issueOrderno=map1.get("issueOrderno")==null?"":map1.get("issueOrderno").toString();
foundation+="["+categoryName+"]"+name+"("+organization+issueOrderno+")"+";";
}
}
map.put("${foundation}", foundation);
// 申請材料清單
String applyMaterial=summaryList.get("applyMaterial")==null?"":summaryList.get("applyMaterial").toString();
map.put("${applyMaterial}", StringEscapeUtils.unescapeHtml(applyMaterial));
//受理標準(條件)
String acceptCondition=summaryList.get("acceptCondition")==null?"":summaryList.get("acceptCondition").toString();
map.put("${acceptCondition}", StringEscapeUtils.unescapeHtml(acceptCondition));
//辦理(審批)條件
String premitCond=summaryList.get("premitCond")==null?"":summaryList.get("premitCond").toString();
map.put("${premitCond}", StringEscapeUtils.unescapeHtml(premitCond));
//材料稽核標準
String materAuditStandard=summaryList.get("materAuditStandard")==null?"":summaryList.get("materAuditStandard").toString();
map.put("${materAuditStandard}", StringEscapeUtils.unescapeHtml(materAuditStandard));
//收費標準
String chargeStandard=summaryList.get("chargeStandard")==null?"":summaryList.get("chargeStandard").toString();
map.put("${chargeStandard}", StringEscapeUtils.unescapeHtml(chargeStandard));
//收費依據
String chargeFoundation=summaryList.get("chargeFoundation")==null?"":summaryList.get("chargeFoundation").toString();
map.put("${chargeFoundation}", StringEscapeUtils.unescapeHtml(chargeFoundation));
//法定辦理期限
String statutoryDays=summaryList.get("statutoryDays")==null?"":summaryList.get("statutoryDays").toString();
map.put("${statutoryDays}", StringEscapeUtils.unescapeHtml(statutoryDays));
//法定辦理期限描述
String statutoryDesc=summaryList.get("statutoryDesc")==null?"":summaryList.get("statutoryDesc").toString();
map.put("${statutoryDesc}", StringEscapeUtils.unescapeHtml(statutoryDesc));
//承諾辦理期限
String promiseDays=summaryList.get("promiseDays")==null?"":summaryList.get("promiseDays").toString();
map.put("${promiseDays}", StringEscapeUtils.unescapeHtml(promiseDays));
//承諾辦理期限描述
String promiseDesc=summaryList.get("promiseDesc")==null?"":summaryList.get("promiseDesc").toString();
map.put("${promiseDesc}", StringEscapeUtils.unescapeHtml(promiseDesc));
//業務主管部門
String examAppDept=summaryList.get("examAppDept")==null?"":summaryList.get("examAppDept").toString();
map.put("${examAppDept}", StringEscapeUtils.unescapeHtml(examAppDept));
//實施機構(實施主體)
String acceptName=summaryList.get("acceptName")==null?"":summaryList.get("acceptName").toString();
map.put("${acceptName}", StringEscapeUtils.unescapeHtml(acceptName));
//聯辦機構
String jointlyOrganize=summaryList.get("jointlyOrganize")==null?"":summaryList.get("jointlyOrganize").toString();
map.put("${jointlyOrganize}", StringEscapeUtils.unescapeHtml(jointlyOrganize));
//辦理處（科）室
String dealMain=summaryList.get("dealMain")==null?"":summaryList.get("dealMain").toString();
map.put("${dealMain}", StringEscapeUtils.unescapeHtml(dealMain));
//辦理地點
String acceptAddress=summaryList.get("acceptAddress")==null?"":summaryList.get("acceptAddress").toString();
map.put("${acceptAddress}", StringEscapeUtils.unescapeHtml(acceptAddress));
//所在視窗
String windowAddress=summaryList.get("windowAddress")==null?"":summaryList.get("windowAddress").toString();
map.put("${windowAddress}", StringEscapeUtils.unescapeHtml(windowAddress));
//辦理時間
String workTime=summaryList.get("workTime")==null?"":summaryList.get("workTime").toString();
map.put("${workTime}", StringEscapeUtils.unescapeHtml(workTime));
//中介服務
String intermediaryService=summaryList.get("intermediaryService")==null?"":summaryList.get("intermediaryService").toString();
map.put("${intermediaryService}", StringEscapeUtils.unescapeHtml(intermediaryService));
//數量限制
String quantityRestriction=summaryList.get("quantityRestriction")==null?"":summaryList.get("quantityRestriction").toString();
map.put("${quantityRestriction}", StringEscapeUtils.unescapeHtml(quantityRestriction));
//行使內容(許可權說明)
String acceptAuthorityDesc=summaryList.get("acceptAuthorityDesc")==null?"":summaryList.get("acceptAuthorityDesc").toString();
map.put("${acceptAuthorityDesc}", StringEscapeUtils.unescapeHtml(acceptAuthorityDesc));
//特別程式及期限
String specialProcedure=summaryList.get("specialProcedure")==null?"":summaryList.get("specialProcedure").toString();
map.put("${specialProcedure}", StringEscapeUtils.unescapeHtml(specialProcedure));
//責任事項
String responsibilityMatters=summaryList.get("responsibilityMatters")==null?"":summaryList.get("responsibilityMatters").toString();
map.put("${responsibilityMatters}", StringEscapeUtils.unescapeHtml(responsibilityMatters));
//責任事項依據
String responsibilityFoundation=summaryList.get("responsibilityFoundation")==null?"":summaryList.get("responsibilityFoundation").toString();
map.put("${responsibilityFoundation}", StringEscapeUtils.unescapeHtml(responsibilityFoundation));
//職責邊界
String responsibilityBoundary=summaryList.get("responsibilityBoundary")==null?"":summaryList.get("responsibilityBoundary").toString();
map.put("${responsibilityBoundary}", StringEscapeUtils.unescapeHtml(responsibilityBoundary));
//平均去現場次數
String sceneNum=summaryList.get("sceneNum")==null?"":summaryList.get("sceneNum").toString();
map.put("${sceneNum}", StringEscapeUtils.unescapeHtml(sceneNum));
//辦理流程
String process=summaryList.get("process")==null?"":summaryList.get("process").toString();
map.put("${process}", StringEscapeUtils.unescapeHtml(process));
//內部流程描述
String insideProcessDesc=summaryList.get("insideProcessDesc")==null?"":summaryList.get("insideProcessDesc").toString();
map.put("${insideProcessDesc}", StringEscapeUtils.unescapeHtml(insideProcessDesc));
//證照形式及有效期
String certName=summaryList.get("certName")==null?"":summaryList.get("certName").toString();
map.put("${certName}", StringEscapeUtils.unescapeHtml(certName));
//證照名稱
String licenseName=summaryList.get("licenseName")==null?"":summaryList.get("licenseName").toString();
map.put("${licenseName}", StringEscapeUtils.unescapeHtml(licenseName));
//填報人
String reporter=summaryList.get("reporter")==null?"":summaryList.get("reporter").toString();
map.put("${reporter}", StringEscapeUtils.unescapeHtml(reporter));
//填報人聯絡方式
String reporterPhone=summaryList.get("reporterPhone")==null?"":summaryList.get("reporterPhone").toString();
map.put("${reporterPhone}", StringEscapeUtils.unescapeHtml(reporterPhone));
//備註
String remark=summaryList.get("remark")==null?"":summaryList.get("remark").toString();
map.put("${remark}", StringEscapeUtils.unescapeHtml(remark));
//預留欄位1
String reserve1=summaryList.get("reserve1")==null?"":summaryList.get("reserve1").toString();
map.put("${reserve1}", StringEscapeUtils.unescapeHtml(reserve1));
//預留欄位2
String reserve2=summaryList.get("reserve2")==null?"":summaryList.get("reserve2").toString();
map.put("${reserve2}", StringEscapeUtils.unescapeHtml(reserve2));
//預留欄位3
String reserve3=summaryList.get("reserve3")==null?"":summaryList.get("reserve3").toString();
map.put("${reserve3}", StringEscapeUtils.unescapeHtml(reserve3));
//預留欄位4
String reserve4=summaryList.get("reserve4")==null?"":summaryList.get("reserve4").toString();
map.put("${reserve4}", StringEscapeUtils.unescapeHtml(reserve4));
//預留欄位5
String reserve5=summaryList.get("reserve5")==null?"":summaryList.get("reserve5").toString();
map.put("${reserve5}", StringEscapeUtils.unescapeHtml(reserve5));
//匯出模板的檔案路徑
String srcPath = path + "FileDownload\\govsdm\\Masterplate\\project.docx";
//匯出的word路徑
String destPath = path + "FileDownload\\govsdm\\Export\\project.docx";
List<HashMap<String, Object>> projectMaterList =
projectMaterialsDao.queryProjectMaterialsByPid(paramsMap);
projectMaterList=StringUtils.clobToStringByList(projectMaterList);//將clob型別轉換為string
if(projectMaterList!=null && projectMaterList.size()>0){
searchAndReplaceProject(srcPath, destPath, map,projectMaterList);
}
}public static void searchAndReplaceProject(String srcPath, String destPath,
HashMap<String, Object> map,
List<HashMap<String, Object>> projectMaterialsList) throws IOException {
try {
File srcDocument = new File(srcPath);
OPCPackage pack = POIXMLDocument.openPackage(srcDocument.toString());
XWPFDocument document = new XWPFDocument(pack);
// 替換表格中的指定文字
Iterator<XWPFTable> itTable = document.getTablesIterator();
while (itTable.hasNext()) {
XWPFTable table = (XWPFTable) itTable.next();
int rcount = table.getNumberOfRows();
for (int i = 0; i < rcount; i++) {
XWPFTableRow row = table.getRow(i);
List<XWPFTableCell> cells = row.getTableCells();
for (XWPFTableCell cell : cells) {
for (Entry<String, Object> e : map.entrySet()) {
if (cell.getText().equals(e.getKey())) {
cell.removeParagraph(0);
XWPFParagraph p=cell.addParagraph();
try {
p.createRun().setText(e.getValue().toString());
} catch (Exception e1) {
e1.printStackTrace();
}
}
}
}
}
}
try {
List<XWPFTable> tableList=document.getTables();
if (tableList!=null&&tableList.size()>0) {
int length=tableList.size();
XWPFTable table = (XWPFTable) tableList.get(length-1);
for(int i=0;i<projectMaterialsList.size();i++){
XWPFTableRow row=table.createRow();
List<XWPFTableCell> cells = row.getTableCells();
for (int j = 0; j < cells.size(); j++) {
XWPFTableCell cell=cells.get(j);
cell.removeParagraph(0);
CTTcPr tcpr = cell.getCTTc().addNewTcPr();
CTTblWidth cellw = tcpr.addNewTcW();
cellw.setType(STTblWidth.DXA);
cellw.setW(BigInteger.valueOf(360*5));
if(j==0){
cell.setText(String.valueOf(projectMaterialsList.get(i).get("materialName")));
}if(j==1){
cell.setText(String.valueOf(projectMaterialsList.get(i).get("description")));
}if(j==2){
if("01".equals(projectMaterialsList.get(i).get("materialType")))
{
cell.setText("■文字類 □表格類 □結果文書類 □其它類");
}else if("02".equals(projectMaterialsList.get(i).get("materialType")))
{
cell.setText("□文字類 ■表格類 □結果文書類 □其它類");
}else if("03".equals(projectMaterialsList.get(i).get("materialType")))
{
cell.setText("□文字類 □表格類 ■結果文書類 □其它類");
}else
{
cell.setText("□文字類 □表格類 □結果文書類 ■其它類");
}
}
}
}
}
FileOutputStream outStream = null;
outStream = new FileOutputStream(destPath);
document.write(outStream);
outStream.close();
} catch (Exception e) {
e.printStackTrace();
}
/////////////////給WORD插入標題///////////////
//獲得第一個段落物件
XWPFParagraph paragraph = document.getParagraphs().get(3);
//段落的格式,下面及個設定,將使新新增的文字向左對其,無縮排.
paragraph.setIndentationLeft(0);
paragraph.setIndentationHanging(0);
paragraph.setWordWrap(true);
//在段落中新插入一個run,這裡的run我理解就是一個word文件需要顯示的個體,裡面可以放文字,引數0代表在段落的最前面插入
XWPFRun run = paragraph.insertNewRun(0);
//設定run內容
run.setText(map.get("${PROJECTNAMEBIAOTI}")+"");
run.setFontFamily("宋體");
run.setBold(true);
run.setFontSize(20);
FileOutputStream outStream = null;
outStream = new FileOutputStream(destPath);
document.write(outStream);
outStream.flush();
outStream.close();
}catch (Exception e) {
e.printStackTrace();
}
}private String combinationString(List<HashMap<String, Object>> list, String type) {
String cString = "";
String[] typeArr = type.split(",");
boolean isSelected = false;
for (int i = 0; i < list.size(); i++) {
isSelected = false;
for(String type1 : typeArr){
if (list.get(i).get("dictId").equals(type1)) {
isSelected = true;
}
}
if (isSelected) {
cString += "■" + list.get(i).get("dictName") + " ";
}else{
cString += "□" + list.get(i).get("dictName") + " ";
}
}
return cString;
}最後輸出檔案流
public HttpServletResponse download(String path, HttpServletResponse response, String projectname) throws Exception {
// path是指欲下載的檔案的路徑。
File file = new File(path);
// 以流的形式下載檔案。
InputStream fis = new BufferedInputStream(new FileInputStream(path));
byte[] buffer = new byte[fis.available()];
fis.read(buffer);
fis.close();
// 清空response
response.reset();
// 設定response的Header
response.addHeader("Content-Disposition", "attachment;filename="
+ new String((projectname + ".docx").getBytes("gbk"),
"iso-8859-1"));
response.addHeader("Content-Length", "" + file.length());
OutputStream toClient = new BufferedOutputStream(
response.getOutputStream());
response.setContentType("application/octet-stream");
toClient.write(buffer);
toClient.flush();
toClient.close();
return response;
}前端vue程式碼片段；
<Button type="warning" size="small" @click="exports(item.projectId)" icon="share" v-if="btnData.indexOf('export')!==-1">匯出</Button>js程式碼
//匯出
exports(projectId){
let token = localStorage.getItem('token');
//自定義form標籤，初始化相關引數
var form = $("<form>");
form.attr('style', 'display:none');
form.attr('target', '');
form.attr('method', 'post');
form.attr('action', window.config.api + '/projectDocController/exportToWord.do');
var input1 = $('<input>');
input1.attr('type', 'hidden');
input1.attr('name', 'projectId');
input1.attr('value', projectId);
var input2 = $('<input>');
input2.attr('type', 'hidden');
input2.attr('name', 'token');
input2.attr('value', token);
$('body').append(form);
form.append(input1);
form.append(input2);
form.submit();
form.remove();
}小結：針對檔案流的操作，儘量用提交form表單的形式處理請求。
相關推薦
前後端分離專案之資料匯出為word例項
1.後臺restful api，組裝檔案輸出流物件到response響應包輸出到前端(vue+webpack node管理)。 後臺介面：根據projectId查詢相關資料，並將相關欄位封裝到word模板中，最後用流輸出檔案。 控制層程式碼 @Reques
從零開始搭建django前後端分離專案 系列五（實戰之excel流式匯出）
專案中有一處功能需求是：需要在歷史資料查詢頁面進行查詢欄位的選擇，然後由後臺資料庫動態生成對應的excel表格並下載到本地。 如果檔案較小，解決辦法是先將要傳送的內容全生成在記憶體中，然後再一次性傳入Response物件中； 如果檔案較大時，我們可以考慮向HttpResponse傳遞一個迭代器，流式的向客
從零開始搭建django前後端分離專案 系列三（實戰之非同步任務執行）
前面已經將專案環境搭建好了，下面進入實戰環節。這裡挑選專案中涉及到的幾個重要的功能模組進行講解。 celery執行非同步任務和任務管理 Celery 是一個專注於實時處理和任務排程的分散式任務佇列。由於本專案進行資料分析的耗時比較長，所以採用非同步方式執行任務。本專案中Broker使用redis，Result
從零開始搭建django前後端分離專案 系列六（實戰之聚類分析）
專案需求 本專案從impala獲取到的資料為使用者地理位置資料，每小時的資料量大概在8000萬條，資料格式如下： 公司要求對這些使用者按照聚集程度進行劃分，將300米範圍內使用者數大於200的使用者劃分為一個簇，並計算這個簇的中心點和簇的邊界點。 實現原理 下面我們來一步一步實現上述需求： 1、將使用者
前後端分離專案配置Nginx、配https及http強制跳轉https
本篇文章主要解決以下幾個問題： 前後端分離專案如何配置Nginx 配置https協議訪問 開啟http訪問但強制跳轉https訪問 基本的安裝就不多說了，直奔主題。 本文基於ubuntu系統，另外假定有幾個前提條件： 主機地址為192.168
Docker 對前後端分離專案的部署和運維（詳述）
1.首先要有虛擬機器（vmware 這是一個虛擬機器安裝軟體，然後下載cenos作業系統，centos是linux社群辦的一個流行的作業系統，還有Redhat 商業版的，安全還提供一些額外的服務，但是要收費，還有對虛擬機器的硬體和軟體進行配置，在VMware這個圖形化的工具裡面就可以進行配置）或者是
前後端分離專案linux配置nignx代理叢集轉發api請求,配置不同埠叢集
nginx配置叢集,監聽以下多個後端服務介面並對外暴露介面以供前端呼叫 upstream optomcat { server localhost:8080; server localhost:8090; } server { li
在前後端分離專案中用vue寫購物車
,購物車實現步驟 a, 給"加入購物車"按鈕提供點選事件 b, 在vue中編寫 addToCart方法，將商品加入購物車 1）準備資料：新增至購物車的商品資料 2）從localStorage中取出cart資訊 3）如果取出的cart資料為空，那就直接把資訊新增進購物車
利用Nginx解決前後端分離專案中的跨域問題
1. 前端專案利用Nginx配置站點 server { listen 8092 default_server; listen [::]:8092 default_server; root /home/chenpeng/xiahuaida/data/vue; index index.ht
從零開始搭建django前後端分離專案 系列一（技術選型）
前言 最近公司要求基於公司的hadoop平臺做一個關於電信行動網路的資料分析平臺，整個專案需求大體分為四大功能模組：資料探勘分析、報表資料查詢、GIS地理化展示、任務監控管理。由於頁面功能較複雜，所以採用前後端分離方式開發。前端採用webpack+vue+vue-router+axios技術棧，後端用djan
從零開始搭建django前後端分離專案 系列二（專案搭建）
在開始專案之前，假設你已瞭解以下知識：webpack配置、vue.js、django。這裡不會教你webpack的基本配置、熱更新是什麼，也不會告訴你如何開始一個django專案，有需求的請百度，相關的文章已經很多了。 下面開始一步一步構建完整的專案： 1、開發環境準備 win7 x64 python 3.
從零到一 django + vue 構建前後端分離專案
(本文在win10環境下進行) django 和 vue 的優點 django的python血統,開發起來基本上是站在巨人的肩膀上,用起來順手,加上drf這個restful API 框架,SaltStack、Ansible可做配置管理,celery做任務佇列
前後端分離開發 之 RAP2
RAP2是一個Web介面管理工具，開源免費，介面自動化，MOCK資料自動生成， 自動化測試，企業級管理。阿里媽媽MUX團隊出品！阿里巴巴都在用 使用情景 以往前後端分離開發過程中，會出現這種對話 前端：介面寫好了沒，我著急用，沒這個介面我沒法測功能啊。 後端：別催
vue前後端分離專案，解決跨域問題
最近公司新開發專案是前後端分離專案，前端用的是vue框架，在和前端除錯介面時存在拒絕跨域訪問403的情況。我這裡主要將解決的過程記錄一下。 什麼是跨域 跨域是瀏覽器的同源策略造成的，只要是域名、埠、協議有一不同，就會被當做是不同的域，之間的請求就被當做跨域操作。 設定同
前後端分離專案的跨域問題
在前端Ajax請求後臺的時候, 開啟控制檯可以看到, 每一次請求之前都會有一次OPTIONS型別的請求OPTIONS稱為預檢請求, 通過這個請求, 瀏覽器會告知伺服器,接下來的請求的情況.得到伺服器的迴應後瀏覽器便知道這次請求是否被允許 Access-Control-A
前後端分離專案，使用session作為使用者狀態記錄
在使用前後端分離的專案中，我們一般選擇無狀態的請求方式，即web token；或者搭建快取伺服器，來準們儲存使用者的登入狀態。一般不會使用servlet的session來儲存使用者狀態，因為這種方式不太安全，而且前後端分離的專案中每次訪問的時候，所攜帶的sessionId也是不相同的，所以是
零基礎搭建前後端分離專案
既然選擇了遠方，便只顧風雨兼程 __ HANS許 系列：零基礎搭建前後端分離專案 前端 服
React / Vue 前後端分離專案實現微信分享教程
小編推薦：Fundebug專注於JavaScript、微信小程式、微信小遊戲，Node.js和Java實時BUG監控。真的是一個很好用的bug監控費服務，眾多大佬公司都在使用。 網上非常多的微信分享例子和教程，但是都不全面，甚至不少錯誤。自己根據微信官方文件踩了好幾個坑才擼成功。痛
docker 對前後端分離專案的部署和運維
1.首先要有虛擬機器（vmware 這是一個虛擬機器安裝軟體，然後下載cenos作業系統，centos是linux社群辦的一個流行的作業系統，還有Redhat 商業版的，安全還提供一些額外的服務，但是要收費，還有對虛擬機器的硬體和軟體進行配置，在VMware這個圖形化的工具裡
vue前後端分離專案搭建
一, vue開發環境搭建 1, 開發工具 WebStorm或Visual Studio Code 2, 下載安裝nodejs ## 後端開發環境 Eclipse + JDK + Tomcat 等不再贅述 二, vue測試專案搭建 1, 新建資料夾