WebApi中将静态页面作为首页

使用场景

在我的项目中使用Asp.Net WebApi作为后端数据服务,使用Vue作为前端Web,在服务器IIS上部署时需要占用两个端口,一个是80端口,用户在浏览器上从这个端口获取打包好的Web页面;另一个是8080端口,Web页面从此端口获取或提交数据,访问8080端口需要跨域。这种方式客户不认可,只能占用一个80端口,不允许其他端口开放,所以就将打包的Web放在WebApi中。

解决方法

  1. 打包好的Web目录如下

  2. WebApi项目目录如下

  3. 将Web中static目录和favicon.ico复制到WebApi项目中

  4. 打开Views文件夹,将_ViewStart.cshtml中的内容全部删除

  5. 将Web目录中index.html文件的内容复制出来,拷贝到Views/Home/Index.cshtml中,整理后Views/Home/Index.cshtml的内容为

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>标题</title>
    <link rel="shortcut icon" href=./favicon.ico>
    <link href=./static/css/app.abb198de0270a22c35f32ccf9a4a1b01.css rel=stylesheet>
    </head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <body>
    <div id=app></div>
    <script type=text/javascript src=./static/js/manifest.be49c78c7e5a838dd267.js></script>
    <script type=text/javascript src=./static/js/vendor.3275876546e3749f8058.js></script>
    <script type=text/javascript src=./static/js/app.2c59f6f538120ab824c2.js></script> </body>
    </html>

    可能会遇到标题乱码的情况,在Views/Home/Index.cshtml中中添加

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    就好了

WebApi中将静态页面作为首页的更多相关文章

  1. html+css实现小米商城首页静态页面

    学了一个星期的html和css,用新学的东西写点东西,仿照小米商城的首页按照它的页面布局盗用它的图片写了个小米商城的静态页面. 源代码:链接:https://pan.baidu.com/s/1qf63 ...

  2. 仿新浪首页、主题、详情页,纯html静态页面

    仿新浪首页.主题.详情页.纯html静态页面,下载地址: http://download.csdn.net/detail/sweetsuzyhyf/8085535

  3. Freemarker生成HTML静态页面

    这段时间的工作是做一个网址导航的项目,面向用户的就是一个首页,于是就想到了使用freemarker这个模板引擎来对首页静态化. 之前是用jsp实现,为了避免用户每次打开页面都查询一次数据库,所以使用了 ...

  4. 浅谈php生成静态页面

    一.引 言 在速度上,静态页面要比动态页面的比方php快很多,这是毫无疑问的,但是由于静态页面的灵活性较差,如果不借助数据库或其他的设备保存相关信息的话,整体的管理上比较繁琐,比方修改编辑.比方阅读权 ...

  5. C#根据网址生成静态页面

    HoverTree开源项目中HoverTreeWeb.HVTPanel的Index.aspx文件 是后台管理的首页. 包含生成留言板首页,以及显示用户名,退出等功能. 根据网址生成页面的方法: boo ...

  6. 用 Smarty 生成静态页面入门介绍

    why Smarty? 随着公司首页(以下简称首页)流量越来越大,最近开始考虑使用后台语言生成静态页面的技术. 我们知道,一个简单页面一般是一个 .html(或者 .htm ..shtml)后缀的文件 ...

  7. 根据一个旅游网站的psd素材还原的静态页面

    自学web前端的html.css和jquery两个月,想检验下自己的学习成果,遂从网上下了个关于旅游网站的psd素材,自己照着素材还原网站的静态页面. 这是我制作好的静态页面的压缩文件:旅游网站首页. ...

  8. 用phpcms如何将静态页面制作成企业网站,头部加尾部

    首先,先要准备好这个静态网页的源文件,如图 bs里面是一些css和js的文件,img则是放图片的,文件中的index是网页的首页 运行一下,看看 是这样的 然后打开phpcms文件,上篇博客中有提到, ...

  9. 用phpcms如何将静态页面制作成企业网站(中)

    上篇博客中讲到了该修改网页的中间部分 中间的内容是这样的,有标题和内容,里面的内容被代码替代,运行起来就这样的 里面的内容就可以在后台管理那里添加 再来看代码部分 <div class=&quo ...

随机推荐

  1. kotlin基础 密封类

    密封类 密封类用来表示受限的类继承结构:当一个值为有限几种的类型, 而不能有任何其他类型时.在某种意义上,他们是枚举类的扩展:枚举类型的值集合 也是受限的,但每个枚举常量只存在一个实例,而密封类 的一 ...

  2. 运维笔记--Linux查找指定目录下包含某字符串的文件

    待整理: 参考:http://blog.sina.com.cn/s/blog_53d496960102xg5c.html 例: find /home/logstash/ -type f | xargs ...

  3. Centos新服务器需要安装的必备软件包

    yum install -y gcc gcc-c++ kernel-devel yum install -y pcre pcre-devel yum install -y zlib zlib-deve ...

  4. a dynamic resume

    介绍 发现一款开源的动画简历工程, 很是吸引眼球, 分享出来. 技术: 1. npm工程管理 2. vuejs 设计上,将工程分为两个组件: 0.程序入口组件 1. 编辑器组件 2. 简历展示组件 流 ...

  5. 【LeetCode算法-58/66】Length of Last Word/Plus One

    LeetCode第58题: Given a string s consists of upper/lower-case alphabets and empty space characters ' ' ...

  6. nginx过滤access_log中HEAD、OPTIONS请求记录

    网上很多教程说是这样做: if ($request_method = HEAD) { access_log off; } 试了之后是不行的,正确的做法如下: http { map $request_m ...

  7. idea 模糊搜索 ctrl + f(单词不完整搜索不到的解决办法)

    1,现象描述,笔者在用 idea 的 ctrl + f 搜索文件的内容时,发现了很神奇的问题,就是字符串必须输入完整才能搜索到,输入一半,哪怕是个字母输入了9个也搜不到 2,可以发现,就差一个字母 h ...

  8. 隐马尔科夫模型的Python3实现代码

    下面给出计算隐马尔科夫模型的编程代码: from hmmlearn.hmm import GaussianHMM import datetime import numpy as np from mat ...

  9. maven 国内镜像

    <mirrors> <!-- mirror | Specifies a repository mirror site to use instead of a given reposi ...

  10. Intellij IDEA设置类注释和方法注释

    背景:工欲善其事必先利其器,如果不能把工具用熟练了, 感觉很是别扭. 参考:IntelliJ IDEA设置类注释和方法注释 IntelliJ IDEA 中创建类的时候,可以直接自动给类加注释的设置,以 ...