vue + signalr

·? ? 引入JQ:vue 全局引入 jquery - 簡書

·?????引入signalr? “jquery.signalR-2.4.1.min.js”

·?????引入hubs文件(接口定義的方法程腹,可忽略)

·? ? ?連接

var connection = $.hubConnection();

connection.start()

這樣直接連接噪馏,默認(rèn)連接的是本地的服務(wù)(http://localhost/8100)?

這段代碼寫在?beforeMount 或者更早一點的鉤子函數(shù)

解決辦法:

$.connection.hub.url = "連接地址";

$.connection.hub .start()

·? ? 判斷連接狀態(tài)

$.connection.hub.start()執(zhí)行之后會有 “.done”? “.fail”來判斷是否連接成功

$.connection.hub.start().done(function () {console.log("Connected")})

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?.fail(function (a) {Unable to connect})

·? ? 連接失敗原因

? ? ? 失敗的原因很多,大致是跨域止潘、地址不對、引入文件不對窖式、token沒有或者失效

? ? ? 如果是跨域以及地址問題 和 后端溝通解決辦法

? ? ? 如果是引入的文件不對可以直接引入服務(wù)器文件掛在 public 下的 html 文件

? ? ? ?缺少 token 的原因:溝通 token 格式并在 start() 前加入 $.connection.hub.qs = { authorization: "token" };

·? ? ?接收消息

? ? ? ?let chat = $.connection.chatHub;?chatHub為后端定義

? ? ? ?實例化后調(diào)用 “onMessage” 來接受消息

let _this = this;

chat.client.onMessage = function (name, messageType, message) {

? ? ? ? console.log(name, messageType, message)

? ? ? ?// 具體接受幾個參數(shù)根據(jù)?onMessage 定義決定(后端)

? ? ? ? // 需要注意在這里用 this 指向不對需要用?_this

};

·? ? 發(fā)送消息

? ? ?由于發(fā)送消息是一定是要基于 start() 成功來執(zhí)行的扫责,所以要監(jiān)聽連接是否成功來執(zhí)行是否發(fā)送消息

在 data 中定義一個 flag

data() { return {

? ? IfConnect: false

} }


在 beforeMount 執(zhí)行的連接代碼中嵌入?IfConnect

let _this = this;

$.connection.hub.start().done(function () { _this.IfConnect = true; })?

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?.fail(function (a) {?_this.IfConnect = false; })


發(fā)送前校驗?IfConnect 狀態(tài)來發(fā)送

let?chat = $.connection.chatHub;

chat.server.send("這是一條消息");


·? ? ? ?監(jiān)聽錯誤

$.connection.hub.error(function (error) {

????console.log(error);

});


·? ? ? ? 生成日志

$.connection.hub.logging =true;

$.connection.hub.start();

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末吃谣,一起剝皮案震驚了整個濱河市撕予,隨后出現(xiàn)的幾起案子鲫惶,更是在濱河造成了極大的恐慌,老刑警劉巖实抡,帶你破解...
    沈念sama閱讀 222,183評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件欠母,死亡現(xiàn)場離奇詭異欢策,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)赏淌,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,850評論 3 399
  • 文/潘曉璐 我一進(jìn)店門猬腰,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人猜敢,你說我怎么就攤上這事『醒樱” “怎么了缩擂?”我有些...
    開封第一講書人閱讀 168,766評論 0 361
  • 文/不壞的土叔 我叫張陵,是天一觀的道長添寺。 經(jīng)常有香客問我胯盯,道長,這世上最難降的妖魔是什么计露? 我笑而不...
    開封第一講書人閱讀 59,854評論 1 299
  • 正文 為了忘掉前任博脑,我火速辦了婚禮,結(jié)果婚禮上票罐,老公的妹妹穿的比我還像新娘叉趣。我一直安慰自己,他們只是感情好该押,可當(dāng)我...
    茶點故事閱讀 68,871評論 6 398
  • 文/花漫 我一把揭開白布疗杉。 她就那樣靜靜地躺著,像睡著了一般蚕礼。 火紅的嫁衣襯著肌膚如雪烟具。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,457評論 1 311
  • 那天奠蹬,我揣著相機(jī)與錄音朝聋,去河邊找鬼。 笑死囤躁,一個胖子當(dāng)著我的面吹牛冀痕,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播割以,決...
    沈念sama閱讀 40,999評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼金度,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了严沥?” 一聲冷哼從身側(cè)響起猜极,我...
    開封第一講書人閱讀 39,914評論 0 277
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎消玄,沒想到半個月后跟伏,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體丢胚,經(jīng)...
    沈念sama閱讀 46,465評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,543評論 3 342
  • 正文 我和宋清朗相戀三年受扳,在試婚紗的時候發(fā)現(xiàn)自己被綠了携龟。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,675評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡勘高,死狀恐怖峡蟋,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情华望,我是刑警寧澤蕊蝗,帶...
    沈念sama閱讀 36,354評論 5 351
  • 正文 年R本政府宣布,位于F島的核電站赖舟,受9級特大地震影響蓬戚,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜宾抓,卻給世界環(huán)境...
    茶點故事閱讀 42,029評論 3 335
  • 文/蒙蒙 一子漩、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧石洗,春花似錦幢泼、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,514評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至焦人,卻和暖如春挥吵,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背花椭。 一陣腳步聲響...
    開封第一講書人閱讀 33,616評論 1 274
  • 我被黑心中介騙來泰國打工忽匈, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人矿辽。 一個月前我還...
    沈念sama閱讀 49,091評論 3 378
  • 正文 我出身青樓丹允,卻偏偏與公主長得像,于是被迫代替她去往敵國和親袋倔。 傳聞我的和親對象是個殘疾皇子雕蔽,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,685評論 2 360

推薦閱讀更多精彩內(nèi)容