【无标题】

1、问题描述
在一个工作项目中（Vue单页面应用），使用到两个第三方服务：

1）使用接口 https://whois.pconline.com.cn/ipJson.jsp?callback=IPCallBack&ip= 获取IP位置

2）使用微信H5支付接口实现支付流程

    这两个服务在document.referrer上存在一个冲突：

    1）IP定位接口貌似不允许外部网站调用，它会检查referrer，若是外部网站，则会报403错误。

403
为了解决这个问题，需要在页面head中添加如下两个meta标签

2）微信H5支付接口在使用时，也会检查referrer，若该信息为空，则会报错“商家参数格式有误，请联系商家解决”，无法进入支付流程。

    为了解决这个问题，就需要页面head中不能有content="no-referrer"和content="never"的meta标签

商家参数格式有误，请联系商家解决
2、解决方案
1）当网站初始化时获取IP位置，获取完成后移除这两个meta标签(×)

let meta_1 = document.querySelector(‘#meta_1’)
let meta_2 = document.querySelector(‘#meta_2’)
meta_1.remove()
meta_2.remove()
但是这样操作以后并没有达到预期的效果。

    2）当网站初始化时获取IP位置，获取完成后修改这两个meta标签的属性值(√)

let meta_1 = document.querySelector(‘#meta_1’)
let meta_2 = document.querySelector(‘#meta_2’)
meta_1.setAttribute(‘content’, ‘unsafe-URL’)
meta_2.setAttribute(‘content’, ‘unsafe-URL’)
如此修改后，问题解决