场景1:假设局域网启动了一个禅道(管理项目的一个后台系统),ip为10.10.119.66:8081,我当然可以直接通过10.10.119.66:8081来访问到禅道了。但是我还想让别人都用个域名www.lidisam.cn:8081来访问禅道。
解决步骤:
1 打开 C:\Windows\System32\drivers\etc\hosts,并编辑添加一行如下:
10.10.119.66 www.lidisam.cn
2 然后我们再网站输入"www.lidisam.cn:8081"即可跳转到禅道上了
原因分析:为什么修改了这个会生效?是DNS解析的原因,默认DNS会去13个节点的根域名访问,拿到当前域名对应真实IP地址,但是如果本地hosts设置了就会优先使用hosts设置的(比如上面所设置的)。
场景2:假设我现在想抓手机访问浏览器的http请求
解决步骤:
1 首先下一个fiddler,并配置(教程如:https://jingyan.baidu.com/article/03b2f78c7b6bb05ea237aed2.html)
2 然后我用手机访问网站的http请求就能被其抓到了
场景3:假设www.lidisam.cn是正式环境的一个域名,这是一个前后端分离的H5项目(SpringBoot + Vuejs),我在本地运行它的SpringBoot代码,但是我没有Vuejs代码,我想用线上的vuejs代码,然后请求的后端都会请求到我本地跑的程序上
解决步骤:
1 打开 C:\Windows\System32\drivers\etc\hosts,并编辑添加一行如下:
127.0.0.1 www.lidisam.cn
2 配置好”场景2“的fiddler,手机开启代理
3 启动本地SpringBoot项目(这里是80端口启动),给本地的SpringBoot项目打好断点
4 手机访问H5,随便点几下,我们就可以看到访问的请求请求到本地程序了,到断点那个位置停住了
场景4:假设在"场景3"做一点小改动,把SpringBoot项目启动的端口改为8080(80都是扯谈,8080这种才是正常的端口),改完之后,我还是想要请求的后端都会请求到我本地跑的程序上
解决步骤:
1 打开 C:\Windows\System32\drivers\etc\hosts,并编辑添加一行如下:
127.0.0.1 www.lidisam.cn
2 配置好”场景2“的fiddler,手机开启代理
3 启动本地SpringBoot项目(这里是8080端口启动),给本地的SpringBoot项目打好断点
4 到"http://nginx.org/en/download.html"下载一个nginx用于反向代理,修改nginx.conf如下,并重启
--------------nginx.conf-----------------
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
include myconf/*.conf;
server{
listen 80;
server_name www.lidisam.cn;
location ~ (^/jsp|.json$){
proxy_pass http://localhost:8080; # 你本地程序tomcat地址
}
}
}
-------------------------------------------
5 手机访问H5,随便点几下,我们就可以看到访问的请求请求到本地程序了,到断点那个位置停住了
场景5:假设因为某种原因(也有可能是没开发环境),当前开发分支不能合并到开发环境的分支中。这时候需要前端(Vuejs)与后端(SpringBoot)在本地局域网联调,但这就会出现域不一样导致的跨域问题
前置说明:
前端使用npm run dev 启动本地的vue项目,端口是8080,假设他电脑的ip是10.10.119.60。我这边后端的ip地址是10.10.119.61,如果前端的本地直接访问我这个ip,那肯定会出现跨域问题(毕竟域名不一样)。所以下面可通过代理设置在同一个域名。
解决步骤:
1 前端那边(ip=10.10.119.60)打开 C:\Windows\System32\drivers\etc\hosts,并编辑添加一行如下:
127.0.0.1 www.lidisam.cn
2 我这边(ip=10.10.119.61)启动本地SpringBoot项目(这里是8080端口启动),给本地的SpringBoot项目打好断点
3 前端那边(ip=10.10.119.60)启动Vuejs项目(这里也是8080端口启动),然后我们可以配置nginx如下:
-------------------------------------------
server{
listen 80;
server_name www.lidisam.cn;
default_type 'text/html';
charset utf-8;
# 后端
location /xxx {
proxy_pass http://10.10.119.61:8080/;
}
# 前端
location / {
proxy_pass http://127.0.0.1:8080;
}
}
-------------------------------------------
上面的意思是:请求www.lidisam.cn/xxx/*路径下的所有资源,流量都会访问到我的后端(ip=10.10.119.60),并且假设访问www.lidisam.cn/xxx/detail/1,就会访问到10.10.119.60:8080/detail/1;请求到“/”路径,即第一个路径非/xxx时,就会访问到前端资源(ip=10.10.119.60:8080及其下所有非/xxx开头的路径)。为什么是这样设置?
4 前端(ip=10.10.119.61)那台机随便点下本地跑起来的前端,就可以看到后端运行到断点的位置了,这样就解决了跨域问题了。
场景6:如何用内网穿透的方式解决微信本地开发无法开发的问题
由于微信开发有不少接口,微信需要回调请求,但是因为在本地开发,微信是访问不了局域网ip的,所以只能通过内网穿透的方式让微信那边访问的到。
标签:lidisam,cn,ip,前端,对接,www,本地,10.10 From: https://blog.51cto.com/u_13854513/6710906