XMLHttpRequest cannot load. Request header field password is not allowed by Access

XMLHttpRequest cannot load. Request header field password is not allowed by Access

1. 问题

如题：XMLHttpRequest cannot load. Request header field password is not allowed by Access-Control-Allow-Headers in preflight response

在请求的时候，触发options预检请求报错。

2. 解决方案

Access-Control-Request-Headers ：*
改为
Access-Control-Request-Headers ：Content-Type

通配符是2016年提出的， 低版本的浏览器不一定支持通配符。
chrome最低需要63版本。

3. 排查步骤

1. 一般在跨域的时候发生此类问题。
2. 跨域时，在请求头不符合三种条件（略）时，会触发options请求。
3. 而options请求，有一个特殊的请求头， Access-Control-Request-Headers ，如果存在这个请求头，则响应头Access-Control-Allow-Headers必须存在。
4. 根据报错信息，明显是响应头对应的值不符合要求。请求头的值是Content-type，而查看相应头是通配符。 使用抓包工具替换成Content-type后请求成功。
5. 查资料发现通配符在16年提出，低版本浏览器不支持。查MDN发现chrome最低是63版本，而自己是60版本。
6. 升级浏览器版本后，解决此问题。

4. 涉及知识点

1. 跨域三要素
2. 触发options的三要素
3. options参数设置
4. 浏览器对某些参数值的支持程度（可去MDN查看）

总结

chrome的日志还是很不错的，根据日志，一步一步排查原因，总能找到的。
另外在排查过程中使用抓包（我使用fiddler工具）替换，可以快速定位和解决问题。