我的簽名檔會顯示你的IP跟使用的瀏覽器與作業系統
並且每次重新整理都會有不一樣的角色
其實這並不是什麼特別的技術,反而應該說『本來就這樣』
瀏覽器訪透過網址訪問一個網頁時,本來就都會送一些基本資料過去,這時候對方伺服器才會決定說要回傳什麼東西
例如同樣是巴哈姆特的網址,用手機開啟就會變成手機的網頁,用電腦開就會變成電腦版的網頁,這是因為瀏覽器開啟網址的時候就已經把『我是手機』的這個訊息也一並送過去
所以圖片當然也不例外
要做出『會顯示對方IP的圖片』,只要用asp.net寫一些簡單的程式碼就行了
利用使用者請求圖片時送過來的基本資料,加工處理成圖片,最後回傳給使用者看
簡單來說,這個圖片是使用者請求訪問時才立即合成產生,而不是一張真實存在於伺服器硬碟裡面的圖片
補充:PHP、JSP、nodejs、python 等...,都可以用來撰寫網頁伺服器後台
以下是我簽名檔原始碼與簡單說明
專案類型:asp.net MVC
原始碼:https://github.com/hbl917070/asp_SignWeb/blob/master/asp_hbl917070/asp_hbl917070/Controllers/SignWebController.cs
首先要知道幾個東西
asp.net:微軟開發的伺服器語言,撰寫語言是C#。
IIS:Windows 內建的伺服器,可用來架設PHP、ASP.net 等....。
SVG:利用xml文字檔繪製出來的一種向量圖片,可用顯示於瀏覽器上面。
base64:把圖片變成純字串的一種編碼方式。
一般這種會顯示IP的簽名檔,都是用影像合成的套件來處理,但這樣會需要大量的CPU運算,所以我用SVG這種圖片,如此一來替換文字內容就不需要合成影像,只需要處理字串
不過SVG畢竟是向量圖,處理上頗麻煩,所以我是用 Adobe Illustrator做出基本樣式後,匯出SVG格式,然後把點陣圖轉成base64插入到svg裡面,最後用C#語法替換裡面的文字
簡述一下運作流程:
1、使用者的瀏覽器根據網址,向我方伺服器請求圖片
2、asp後台利用使用者送過來的基本資料,處理成SVG向量圖片(此時還只是文字檔)
3、svg向量圖片跟已經轉成base64的動物朋友圖片合併,變成有圖案的SVG
4、把合併完的最終簽名檔回傳給使用者看
雖然我很想把完整個的建置步驟都解釋一次,但這樣要連同IIS跟ASP.net MVC都教一次
那樣這篇文會變得很長很複雜,所以...
以後再說吧
其實程式碼沒什麼難度,就建置環境的步驟麻煩了些
另外,如果有誤判的情形
用這個網址就可以看到,伺服器訪問一個網頁時到底送了什麼資料過去
願意協助我修正誤判的話,可以把網頁截圖起來或直接貼文字內容給我,但記得先遮掉自己的IP
並且每次重新整理都會有不一樣的角色
其實這並不是什麼特別的技術,反而應該說『本來就這樣』
瀏覽器訪透過網址訪問一個網頁時,本來就都會送一些基本資料過去,這時候對方伺服器才會決定說要回傳什麼東西
例如同樣是巴哈姆特的網址,用手機開啟就會變成手機的網頁,用電腦開就會變成電腦版的網頁,這是因為瀏覽器開啟網址的時候就已經把『我是手機』的這個訊息也一並送過去
所以圖片當然也不例外
要做出『會顯示對方IP的圖片』,只要用asp.net寫一些簡單的程式碼就行了
利用使用者請求圖片時送過來的基本資料,加工處理成圖片,最後回傳給使用者看
簡單來說,這個圖片是使用者請求訪問時才立即合成產生,而不是一張真實存在於伺服器硬碟裡面的圖片
補充:PHP、JSP、nodejs、python 等...,都可以用來撰寫網頁伺服器後台
以下是我簽名檔原始碼與簡單說明
專案類型:asp.net MVC
原始碼:https://github.com/hbl917070/asp_SignWeb/blob/master/asp_hbl917070/asp_hbl917070/Controllers/SignWebController.cs
首先要知道幾個東西
asp.net:微軟開發的伺服器語言,撰寫語言是C#。
IIS:Windows 內建的伺服器,可用來架設PHP、ASP.net 等....。
SVG:利用xml文字檔繪製出來的一種向量圖片,可用顯示於瀏覽器上面。
base64:把圖片變成純字串的一種編碼方式。
一般這種會顯示IP的簽名檔,都是用影像合成的套件來處理,但這樣會需要大量的CPU運算,所以我用SVG這種圖片,如此一來替換文字內容就不需要合成影像,只需要處理字串
不過SVG畢竟是向量圖,處理上頗麻煩,所以我是用 Adobe Illustrator做出基本樣式後,匯出SVG格式,然後把點陣圖轉成base64插入到svg裡面,最後用C#語法替換裡面的文字
簡述一下運作流程:
1、使用者的瀏覽器根據網址,向我方伺服器請求圖片
2、asp後台利用使用者送過來的基本資料,處理成SVG向量圖片(此時還只是文字檔)
3、svg向量圖片跟已經轉成base64的動物朋友圖片合併,變成有圖案的SVG
4、把合併完的最終簽名檔回傳給使用者看
雖然我很想把完整個的建置步驟都解釋一次,但這樣要連同IIS跟ASP.net MVC都教一次
那樣這篇文會變得很長很複雜,所以...
以後再說吧
其實程式碼沒什麼難度,就建置環境的步驟麻煩了些
另外,如果有誤判的情形
用這個網址就可以看到,伺服器訪問一個網頁時到底送了什麼資料過去
願意協助我修正誤判的話,可以把網頁截圖起來或直接貼文字內容給我,但記得先遮掉自己的IP