angular http请求路径IP地址重复
现象描述
写了一个angular项目，测试多次都没问题，就要打包部署到云端服务器去，部署完成之后，打开页面访问，部分数据资源都查不到结果，之后返回预设的访问未经授权地址的报错信息。
我都用admin账号了，自然所有后台接口都应该是畅快访问的，为什么会权限问题呢？一个简单的get请求，没多少严苛要求啊，不用想，是不是路径错了，打开控制台，果然，请求地址里面，有两个IP地址，类似下图：
现象.png
虽然一开始我想直接开始甩锅，毕竟本地测试那么久都没问题，现在部署上去，怎么会突然出现问题呢？但是这个是请求地址有误啊，莫名奇妙两个IP，怎么看都是前端的问题。我就想说用域名啊，可惜说域名不稳定，经常ping不同，后续再解决。
我们几个人就看了很久，能想到请求相关的就请求数据的service、http拦截器等等地方，看起来都很正常。IP地址出现的文件就一个，就两行，地址看起来也正确，过网关什么的path也有加。到底哪里出的问题？
因为咋看之下，只是请求的IP地址重复了，还不一定把锅甩给谁，虽然知道是大概率是自己的，但是还是去排查看看是不是部署的容器问题了、静态资源服务器配置的问题了等等。
其实这类问题有个查锅最快的方式，就是抓包，哪里有问题一眼就出来，不出所料，请求在出去的时候，就已经IP重复了，根本不是后台的锅。
怎么办？静态资源部署到云端，后台也上云了，我本地运行没办法连后台（原因不想说），居然就在控制台又美化压缩后的js，找个有拦截到请求随意地点，跳到请求处理相关的地方。从结果上来看，从http请求创建，到透过拦截器发出，看起来都是正常的，但一些更多的事件回调之类的地方就看不到了。
一度有点兴奋。
愚蠢的细节错误
那么问题出在了哪里呢？
再看看这片段几个人看了无数次的地方，就类似：
问题的所在.png
虽然单独截图出来了，还有放大，可以一眼就看到了。但是编辑器小小又多的内容，几个人看了好多次，都没曾想到会是这里的问题。
http请求后面的左斜线少了一个。
就是这么一个小小的问题。这是我才想起来，上云前有改动的唯一地方，就是修改了IP地址，可能就是那个时候ctrl c ctrl v的时候，不小心多划了一个。
可笑是可笑，问题是解决了，但是为什么呢？常识性分析就是因为只有一个/，angular应用就把这个/IP当成了一个普通path，解析url发现有协议，有端口，有路径，但是没有host，就自动补入了应用所在的host。
实际测试也是这个效果
这个省略冒号两个斜杠：
省略冒号两个斜杠.png
请求是这样：
效果
都不知道是个什么东西。
省略一个斜杠或者两个斜杠：
省略一个斜杠或者两个斜杠.png
效果
当然，正常写法，正常结果
正常写法
(千万不要问我80端口怎么没显示……)
正常
这就是angular的“周全”之处，它可能认为你是故意这样写的，就会按照一定的规则，帮你重塑正是的请求。看起来它把输入的url字符串按照一定规则进行截取，第一个冒号前的，算是协议，有/分割的当成了path路径，处理完之后没有找到ip，就抓取当前应用所在的网域当成请求IP。
那么正常的，就是// 之后的就是IP了。事实上，url中，“http://”这整个部分，才是protocol，而不仅仅只是“http”几个字符就是协议了。
但是，有些时候，url字符串写错了，是能够直接报错的，例如这样的：
可查出的url错误
这个console.log(err)就如下：
err
到这里就不多说了，现在开发，随着IDE、框架之类的原来越成熟，可能在最开始的“ture”错误，才是最让人难以发现的错误，其实问题虽然解决了，虽然所有人都看过那份代码，都没看到少些了一个/，但是一想到这个，还是觉得十分羞愧。
以下不要看，纯浪费时间，只是留个新手印记
大概是讲想看看angular源码HttpClient是怎么处理这个url字串的，但是找半天都没有定位到真实的源代码位置，就又开始印象流瞎扯。）**
为什么会额外多加一个IP地址呢？
由于发生的是这样一个新手问题，我不清楚该怎么去查看资料，就只能笨笨地去看看angular相关HttpClient相关的源代码，企图想了解一下，这个请求在发起到发出之间做了什么事情。但是能力有限，我也不知道看得对不对，所以只能大概说说，我没说过一定是对的。
HttpClient本来也就是angular提供的简化版http客户端api，所以还是要看到HttpRequest类里面去了。
正如起注释中说：
image.png
这也是写HttpInterceptor会用到clone方法。
其实主要看到还是把请求里面的东西url、请求方法等都单一处理了。主要就看url部分。
image.png
看到處理這個url部分，还是以传入的url操作的，那么这个url到底是什么样子呢？
大概是在$locationShim这个类里面，有个getServerBase的方法
image.png
也是在这文件里面从
开始，就有说从URL中获取protocol、host、port、path等操作，注释中有示例。
其中关于path是有说：
image.png
从这一系列看起来，然后在多翻了几层之后，大概就是想的那样，把输入的url字符串按照一定规则进行截取，第一个冒号前的，算是协议，有/分割的当成了path路径，处理完之后没有找到ip，就抓取当前应用所在的网域当成请求IP。
我还是不清楚为什么不直接报错呢？更重要的是，要学好基本功，不然像我这样，连个源码都看得浅尝辄止乱七八糟，是真的丢人。
