淘淘商城实现反向代理去掉端口号

￡神魔★判官ぃ 2023-06-10 03:27 87阅读 0赞

### 文章目录 ###

*  需求与思路
 *  实际操作:
 *   *  原始访问方式
     *  改进
     *   *  修改host
         *  修改nginx.conf
         *  重启nginx
         *  查看效果

# 需求与思路 #

> 开发中，可能会有这样一个需求，页面中写的是 ip和端口这种形式，在测试和生产中可能会造成反复修改

`优化思路`: 使用生产环境中的域名，配置开发者本机host文件，让域名走自己的电脑主机，然后使用nginx配置反向代理，让80端口代理本机其他的端口来提供服务。

# 实际操作: #

## 原始访问方式 ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2JhaWR1XzIxMzQ5NjM1_size_16_color_FFFFFF_t_70]

## 改进 ##

### 修改host ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2JhaWR1XzIxMzQ5NjM1_size_16_color_FFFFFF_t_70 1]

### 修改nginx.conf ###

`添加一个upstream和server`

upstream item.taotao.com{
    		server 127.0.0.1:8082;
        }
    	server {
            listen       80;
            server_name  item.taotao.com;
    
            #charset koi8-r;
    
            #access_log  logs/host.access.log  main;
    
            location / {
                proxy_pass   http://item.taotao.com; 
                index  index.html index.htm;
            }
        }

### 重启nginx ###

`start nginx.exe`或者`nginx.exe -s reload`

### 查看效果 ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2JhaWR1XzIxMzQ5NjM1_size_16_color_FFFFFF_t_70 2]

这样就解决了，开发页面写2套路劲的问题。这里还有个好处，就是只暴露了一个80端口。微信开发时候，如果公司不让开发很多端口，也可以用这种思路来处理。

--------------------

收刀!!

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2JhaWR1XzIxMzQ5NjM1_size_16_color_FFFFFF_t_70]: /images/20230531/eca29af591e241249e15182e0f38c652.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2JhaWR1XzIxMzQ5NjM1_size_16_color_FFFFFF_t_70 1]: /images/20230531/f66ddd0691d243ef95696fa9620666f2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2JhaWR1XzIxMzQ5NjM1_size_16_color_FFFFFF_t_70 2]: /images/20230531/5ec9869ba8694234a7eb3a3506da4478.png