We've recently been working on a fairly modern web app and are ready to being deploying it for alpha/beta and getting some real-world experience with it.
我们最近一直致力于开发一个相当现代的Web应用程序，并准备将其部署到alpha / beta并获得一些真实的体验。
We have ASP.Net based web services (Web Api) and a JavaScript front-end which is 100% client-side MVC using backbone.
我们有基于ASP.Net的Web服务（Web Api）和JavaScript前端，它是使用主干的100％客户端MVC。
We have purchased our domain name, and for the sake of this question our deployment looks like this:
我们已经购买了域名，为了这个问题，我们的部署如下：
webservices.mydomain.com (Webservices)
webservices.mydomain.com（Webservices）
mydomain.com (JavaScript front-end)
mydomain.com（JavaScript前端）
If the JavaScript attempts to talk to the webservices on the sub-domain we blow up with cross domain issues, I've played around with CORS but am not satisfied with the cross browser support so I'm counting this out as an option.
如果JavaScript试图与子域上的Web服务进行通信，那么我们就会遇到跨域问题，我已经玩过CORS，但是我不满意跨浏览器的支持，所以我把它作为一个选项。
On our development PC's we have used an IIS reverse proxy to forward all requests to mydomain.com/webservices to webservices.mydomain.com - Which solves all our problems as the browser thinks everything is on the same domain.
在我们的开发PC上，我们使用IIS反向代理将所有请求转发到mydomain.com/webservices到webservices.mydomain.com - 这解决了我们所有的问题，因为浏览器认为一切都在同一个域上。
So my question is, in a public deployment, how is this issue most commonly solved? Is a reverse proxy the right way to do it? If so is there any hosted services that offer a reverse proxy for this situation? Are there better ways of deploying this?
所以我的问题是，在公开部署中，这个问题最常见的解决方法是什么？反向代理是正确的方法吗？如果有，是否有任何托管服务为这种情况提供反向代理？是否有更好的部署方法？
I want to use CloudFront CDN as all our servers/services are hosted with Amazon, I'm really struggling to find info on if a CDN can support this type of setup though.
我想使用CloudFront CDN，因为我们所有的服务器/服务都是由亚马逊托管的，我真的很难找到有关CDN是否可以支持这种类型的设置的信息。
Thanks
谢谢
6 个解决方案
#1
1
What you are trying to do is cross-subdomain calls, and not entirely cross-domain. That are tricks for that: http://www.tomhoppe.com/index.php/2008/03/cross-sub-domain-javascript-ajax-iframe-etc/
您要做的是跨子域调用，而不是完全跨域调用。这是一个技巧：http：//www.tomhoppe.com/index.php/2008/03/cross-sub-domain-javascript-ajax-iframe-etc/
As asked how this issue is most commonly solved. My answer is: this issue is commonly AVOIDED. In real world you would setup your domains such as you don't need to make such ways around just to get your application running or setup a proxy server to forward the calls for you. JSONP is also a hack-ish solution.
至于问到这个问题是如何最常解决的。我的回答是：这个问题通常被避免。在现实世界中，您将设置您的域，例如您不需要为了让您的应用程序运行或设置代理服务器为您转发呼叫而需要这样的方法。 JSONP也是一个黑客攻击解决方案。
#2
1
To allow this Web Service to be called from script, using ASP.NET AJAX, add the following line to the first web service code-behind :
要允许使用ASP.NET AJAX从脚本调用此Web Service，请将以下行添加到第一个Web服务代码隐藏：
[System.Web.Script.Services.ScriptService]
#3
0
You can simply use JSONP for AJAX requests then cross-domain is not an issue.
您可以简单地将JSONP用于AJAX请求，然后跨域不是问题。
If AJAX requests return some HTML, it can be escaped into a JSON string.
如果AJAX请求返回一些HTML，则可以将其转义为JSON字符串。
The second one is a little bit awkward, though.
不过，第二个有点尴尬。
#4
0
You have 2/3 layers
你有2/3层
in the web service code-behin class, add this atribute : <System.Web.Script.Services.ScriptService()> _
在Web服务代码-behin类中，添加此属性：
maybe you need to add this in the System.web node of your web.config:
也许你需要在web.config的System.web节点中添加它：
<webServices>
<protocols>
<add name="AnyHttpSoap"/>
<add name="HttpPost"/>
<add name="HttpGet"/>
</protocols>
</webServices>
In the client-side interface
在客户端界面中
-Add web reference to the service on the subdomain (exmpl. webservices.mydomain.com/svc.asmx) Visual studio make the "proxy class"
- 在子域上添加对该服务的Web引用（例如.webservices.mydomain.com/svc.asmx）Visual Studio制作“代理类”
-add functionality in the masterpage's|page's|control's code behin -Simply call this functions from client-side
- 主页中的-add功能|页面|控件的代码behin -Simply从客户端调用此函数
You can use AJAX functionality with scriptmanager or use another system like JQuery.
您可以在scriptmanager中使用AJAX功能，也可以使用其他系统，如JQuery。
If your main website is compiled in .NET 3.5 or older, you need to add a reference to the namespace System.Web.Extensions and declare it in your web.config file.
如果您的主网站是使用.NET 3.5或更早版本编译的，则需要添加对命名空间System.Web.Extensions的引用，并在web.config文件中声明它。
#5
0
If you have the bandwidth (network I/O and CPU) to handle this, a reverse proxy is an excellent solution. A good reverse proxy will even cache static calls to help mitigate the network delay introduced by the proxy.
如果您有足够的带宽（网络I / O和CPU）来处理这个问题，那么反向代理就是一个很好的解决方案。一个好的反向代理甚至可以缓存静态调用，以帮助缓解代理引入的网络延迟。
The other option is to setup the proper cross domain policy files and/or headers. Doing this in some cloud providers can be hard or even impossible. I recently ran into issues with font files and IE not being happy with cross domain calls. We could not get the cloud storage provider we were using to set the correct headers, so we hosted them locally rather than have to deal with a reverse proxy.
另一种选择是设置正确的跨域策略文件和/或标头。在某些云提供商中执行此操作可能很困难甚至不可能。我最近遇到了字体文件的问题，IE对跨域调用不满意。我们无法获得我们用于设置正确标头的云存储提供程序，因此我们在本地托管它们而不必处理反向代理。
#6
0
easyXDM is a cross domain Javascript plugin that may be worth exploring. It makes use of standards when the browser supports them, and abstracts away the various hacks required when the browser doesn't support the standards. From easyXDM.net:
easyXDM是一个跨域Javascript插件，可能值得探索。它在浏览器支持标准时使用标准，并抽象出浏览器不支持标准时所需的各种黑客。来自easyXDM.net：
easyXDM is a Javascript library that enables you as a developer to easily work around the limitation set in place by the Same Origin Policy, in turn making it easy to communicate and expose javascript API’s across domain boundaries.
easyXDM是一个Javascript库，使您可以作为开发人员轻松解决相同原始策略所设置的限制集，从而使跨域边界的javascript API易于通信和公开。
At the core easyXDM provides a transport stack capable of passing string based messages between two windows, a consumer (the main document) and a provider (a document included using an iframe). It does this by using one of several available techniques, always selecting the most efficient one for the current browser. For all implementations the transport stack offers bi-directionality, reliability, queueing and sender-verification.
在核心，easyXDM提供了一个传输堆栈，能够在两个窗口，消费者（主文档）和提供者（使用iframe包含的文档）之间传递基于字符串的消息。它通过使用几种可用技术之一来实现，始终为当前浏览器选择最有效的技术。对于所有实现，传输堆栈提供双向性，可靠性，排队和发送方验证。
One of the goals of easyXDM is to support all browsers that are in common use, and to provide the same features for all. One of the strategies for reaching this is to follow defined standards, plus using feature detection to assure the use of the most efficient one.
easyXDM的目标之一是支持所有常用的浏览器，并为所有浏览器提供相同的功能。实现这一目标的策略之一是遵循既定标准，并使用特征检测来确保使用最有效的标准。
To quote easy XDM's author:
引用简单的XDM作者：
...sites like LinkedIn, Twitter and Disqus as well as applications run by Nokia and others have built their applications on top of the messaging framework provided by easyXDM.
... LinkedIn，Twitter和Disqus等网站以及诺基亚和其他公司运营的应用程序都在easyXDM提供的消息框架之上构建了应用程序。
So easyXDM is clearly not some poxy hack, but I admit its a big dependency to take on your project.
所以easyXDM显然不是一些poxy hack，但我承认它对你的项目有很大的依赖性。
The current state of the web is that if you want to push the envelop, you have to use feature detection and polyfills, or simply force your users to upgrade to an HTML5 browser. If that makes you squirm, you're not alone, but the polyfills are a kind of temporary evil needed to get from where the web is to where we'd like it to be.
Web的当前状态是，如果要推送信封，则必须使用功能检测和polyfill，或者只是强制用户升级到HTML5浏览器。如果这让你感到不安，那么你并不孤单，但是填充物是一种暂时的邪恶，需要从网络到达我们想要的地方。
See also this SO question.
另见这个问题。
#1
1
What you are trying to do is cross-subdomain calls, and not entirely cross-domain. That are tricks for that: http://www.tomhoppe.com/index.php/2008/03/cross-sub-domain-javascript-ajax-iframe-etc/
您要做的是跨子域调用，而不是完全跨域调用。这是一个技巧：http：//www.tomhoppe.com/index.php/2008/03/cross-sub-domain-javascript-ajax-iframe-etc/
As asked how this issue is most commonly solved. My answer is: this issue is commonly AVOIDED. In real world you would setup your domains such as you don't need to make such ways around just to get your application running or setup a proxy server to forward the calls for you. JSONP is also a hack-ish solution.
至于问到这个问题是如何最常解决的。我的回答是：这个问题通常被避免。在现实世界中，您将设置您的域，例如您不需要为了让您的应用程序运行或设置代理服务器为您转发呼叫而需要这样的方法。 JSONP也是一个黑客攻击解决方案。
#2
1
To allow this Web Service to be called from script, using ASP.NET AJAX, add the following line to the first web service code-behind :
要允许使用ASP.NET AJAX从脚本调用此Web Service，请将以下行添加到第一个Web服务代码隐藏：
[System.Web.Script.Services.ScriptService]
#3
0
You can simply use JSONP for AJAX requests then cross-domain is not an issue.
您可以简单地将JSONP用于AJAX请求，然后跨域不是问题。
If AJAX requests return some HTML, it can be escaped into a JSON string.
如果AJAX请求返回一些HTML，则可以将其转义为JSON字符串。
The second one is a little bit awkward, though.
不过，第二个有点尴尬。
#4
0
You have 2/3 layers
你有2/3层
in the web service code-behin class, add this atribute : <System.Web.Script.Services.ScriptService()> _
在Web服务代码-behin类中，添加此属性：
maybe you need to add this in the System.web node of your web.config:
也许你需要在web.config的System.web节点中添加它：
<webServices>
<protocols>
<add name="AnyHttpSoap"/>
<add name="HttpPost"/>
<add name="HttpGet"/>
</protocols>
</webServices>
In the client-side interface
在客户端界面中
-Add web reference to the service on the subdomain (exmpl. webservices.mydomain.com/svc.asmx) Visual studio make the "proxy class"
- 在子域上添加对该服务的Web引用（例如.webservices.mydomain.com/svc.asmx）Visual Studio制作“代理类”
-add functionality in the masterpage's|page's|control's code behin -Simply call this functions from client-side
- 主页中的-add功能|页面|控件的代码behin -Simply从客户端调用此函数
You can use AJAX functionality with scriptmanager or use another system like JQuery.
您可以在scriptmanager中使用AJAX功能，也可以使用其他系统，如JQuery。
If your main website is compiled in .NET 3.5 or older, you need to add a reference to the namespace System.Web.Extensions and declare it in your web.config file.
如果您的主网站是使用.NET 3.5或更早版本编译的，则需要添加对命名空间System.Web.Extensions的引用，并在web.config文件中声明它。
#5
0
If you have the bandwidth (network I/O and CPU) to handle this, a reverse proxy is an excellent solution. A good reverse proxy will even cache static calls to help mitigate the network delay introduced by the proxy.
如果您有足够的带宽（网络I / O和CPU）来处理这个问题，那么反向代理就是一个很好的解决方案。一个好的反向代理甚至可以缓存静态调用，以帮助缓解代理引入的网络延迟。
The other option is to setup the proper cross domain policy files and/or headers. Doing this in some cloud providers can be hard or even impossible. I recently ran into issues with font files and IE not being happy with cross domain calls. We could not get the cloud storage provider we were using to set the correct headers, so we hosted them locally rather than have to deal with a reverse proxy.
另一种选择是设置正确的跨域策略文件和/或标头。在某些云提供商中执行此操作可能很困难甚至不可能。我最近遇到了字体文件的问题，IE对跨域调用不满意。我们无法获得我们用于设置正确标头的云存储提供程序，因此我们在本地托管它们而不必处理反向代理。
#6
0
easyXDM is a cross domain Javascript plugin that may be worth exploring. It makes use of standards when the browser supports them, and abstracts away the various hacks required when the browser doesn't support the standards. From easyXDM.net:
easyXDM是一个跨域Javascript插件，可能值得探索。它在浏览器支持标准时使用标准，并抽象出浏览器不支持标准时所需的各种黑客。来自easyXDM.net：
easyXDM is a Javascript library that enables you as a developer to easily work around the limitation set in place by the Same Origin Policy, in turn making it easy to communicate and expose javascript API’s across domain boundaries.
easyXDM是一个Javascript库，使您可以作为开发人员轻松解决相同原始策略所设置的限制集，从而使跨域边界的javascript API易于通信和公开。
At the core easyXDM provides a transport stack capable of passing string based messages between two windows, a consumer (the main document) and a provider (a document included using an iframe). It does this by using one of several available techniques, always selecting the most efficient one for the current browser. For all implementations the transport stack offers bi-directionality, reliability, queueing and sender-verification.
在核心，easyXDM提供了一个传输堆栈，能够在两个窗口，消费者（主文档）和提供者（使用iframe包含的文档）之间传递基于字符串的消息。它通过使用几种可用技术之一来实现，始终为当前浏览器选择最有效的技术。对于所有实现，传输堆栈提供双向性，可靠性，排队和发送方验证。
One of the goals of easyXDM is to support all browsers that are in common use, and to provide the same features for all. One of the strategies for reaching this is to follow defined standards, plus using feature detection to assure the use of the most efficient one.
easyXDM的目标之一是支持所有常用的浏览器，并为所有浏览器提供相同的功能。实现这一目标的策略之一是遵循既定标准，并使用特征检测来确保使用最有效的标准。
To quote easy XDM's author:
引用简单的XDM作者：
...sites like LinkedIn, Twitter and Disqus as well as applications run by Nokia and others have built their applications on top of the messaging framework provided by easyXDM.
... LinkedIn，Twitter和Disqus等网站以及诺基亚和其他公司运营的应用程序都在easyXDM提供的消息框架之上构建了应用程序。
So easyXDM is clearly not some poxy hack, but I admit its a big dependency to take on your project.
所以easyXDM显然不是一些poxy hack，但我承认它对你的项目有很大的依赖性。
The current state of the web is that if you want to push the envelop, you have to use feature detection and polyfills, or simply force your users to upgrade to an HTML5 browser. If that makes you squirm, you're not alone, but the polyfills are a kind of temporary evil needed to get from where the web is to where we'd like it to be.
Web的当前状态是，如果要推送信封，则必须使用功能检测和polyfill，或者只是强制用户升级到HTML5浏览器。如果这让你感到不安，那么你并不孤单，但是填充物是一种暂时的邪恶，需要从网络到达我们想要的地方。
See also this SO question.
另见这个问题。