引用js时，进行参数传递

末蓝、 2022-05-26 13:20 187阅读 0赞

场景：

最近在开发过程，因为生产环境和开发环境不同，工程中有调用天地图的服务，有引用相对应的资源文件，在 GeoGlobeJS.min.js 中几个服务地址(矢量底图服务、矢量注记服务、影像底图服务、影像注记服务) ，因为我是在官网上下载的，所以默认地址都是互联网的，而生产环境不一定是在互联网上，需要根据环境，动态的进行服务地址替换，这时就需要将这几个地址做成参数进行动态赋值传递。

通过咨询度娘，参考大佬的文档进行修改，并记录，参考地址：[点击打开][Link 1]

解决方法：

根据大佬的博客，我选择的是第三种方法，通过在<script></script> 标签中添加id和自定义参数，然后在对应的脚本中进行取值使用，下面是具体实现的代码：

互联网服务地址：

var vec_fj_url = "http://service.fjmap.net/vec_fj/wmts";   //矢量底图服务
    var cva_fj_url = "http://service.fjmap.net/cva_fj/wmts";   //矢量注记服务
    var img_fj_url = "http://service.fjmap.net/img_fj/wmts";   //影像底图服务
    var cia_fj_url = "http://service.fjmap.net/cia_fj/wmts";   //影像注记服务

// 1.设置当前 script 标签 id 为：GeoGlobeJS

// 2.在 script 标签中添加自定义的属性并且赋值 cia\_fj\_url 、img\_fj\_url、cva\_fj\_url、vec\_fj\_url

在 GeoGlobeJS.min.js 中进行接收，一下为部分节选代码：

var vec_fj_url, cva_fj_url, img_fj_url, cia_fj_url ;  //定义js中的全局参数
    (function () {
        //接收传递过来的参数
        vec_fj_url = document.getElementById('GeoGlobeJS').getAttribute('vec_fj_url');
        cva_fj_url = document.getElementById('GeoGlobeJS').getAttribute('cva_fj_url');
        img_fj_url = document.getElementById('GeoGlobeJS').getAttribute('img_fj_url');
        cia_fj_url = document.getElementById('GeoGlobeJS').getAttribute('cia_fj_url');

有了上面的方法，根据设想，实现动态替换服务地址，我们只需要在引用资源文件前，用条件判断语句对当前环境的IP进行判断，动态改变 矢量底图服务、矢量注记服务、影像底图服务、影像注记服务 的地址即可。

虽然上面这种方法解决了目前的需求，但总感觉还有些不妥，但暂时又没有找到更好的方法，后续如果有找到，再进行更改

[Link 1]: https://www.cnblogs.com/sking7/archive/2011/11/23/2260572.html