2.商城后台页面搭建

删除回忆录丶 提交于 2020-01-01 18:15:00

1.导入

注意刚开始并没有node_modules文件夹,不过package.json中依然定义了我们所需的一切依赖

只需要打开终端,进入项目目录,输入:npm install命令,即可安装这些依赖。大概需要几分钟。

在package.json文件中有scripts启动脚本配置,在idea的terminal可以输入命令:npm run dev或者npm start

启动后 控制台:

打开浏览器:

参考:https://www.cnblogs.com/luckyplj/p/11484366.html


域名解析

本地域名解析

浏览器会首先在本机的hosts文件中查找域名映射的IP地址,如果查找到就返回IP ,没找到则进行域名服务器解析,一般本地解析都会失败,因为默认这个文件是空的。

  - Windows下的hosts文件地址:C:/Windows/System32/drivers/etc/hosts
  - Linux下的hosts文件所在路径: /etc/hosts 

域名服务器解析

本地解析失败,才会进行域名服务器解析,域名服务器就是网络中的一台计算机,里面记录了所有注册备案的域名和ip映射关系,一般只要域名是正确的,并且备案通过,一定能找到。

每次在C盘寻找hosts文件并修改是非常麻烦的,推荐一个快捷修改host的工具:switchhosts

http默认端口为80端口(config/index.js中为9001端口),如何才能把请求转移到9001端口呢?

解决端口问题

用到反向代理工具:Nginx

nginx可以作为web服务器,但更多的时候,我们把它作为网关,因为它具备网关必备的功能:

  • 反向代理

  • 负载均衡

  • 动态路由

  • 请求过滤


nginx作为web服务器

Web服务器分2类:

  • web应用服务器,如:tomcat、resin、jetty

  • web服务器,如:Apache 服务器、Nginx、IIS

区分:web服务器不能解析jsp等页面,只能处理js、css、html等静态资源。 并发:web服务器的并发能力远高于web应用服务器。


nginx作为反向代理

什么是反向代理?

  • 代理:通过客户机的配置,实现让一台服务器代理客户机,客户的所有请求都交给代理服务器处理。

  • 反向代理:用一台服务器,代理真实服务器,用户访问时,不再是访问真实服务器,而是代理服务器。

nginx可以当做反向代理服务器来使用:

  • 我们需要提前在nginx中配置好反向代理的规则,不同的请求,交给不同的真实服务器处理

  • 当请求到达nginx,nginx会根据已经定义的规则进行请求的转发,从而实现路由功能

虚拟机下解压nginx,命令tar xvf nginx-1.10.0.tar.gz ,进入文件夹下

输入 ./configure --prefix=/opt/nginx --sbin-path=/usr/bin/nginx

编译安装 make && make install

启动: nginx 停止 nginx -s stop 重新加载 nginx -s load

关闭防火墙 chkconfig iptables off

输入网址查看:

进入opt/nginx/conf下修改nginx.conf

查看自己ip地址:

修改:

server {
        listen       80;
        server_name  manage.leyou.com;

        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

        location / {
            proxy_pass http://192.168.1.101:9001;
            proxy_connect_timeout 600;
            proxy_read_timeout 600;
        }
    }

    server {
        listen       80;
        server_name  api.leyou.com;

        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

        location / {
            proxy_pass http://192.168.1.101:10010;
            proxy_connect_timeout 600;
            proxy_read_timeout 600;
        }
    }

修改本地host文件

修改配置

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!