角度前端和C＃后端在不同的VS解决方案中

I have built a single-page-application with angular ui-routing in Visual Studio. This front-end application works well. Notes that I don't build this front-end based on MVC architecture. It is based on angular seed's project.

我在Visual Studio中构建了一个带有角度ui-routing的单页面应用程序。这个前端应用程序运行良好。请注意，我没有基于MVC架构构建此前端。它基于角度种子的项目。

The problem:

问题：

Now I need to build a C# back-end that handles api call. The criteria are:

现在我需要构建一个处理api调用的C＃后端。标准是：

It should be in different Visual Studio's solution. My client want the front-end to be static and when we decide for example, to change the back-end to python, we can just reuse the front-end.
它应该在不同的Visual Studio解决方案中。我的客户端希望前端是静态的，当我们决定将后端更改为python时，我们可以重用前端。
Both should run on the same port. For example, now the front-end runs on localhost:13000. Then the back-end should run on localhost:13000/api.
两者都应该在同一个端口上运行。例如，现在前端运行在localhost：13000上。然后后端应该在localhost：13000 / api上运行。
Not using Nginx. This application will be installed on user's computer and installing Nginx is hard for amateur user.
不使用Nginx。此应用程序将安装在用户的计算机上，并且安装Nginx对于业余用户来说很难。

Possible Solution:

可能解决方案

Build the usual MVC. Where the Front-End and Back-End located on the same Visual Studio's solution. But this collides with criteria #1.
构建通常的MVC。前端和后端位于同一Visual Studio的解决方案中。但这与标准＃1相冲突。
Build a separate solution for Front-End and Back-End. Each run on different port and communicate with each other. But there's a security issue and it also collides with criteria #2.
为前端和后端构建单独的解决方案。每个都在不同的端口上运行并相互通信。但是存在安全问题，它也与标准＃2相冲突。
Use Nginx to "proxy" both port. But this collide with criteria #3.
使用Nginx“代理”两个端口。但这与标准＃3相冲突。
Build a self-hosting C# Server that handles both request from Front-End and Back-End. Right now I'm trying to build it based on David's simple web server. So far this satisfy all three criteria, but it only accepts "String" request. All picture and Glyphicons is not working. It will be a lot of work to configure the web server to accept all type of request.
构建一个自托管C＃服务器，它处理来自前端和后端的请求。现在我正在尝试基于David的简单Web服务器构建它。到目前为止，这满足所有三个标准，但它只接受“字符串”请求。所有图片和Glyphicons都不起作用。配置Web服务器以接受所有类型的请求将是很多工作。

My Question:

我的问题：

Are there easier way to do this? I've read a bit about OWIN but not sure if that's the one that I need for this problem.
有更简单的方法吗？我已经阅读了一些关于OWIN的内容，但不确定这是否是我需要的问题。
If Solution #4 is the best way, are there some kind of guide upon how to configure my web server correctly?
如果解决方案＃4是最好的方法，是否有关于如何正确配置我的Web服务器的某种指导？
If Solution #4 is the best way, how to handle a separate routing for this? I want the page to use the routing I set in app.js and only using the routing in back-end when calling api.
如果解决方案＃4是最好的方法，那么如何为此处理单独的路由？我希望页面使用我在app.js中设置的路由，并且只在调用api时使用后端路由。

Thank you so much for your attention.

非常感谢你的关注。

3 个解决方案

#1

I would suggest that you should have 2 Virtual Applications running under the same website in IIS. If you go into IIS you can create a website and then create a Virtual Application under it. For example;

我建议您在IIS中的同一网站下运行2个虚拟应用程序。如果您进入IIS，您可以创建一个网站，然后在其下创建一个虚拟应用程序。例如;

www.company.com Create a website called company.com
www.company.com创建一个名为company.com的网站
www.company.com/app Create a virtual application under company.com which is called app and this will be where your angular application lives
www.company.com/app在company.com下创建一个名为app的虚拟应用程序，这将是您的角度应用程序所在的位置
www.company.com/apiCreate a virtual application under company.com which is called api and this will be where your web API lives. It can be a .NET application.
www.company.com/api在company.com下创建一个名为api的虚拟应用程序，这将是您的Web API所在的位置。它可以是.NET应用程序。

If you migrate to PHP you may have to tweak the website settings but it's still a good plan.

如果你迁移到PHP，你可能需要调整网站设置，但它仍然是一个很好的计划。

#2

I have used @fireydude's virtual directory approach for a previous single-server hosted project, but if you are saying that you need to install the website itself on each user's machine, then yes, you will probably most easily achieve this using a self-hosted approach.

我曾经使用@ fireydude的虚拟目录方法来处理以前的单服务器托管项目，但如果你说你需要在每个用户的机器上安装网站，那么是的，你可能最容易通过自托管实现这一点做法。

Look at OWIN self hosting, in particular you might look for sample code where people use self hosted approaches to implement their end-to-end integration tests - i have done this exact thing for my current project, but unfortunately it is proprietary code and I cannot share it here.

看看OWIN自托管，特别是你可能会寻找人们使用自托管方法来实现端到端集成测试的示例代码 - 我已经为我当前的项目做了这件事，但不幸的是它是专有代码而我不能在这里分享。

If you forced to use WebApi, take a look at

如果您*使用WebApi，请查看

https://docs.microsoft.com/en-us/aspnet/web-api/overview/hosting-aspnet-web-api/use-owin-to-self-host-web-api

On the otherhand, if you have the freedom to do so, I highly recommend that you take a look into the ServiceStack framework - It is excellent, very fast, with a nicer message-based API approach (similar to those endorsed by Amazon, Google etc)

另一方面，如果您有这样的*，我强烈建议您查看ServiceStack框架 - 它非常好，非常快，具有更好的基于消息的API方法（类似于亚马逊，Google认可的那些方法）等等）

http://docs.servicestack.net/self-hosting

#3

I have some how the same project structur, but i dont use angular. I hope i may help you.

我有一些相同的项目结构，但我不使用角度。我希望我可以帮助你。

I build the website in "visual studio code", and the back end (api) in "visual studio 2015". The Publish folder for the API is in the website release folder.

我在“visual studio code”中构建了网站，在“visual studio 2015”中构建了后端（api）。 API的Publish文件夹位于网站发布文件夹中。

root/inetpup/sites/www.example.com
root/inetpup/sites/www.example.com/api

I use an IIS and transformed the www.example.com folder into an website. The website is available on "www.example.com" and the api on "www.example.com/api".

我使用IIS并将www.example.com文件夹转换为网站。该网站可在“www.example.com”上找到，api在“www.example.com/api”上找到。

At the front-end i need to request the date from the back end as follows:

在前端，我需要从后端请求日期如下：

www.example.com/api/items

#1