如何通過express托管靜態文件（將html頁面放

如何通過express托管靜態文件（將html頁面放到node服務上）

上個express搭建的基礎上，

app.use('public',express.static('public'));

在項目目錄上創建public文件夾，再創建子文件夾image

test.js

let express=require('express');

let app=express();

app.use('/public',express.static('public'));

app.get('/',function(req,res){

res.send('測試')

})

let server=app.listen(8080,function(){

console.log('服務啟動');

})

這時候只要通過訪問localhost:8080/public/圖片.png

就可以訪問到托管到服務上的文件了

同樣的道理，我們可以把html文件托管上去，我們的html頁面就可以被訪問了

在我們項目的根目錄下，創建一個html文件，我這里創建的是testReq.html

app.use('/public',express.static('public'))

app.get('/testReq.html', function (req, res) {

res.sendFile( __dirname + "/" + "testReq.html" );

})

//這里的__dirname指的是獲取當前文件所在目錄的完整目錄

者： SnailClimb

Markdown 簡歷模板樣式一覽

可以看到我把聯系方式放在第一位，因為公司一般會與你聯系，所以把聯系方式放在第一位也是為了方便聯系考慮。

為什么要用 Markdown 寫簡歷？

Markdown 語法簡單，易于上手。使用正確的 Markdown 語言寫出來的簡歷不論是在排版還是格式上都比較干凈，易于閱讀。另外，使用 Markdown 寫簡歷也會給面試官一種你比較專業的感覺。

除了這些，我覺得使用 Markdown 寫簡歷可以很方便將其與PDF、HTML、PNG格式之間轉換。后面我會介紹到轉換方法，只需要一條命令你就可以實現 Markdown 到 PDF、HTML 與 PNG之間的無縫切換。

下面的一些內容我在之前的一篇文章中已經提到過，這里再說一遍，最后會分享如何實現Markdown 到 PDF、HTML、PNG格式之間轉換的方法。

為什么說簡歷很重要？

假如你是網申，你的簡歷必然會經過HR的篩選，一張簡歷HR可能也就花費10秒鐘看一下，然后HR就會決定你這一關是Fail還是Pass。
假如你是內推，如果你的簡歷沒有什么優勢的話，就算是內推你的人再用心，也無能為力。
另外，就算你通過了篩選，后面的面試中，面試官也會根據你的簡歷來判斷你究竟是否值得他花費很多時間去面試。

寫簡歷的兩大法則

目前寫簡歷的方式有兩種普遍被認可，一種是 STAR，一種是 FAB。

STAR法則（Situation Task Action Result）：

Situation： 事情是在什么情況下發生；
Task:： 你是如何明確你的任務的；
Action： 針對這樣的情況分析，你采用了什么行動方式；
Result： 結果怎樣，在這樣的情況下你學習到了什么。

FAB 法則（Feature Advantage Benefit）：

Feature： 是什么；
Advantage： 比別人好在哪些地方；
Benefit： 如果雇傭你，招聘方會得到什么好處。

項目經歷怎么寫？

簡歷上有一兩個項目經歷很正常，但是真正能把項目經歷很好的展示給面試官的非常少。對于項目經歷大家可以考慮從如下幾點來寫：

對項目整體設計的一個感受
在這個項目中你負責了什么、做了什么、擔任了什么角色
從這個項目中你學會了那些東西，使用到了那些技術，學會了那些新技術的使用
另外項目描述中，最好可以體現自己的綜合素質，比如你是如何協調項目組成員協同開發的或者在遇到某一個棘手的問題的時候你是如何解決的。

專業技能該怎么寫？

先問一下你自己會什么，然后看看你意向的公司需要什么。一般HR可能并不太懂技術，所以他在篩選簡歷的時候可能就盯著你專業技能的關鍵詞來看。對于公司有要求而你不會的技能，你可以花幾天時間學習一下，然后在簡歷上可以寫上自己了解這個技能。比如你可以這樣寫：

Dubbo：精通
Spring：精通
Docker：掌握
SOA分布式開發：掌握
Spring Cloud:了解

簡歷模板分享

開源程序員簡歷模板： https://github.com/geekcompany/ResumeSample（包括PHP程序員簡歷模板、iOS程序員簡歷模板、Android程序員簡歷模板、Web前端程序員簡歷模板、Java程序員簡歷模板、C/C++程序員簡歷模板、NodeJS程序員簡歷模板、架構師簡歷模板以及通用程序員簡歷模板）

上述簡歷模板的改進版本： https://github.com/Snailclimb/Java-Guide/blob/master/面試必備/簡歷模板.md

其他的一些小tips

盡量避免主觀表述，少一點語義模糊的形容詞，盡量要簡潔明了，邏輯結構清晰。
注意排版（不需要花花綠綠的），盡量使用Markdown語法。
如果自己有博客或者個人技術棧點的話，寫上去會為你加分很多。
如果自己的Github比較活躍的話，寫上去也會為你加分很多。
注意簡歷真實性，一定不要寫自己不會的東西，或者帶有欺騙性的內容
項目經歷建議以時間倒序排序，另外項目經歷不在于多，而在于有亮點。
如果內容過多的話，不需要非把內容壓縮到一頁，保持排版干凈整潔就可以了。
簡歷最后最好能加上：“感謝您花時間閱讀我的簡歷，期待能有機會和您共事。”這句話，顯的你會很有禮貌。

我們剛剛講了很多關于如何寫簡歷的內容并且分享了一份 Markdown 格式的簡歷文檔。下面我們來看看如何實現 Markdown 到 HTML格式、PNG格式之間轉換。

Markdown 到 HTML格式、PNG格式之間轉換

網上很難找到一個比較方便并且效果好的轉換方法，最后我是通過 Visual Studio Code 的 Markdown PDF 插件完美解決了這個問題！

安裝 Markdown PDF 插件

① 打開Visual Studio Code ，按快捷鍵 F1，選擇安裝擴展選項

② 搜索 “Markdown PDF” 插件并安裝，然后重啟

使用方法

隨便打開一份 Markdown 文件點擊F1，然后輸入 export 然后選擇你想要轉換的格式即可！

最近的開發當中，我們需要為img標簽以及canvas動態繪制的圖像提供下載功能，下面是經過探索后我們得出的結果。

一、Canvas 版本

// 下載Canvas元素的圖片
function downloadCanvasIamge(selector, name) {
 // 通過選擇器獲取canvas元素
 var canvas=document.querySelector(selector)
 // 使用toDataURL方法將圖像轉換被base64編碼的URL字符串
 var url=canvas.toDataURL('image/png')
 // 生成一個a元素
 var a=document.createElement('a')
 // 創建一個單擊事件
 var event=new MouseEvent('click')
 
 // 將a的download屬性設置為我們想要下載的圖片名稱，若name不存在則使用‘下載圖片名稱’作為默認名稱
 a.download=name || '下載圖片名稱'
 // 將生成的URL設置為a.href屬性
 a.href=url
 
 // 觸發a的單擊事件
 a.dispatchEvent(event)
}
// 調用方式
// 參數一： 選擇器，代表canvas
// 參數二： 圖片名稱，可選
downloadCanvasIamge('canvas', '圖片名稱')

二、img 標簽版本

// 下載
function downloadIamge(selector, name) {
 // 通過選擇器獲取img元素
 var img=document.querySelector(selector)
 // 將圖片的src屬性作為URL地址
 var url=img.src
 var a=document.createElement('a')
 var event=new MouseEvent('click')
 
 a.download=name || '下載圖片名稱'
 a.href=url
 
 a.dispatchEvent(event)
}
// 調用方式
// 參數一： 選擇器，代表img標簽
// 參數二： 圖片名稱，可選
downloadIamge('canvas', '圖片名稱')

改進版

由于跨域會導致a標簽在部分瀏覽器中會直接打開新標簽頁，所以改進如下

function downloadIamge(selector, name) {
 var image=new Image()
 // 解決跨域 Canvas 污染問題
 image.setAttribute('crossOrigin', 'anonymous')
 image.onload=function () {
 var canvas=document.createElement('canvas')
 canvas.width=image.width
 canvas.height=image.height
 var context=canvas.getContext('2d')
 context.drawImage(image, 0, 0, image.width, image.height)
 var url=canvas.toDataURL('image/png')
 // 生成一個a元素
 var a=document.createElement('a')
 // 創建一個單擊事件
 var event=new MouseEvent('click')
 // 將a的download屬性設置為我們想要下載的圖片名稱，若name不存在則使用‘下載圖片名稱’作為默認名稱
 a.download=name || '下載圖片名稱'
 // 將生成的URL設置為a.href屬性
 a.href=url
 // 觸發a的單擊事件
 a.dispatchEvent(event)
}
image.src=document.querySelector(selector).src
}
// 調用方式
// 參數一： 選擇器，代表img標簽
// 參數二： 圖片名稱，可選
downloadIamge('canvas', '圖片名稱')

三、總結

我們主要使用的是a標簽的download屬性, 下面為MDN給出的說明：

此屬性指示瀏覽器下載URL而不是導航到URL，因此將提示用戶將其保存為本地文件。

如果屬性有一個值，它將在保存提示中用作預先填寫的文件名 (用戶仍然可以根據需要更改文件名)。對允許的值沒有限制，但是/和\被轉換為下劃線。大多數文件系統限制文件名中的一些標點符號，瀏覽器會相應地調整建議的名稱。

需要注意的地方：

此屬性僅適用于同源 URLs。

可以使用 blob: URLs 和 data: URLs 以方便用戶下載 JavaScript 方式生成的內容（例如使用在線繪圖的Web應用創建的照片）。

如果HTTP頭的Content-Disposition：存在，并且賦予了一個和這個屬性不同的文件名，HTTP頭優先于此屬性。

如果這個屬性存在 Content-Disposition 被設置為 inline，火狐優先 Content-Disposition，像之前文件名??的情況下，而Chrome則優先 download 屬性。

在線咨詢

上一篇：房產眾籌又出新玩法集裝箱創意與眾籌結合
下一篇：mht和html有什么區別-

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

如何通過express托管靜態文件（將html頁面放

您的項目需求