Cursor - 12306 MCP，打造 AI 智能選票系統，超酷的！
大家好，我是蒼何。
昨天線下活動見了米尼的孩子，說句實在的，勾起了我對家裏娃的想念。
於是，我決定端午，我要回家，我要陪過度六一。
掏出手機 12306，查票、候補、買票。
開始計算着出發時間，到達家的時間，選擇高鐵還是硬臥，早上 6 點的車能否趕上，晚上十一點的車到家太晚會吵醒孩子，中午的車正好但往往沒票。
。。。
受夠了，每次都是這樣，買個票，能把我瞬間變成一隻哈巴狗，咧着嘴，大聲喘氣。
於是，我想借助 AI 打造一種新型的選票方式。
在 Cursor 中，藉助 12306 MCP 就可以實現。
當把一切準備工作配置好後，我只需要對着 Cursor 的 AI 對話框，用大白話輸出我的需求。
他就能給我精選出最合適的車次以及餘票信息。
我想做高鐵二等座，車票金額限制在 650 元以內，我大概 8 點左右出發，請幫我選擇合適的列車。
那麼，這個時候，Cursor 就會給我直接選出符合的車次，票價、餘票等信息。
甚至，當我確定好車次，直接問問 Cursor，該車次經停的車站以及停靠時間。
然後結合高德地圖 MCP，做成一個途徑站點的地圖標註。結合騰訊的 EdgeOne Pages MCP，一鍵部署成網頁。
點擊或者懸浮每一個途徑站點上，還能顯示到達時間、停車時間以及站序。
爲了消磨在路上的時間，甚至可以一鍵讓 Cursor 給做出個沿途站點介紹，包括當地的打卡景點啊、美食小喫啊什麼的。
畢竟，途徑相遇就是最美的緣分，雖然沒來玩，但也算勉強過一把癮。
不得不說，Claude 4 的美感是真的強，愛了愛了。
最美的風景其實在路上，所到之處皆爲所愛。
當然了，甚至還加上了到站提醒服務，睡着坐過站這種事，不會再發生了。因爲他真的會給打電話😄
但一頓操作下來，爽是爽了，美也美了，但正經人誰會一天到晚揹着個電腦玩 Cursor 啊。（除了我這個老不正經🐶）
所以需要更方便的方式，要能隨處可用，隨時可用。
簡單，把這個 MCP 發佈成智能體服務唄。於是我一頓搗鼓，在阿里雲百鍊，將 12306 作爲自定義 MCP，一頓發佈。
就做成了一個隨時可訪問的智能體應用，只需要，對話框中輸入，就能獲取智能選票服務，而且還能獲取沿途經停站的旅遊攻略簡約版。
接下來，我會嘗試做成一個輕應用，如果你想體驗，可先評論區留言讓我知道，到時優先發你。
當然了，你也可以完全後臺回覆：AI，到時也會更新到 AI 開源知識庫.
介紹了半天，我還是想手把手教你搭建一套這樣的系統，真的有手就行。（提示詞也直接給）
不過這樣就會顯得文章稍微有點兒長了，您如果看到這會給個 zan 的吧，會的吧＼（＾ ＾）／
第一步，下載源碼，本地部署，直接按照以下命令，嗶哩吧哩一頓複製。
git clone https://github.com/Joooook/12306-mcp.git
cd 12306-mcp
npm run build
node ./build/index.js記得 Cursor 中打開這個項目，出現這個樣子。就代表本地已經部署成功了。
接下來在 Cursor 中配置 MCP（這裏有困難的小可愛，可以翻一翻老蒼何以前的文章，稍微看看就會了）
{
"mcpServers": {
"12306-mcp": {
"command": "npx",
"args": [
"-y",
"12306-mcp"
]
}
}
}貼在這個地方：
完事之後，這燈就會綠了。
可以先簡單測試下效果：
1、查詢餘票信息
5 月 31 日從武漢飛往北京，請幫我查詢一下餘票信息
2、車票選擇
我想做高鐵二等座，車票報銷金額限制在 650 元以內，我大概 8 點左右出發，請幫我選擇合適的列車
3、查詢列車途徑站點
幫我查詢下 G522 途徑的站點
接下來是站點地圖，這裏我複製的予貝的提示詞，並做了修改
請將G333途徑站點信息嵌入到網頁中，幫我生成一段高德地圖JSAPI代碼，
實現地圖上標記出來途徑的站點信息，並且以箭頭圖標的形式標記，
各站點需要連成線，並且鼠標放到圖標上可以顯示到達時間，輸出爲yb.html，然後將他一鍵部署。要想做到一鍵部署，還需要配一個騰訊的 edgeone-pages-mcp-server，這玩意能直接將網頁部署，然後隨時可以訪問。
如果不出意外的會，Cursor 會直接甩一個鏈接給你，毫不猶豫打開他，你就能看到這樣的圖。
接下來是做野兔風光網頁網站，也很簡單，在偉大的臧師傅的精美網頁提示詞的基礎上，做一波改動。
幫我基於沿途站點，做一個網頁，要求介紹站點的知名景點，特色美食，並按照一下要求：
1.使用Bento Grid風格的視覺設計。
2.強調超大字體或數字突出核心要點，畫面中有超大視覺元素強調重點，與小元素的比例形成反差
3.中英文混用，中文大字體粗體，英文小字作爲點綴
4.簡潔的勾線圖形化作爲數據可視化或者配圖元素
5.運用高亮色自身透明度漸變製造科技感，但是不同高亮色不要互相漸變
6.模仿 apple 官網的動效，向下滾動鼠標配合動效
7.數據可以引用在線的圖表組件，樣式需要跟主題一致
8.使用 Framer Motion(通過CDN引入)
9.使用HTML5、TailwindCss 3.0+(通過CDN引入)和必要的JavaScript
10.使用專業圖標庫如Font Awesome或Material lcons(通過CDN引入)
11.避免使用emoji作爲主要圖標
12.不要省略內容要點
13、幫我導網上找一些對應的圖片，放到網頁對應部分，讓網站看起來更好看一些
然後把這個網頁部署好。一切 ok 後，直接打開鏈接，你就能看到這個網頁了。
本文由 Readfog 進行 AMP 轉碼，版權歸原作者所有。
來源：https://mp.weixin.qq.com/s/j6c_GjV7nqNTsCpRXMw5tw?poc_token=HKF4NWijCFJ0SbURaMziUOGyyQBtHRKv5ayJLkUo