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

时间:2017-02-03 13:42:53

标签: c# angularjs visual-studio-2015

我在Visual Studio中构建了一个带有角度ui-routing的单页面应用程序。这个前端应用程序运行良好。请注意,我没有基于MVC架构构建此前端。它基于angular seed's project

问题:

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

  1. 它应该在不同的Visual Studio解决方案中。我的客户端希望前端是静态的,当我们决定将后端更改为python时,我们可以重用前端。
  2. 两者都应该在同一个端口上运行。例如,现在前端运行在localhost:13000上。然后后端应该在localhost:13000 / api上运行。
  3. 不使用Nginx。该应用程序将安装在用户的计算机上,安装Nginx对于业余用户来说很难。
  4. 可能的解决方案:

    1. 构建通常的MVC。前端和后端位于同一Visual Studio的解决方案中。但这与标准#1相撞。
    2. 为前端和后端构建单独的解决方案。每个都在不同的端口上运行并相互通信。但是存在安全问题,它也与标准#2相冲突。
    3. 使用Nginx来代理"代理"两个港口。但这与标准#3相撞。
    4. 构建一个自托管C#服务器,用于处理来自前端和后端的请求。现在我正在尝试基于David's simple web server构建它。到目前为止,这满足所有三个标准,但它只接受" String"请求。所有图片和Glyphicons都不起作用。配置Web服务器以接受所有类型的请求将是很多工作。
    5. 我的问题:

      1. 有更简单的方法吗?我已经阅读了一些关于OWIN的内容,但不确定这是否是我遇到此问题的原因。
      2. 如果解决方案#4是最好的方法,是否有关于如何正确配置我的Web服务器的指南?
      3. 如果解决方案#4是最好的方法,那么如何为此处理单独的路由?我希望页面使用我在app.js中设置的路由,并且只在调用api时使用后端路由。
      4. 非常感谢你的关注。

3 个答案:

答案 0 :(得分:4)

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

  1. www.company.com创建一个名为company.com的网站
  2. www.company.com/app在company.com下创建一个名为app的虚拟应用程序,这将是您的角度应用程序所在的位置
  3. www.company.com/api在company.com下创建一个名为api的虚拟应用程序,这将是您的Web API所在的位置。它可以是.NET应用程序。
  4. 如果你迁移到PHP,你可能需要调整网站设置,但它仍然是一个很好的计划。

答案 1 :(得分:1)

我已经将@ fireydude的虚拟目录方法用于以前的单服务器托管项目,但如果您说您需要在每个用户上安装网站本身#39; s机器,然后是的,您可能最容易使用自托管方法实现此目的。

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

如果强制使用WebApi,请查看

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

另一方面,如果您有这样的自由,我强烈建议您查看ServiceStack框架 - 它非常好,非常快,具有更好的基于消息的API方法(类似于那些认可的方法)亚马逊,谷歌等)

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

答案 2 :(得分:0)

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

我在" visual studio code"以及" visual studio 2015"中的后端(api)构建网站。 API的Publish文件夹位于网站发布文件夹中。

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

我使用IIS并将www.example.com文件夹转换为网站。 该网站可在" www.example.com" &api on" www.example.com/api"。

在前端,我需要从后端请求日期,如下所示:

www.example.com/api/items