SignalR 跨域设置
参考文章:http://www.cnblogs.com/nywd/p/3691813.html
上一节,已经实现了,当前域内的通信,这一节中,介绍一下跨域的即时通信,既然要做,我们肯定要把这个推送及聊天服务器做为一个单独的服务器,以方便扩展使用,这样就要使用跨域技术,既然基于ajax,那么跨域肯定是基于jsonp,下面我们介绍一下跨域的基本配置:
1、服务器的配置,我们打开项目中的Global.asax,在Application_Start中做如下配置:
protected void Application_Start()
{
var config = new HubConfiguration();
config.EnableCrossDomain = true;
RouteTable.Routes.MapHubs(config);
AreaRegistration.RegisterAllAreas(); WebApiConfig.Register(GlobalConfiguration.Configuration);
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes); }
config.EnableCrossDomain = true;
这句代码,就指定了当前的所有集线器都可以跨域进行使用。
2、web端配置,我们新建一个项目,然后添加一个html页面,msg.html,添加header部分:
<script src="/Scripts/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="/Scripts/json2.js" type="text/javascript"></script>
<script src="/Scripts/jquery.signalR-1.0.1.min.js" type="text/javascript"></script>
<script src="http://localhost:2154/signalr/hubs" type="text/javascript"></script>
http://localhost:2154/signalr/hubs 就是我们推送服务器的地址了,如果真正上线了,肯定使用推送服务器的域名地址,如:push.xxx.com,然后我们来写js方法,html部分基本一致:
<script type="text/javascript"> $(function () { $.connection.hub.url = "http://localhost:2154/signalr";
// Proxy created on the fly
var chat = $.connection.pushHub;
// Declare a function on the chat hub so the server can invoke it
chat.client.addMessage = function (message) {
writeEvent('<b>ny</b> 对大家说: ' + message, 'event-message');
}; $("#broadcast").click(function () {
// Call the chat method on the server
chat.server.send($('#msg').val())
.done(function () {
console.log('Sent message success!');
})
.fail(function (e) {
console.warn(e);
});
}); // Start the connection $.connection.hub.start({ xdomain: true}); //A function to write events to the page
function writeEvent(eventLog, logClass) {
var now = new Date();
var nowStr = now.getHours() + ':' + now.getMinutes() + ':' + now.getSeconds();
$('#messages').prepend('<li class="' + logClass + '"><b>' + nowStr + '</b> ' + eventLog + '.</li>');
}
});
</script>
1、首先要指定hub根地址:$.connection.hub.url = "http://localhost:2154/signalr";
2、启动连接时,添加跨域参数: $.connection.hub.start({ xdomain: true});
很简单,现在配置已经完成了,我们来启动浏览器测试一下:
可以看到,2个web服务器之间已经实现了互通,而且我们指定使用ie7,说明兼容性是很好的,xp都淘汰了ie6咱也就不测了: )。
接下来我们要做什么,找个ui设计师,把我们站点的聊天窗口美化一下,做个iframe,在右下角,点击,既出现我们的聊天界面,然后和其他客户端的用户还有我们的客服人员进行聊天,是不是很赞,
要开饭了,明天我们继续介绍客户端连接SignalR,以实现商家客户端和用户直接通信。
SignalR 跨域设置的更多相关文章
- chrome浏览器的跨域设置——包括版本49前后两种设置
做前后分离的webapp开发的时候,出于一些原因往往需要将浏览器设置成支持跨域的模式,好在chrome浏览器就是支持可跨域的设置,网上也有很多chrome跨域设置教程.但是新版本的chrome浏览器提 ...
- vue-cli的跨域设置
概述 今天打算快速使用vue-cli建立一个小应用用于测试,使用axios发送http请求,但是遇到了跨域问题,总结了一下,供以后开发时参考,相信对其他人也有用. vue-cli的跨域设置 在vue. ...
- WebApi服务以及跨域设置
WCF 它利用TCP.HTTP.MSMQ等传输协议构建“契约先行”的服务.WCF最初为基于SOAP的服务而设计[xml],繁琐.冗余.慢.沉重 WebApi 基于http协议,轻量级的,支持URL路由 ...
- Mac下的Chrome或Safari访问跨域设置,MBP上使用模拟器Simulator.app或iphone+Safari调试网页
Mac下的Chrome或Safari访问跨域设置: mac下终端启动Chrome $ open -a Google\ Chrome --args --disable-web-security 或 /A ...
- Asp.net core 跨域设置
验证环境: dotnet core 2.1/Asp.net core2.1 一.作用域在中间件层 配置的方式是在startup.cs文件Configure(IApplicationBuilder a ...
- chrome浏览器的跨域设置 Google Chrome浏览器下开启禁用缓存和js跨域限制--disable-web-security
chrome用户默认路径 Win7:C:\Users\[用户名]\AppData\Local\Google\Chrome\User Data\XP:C:\Documents and Settings\ ...
- jexus手动跨域设置
AP.NET MVC默认跨域方法如下: <system.webServer> <validation validateIntegratedModeConfiguration=&quo ...
- SSO单点登录、跨域重定向、跨域设置Cookie、京东单点登录实例分析
最近在研究SSO单点登录技术,其中有一种就是通过js的跨域设置cookie来达到单点登录目的的,下面就已京东商城为例来解释下跨域设置cookie的过程 涉及的关键知识点: 1.jquery ajax跨 ...
- Chrome Ajax 跨域设置
一.前言 web 开发中 Ajax 是十分常见的技术,但是在前后端使用接口对接的调试过程中不可避免会碰到跨域问题.今天我给大家介绍一个十分简单有效的方法. 跨域经典错误 二.Chrome 跨域设置 首 ...
随机推荐
- 【Linux 命令】Linux系统下强制用户下线——who,pkill
[日期]2014年11月18日 [平台]Centos 6.5 [工具]who pkill [步骤] 1)准备工作 以root身份登录. 2)执行who命令,查看有哪些用户已登录到当前主机
- 数组(Array)
1. 数组(Array):相同类型数据的集合就叫做数组. 2. 数组的定义与赋值(系统会默认初始化) 普通数组: package com.li; public class Array{ public ...
- leetcode@ [300] Longest Increasing Subsequence (记忆化搜索)
https://leetcode.com/problems/longest-increasing-subsequence/ Given an unsorted array of integers, f ...
- Packetbeat协议扩展开发教程(3)
原文链接:http://elasticsearch.cn/article/54 书接上回:http://elasticsearch.cn/article/53 前面介绍了Packetbeat的项目结构 ...
- 推荐eclipse velocity一款插件 --- veloeclipse
vm文件在eclipse展示很丑,关键字没有颜色之差.这里,推荐一款极其好用的velocity插件 -- veloeclipse 在 Eclipse 版本 4.5.0, 离线安装 Veloeclip ...
- innobackupex 单脚本循环7天一全备6增备脚本更新
#!/bin/bash #日期转为天数 function date2days { echo "$*" | awk '{ z=-$)/); y=$+-z; m=$+*z-; j=*m ...
- SpringMVC学习 DispatcherServlet (转载)
3.1.DispatcherServlet作用 DispatcherServlet是前端控制器设计模式的实现,提供spring Web MVC的集中访问点,而且负责职责的分派,而且与Spring Io ...
- 学习 MFC之 工具栏(二)
对于InitToolBar()函数进行进一步解析: 1.首先声明一个全局对象: CToolBar m_toolbar; 2.然后用create()创建toolbar: //创建ToolBar工具条 ...
- centos yum安装mysql
查看有没有安装包 # yum list mysql 安装mysql客户端 # yum install mysql # yum list mysql-server 安装mysql 服务器端 # yum ...
- Linux SO_KEEPALIVE属性,心跳
对于面向连接的TCP socket,在实际应用中通常都要检測对端是否处于连接中,连接port分两种情况: 1.连接正常关闭,调用close() shutdown()连接优雅关闭,send与recv立刻 ...