编译后通过配置文件改变api域名

原创 于 2021-12-14 11:06:59 发布 · 1.5k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前端 #node.js #http

本文介绍了如何在静态文件夹创建host.js配置文件，通过window.host对象设定网站地址，并在index.html中引入并使用这个配置来动态设置APIHost。重点讲解了如何在组件中利用window.host.host变量进行单设备在线时长的计算。

1）static文件夹下新建配置文件host.js
在这里插入图片描述

window.host = {
  "host": "https://www.jyzngc.cn"
}

2）index.html下引入js文件
在这里插入图片描述
3）组件引用该host

apiHost: window.host.host + ':8086', //（单设备在线时长）
网站改版/更换域名全步骤—不依赖主机解决301重定向
程序萌部落
02-24 6404
更换域名在建站初期是经常发生的事情，无非就是DNS修改下解析，替换下内部代码，但对于运营过一段时间的、搜索引擎收录良好的“成熟”站点来说，修改域名，对网站流量和引擎收录简直就是灭顶之灾。正值最近本站刚更换了域名，就此来记录下作为一个网站，更换域名所需要考虑和修改的内容。 更换DNS绑定域名 这一步不再赘述，无非就是解绑旧域名，换绑新域名。 301重定向（重要！） 此步骤是重中之重！对搜索引擎来说，有专门的网站改版提交入口，目的是主动通知搜索引擎你的原站链接变更，从而加快新域名链接的收录，但完成网站改版的
vue项目打包后生成一个配置文件可以修改打包后的服务器api地址
qq_42240091的博客
07-18 5746
vue项目打包后生成一个配置文件可以修改打包后的服务器api地址 问题描述：vue项目打包上线之后，如果要改服务器api地址，只能在源码更改然后重新打包发布，为了解决这个问题，我们可以在static增加一个config.json文件，然后打包的时候它不会被打包，从而在里面修改服务器地址，这样就不用在源码更改。 我觉得这是最简单的办法，不用修改build里面webpack.prod.conf配置文件...
vue 打包之后生成一个配置文件修改接口域名
LonewoIf的博客
01-19 3636
第一步：安装 generate-asset-webpack-plugin 插件： npm install --save-dev generate-asset-webpack-plugin 第二步：配置 webpack.prod.conf.js 文件： // 让打包的时候输出可配置的文件 let GenerateAssetPlugin = require('generate-asset-webp...
php源代码修改域名,php正则如何实现替换域名
weixin_29310631的博客
03-13 452
php正则实现替换域名的方法：首先获取网站的url；然后使用正则表达式“preg_match($reg, $url,$res);”提取域名；最后通过“preg_replace”方法更换新的域名即可。推荐：《PHP视频教程》正则提取的url中的域名以及替换域名的方法 preg_match()和preg_replace()...
设置小程序request合法域名_微信小程序切图给api接口设置统一域名
weixin_39551611的博客
11-23 272
微信小程序切图给api接口设置统一域名的意义重大，因为小程序api一般在同一个域名下，为了灵活和后期修改域名方便，是非常有必要把域名主体单独封装成一个变量去使用的，这里首先想到的就是app.js下的globalData。在根目录的app.js添加代码如下：globalData: { userInfo: null, baseUrl: 'https://xz.qietu.vip/' }然后在页面中的j...
Web前端开发、前后端分离开发模式、多环境接口(API)域名配置与解决方案
沐枫
11-30 9855
强烈推荐！​ 该方案是完全由自己定义，不通过.env配置文件来进行配置，且适用于所有环境。首先，如果前端项目 和 后端项目都是同一个域名，那就再好不过了，直接用 "/" (当前域名)来代替所有环境的API域名。其次，如果前端项目 和 后端项目不是同一个域名，并且每套(开发、测试、生产)环境的前后端域名都不一样时，以下方案就大有派场啦！简讲，就是自己定义一个用于全局公共的env.config.js文件，在需要的页面中引入加载进去就OK了！
为VUE项目提供部署后仍可修改的配置文件
左直拳的马桶_日用桶
10-09 3156
将配置文件放在public/下（如果是vue2.，放在/static/下）* 前后端分离，前端代码码也像后端一样编译、发布，再也不是以前那种完完全全的静态文件了。这就为代码复用，模块式开发带来了便利，不过有一些问题。比如配置文件，发布时也会被编译、打包，部署之后就再也找不到，更别说修改了。只能在打包前设置好，这样就失去了配置的意义。 那应该如何提供配置文件，使得前端在部署后，仍然可以手动修改呢？ 以vue3.*为例。很简单的，在public/下提供一个config.js，然后在public/index.ht
基于Java_17和GraalVM本地镜像编译的轻量化动态域名解析自动更新工具_支持IPv4和IPv6双栈环境_通过配置文件自定义DNS服务商API接口_实现网络IP变化时自动同步.zip
最新发布
09-15
配置文件在该工具中扮演着至关重要的角色，通过配置文件，用户可以自定义DNS服务商API接口的细节，以适应不同的网络服务商和特定的业务需求。用户不再受限于单一服务商的固定配置，可以根据自身实际情况，灵活选择...
webpack + vue 打包生成公共配置文件（域名） 方便动态修改，不用重复打包
ShIcily的博客
05-17 2245
需求： 原来的项目中域名是打包到项目里面的，打包后不能动态配置，只能通过不同的指令打包来切换域名，每天都在测试域名和正式域名来回摩擦，后台大佬说你们可以生成一个配置文件这样就不用频繁打包了直接修改配置文件就好. 方法一： vue中有一个存放外部资源的文件夹static，它里面的文件是不会被打包编译的，所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js文件的方式引入，然后就可以全局使用。 此方法亲测有效！！！！ 1、在...
webpack 打包vue项目后生成一个可修改接口地址的配置文件。
热门推荐
qq_41409679的博客
12-12 1万+
当我们做完vue项目打包、转测试、部署后，却遇到修改接口地址，或修改域名。但是在npm run build 之后所生成的 dist 文件也是写死的了。我们就需要回来重新修改，重新打包。 no no no 一想都觉得麻烦哎。 所以最好解决方案就是有个 config 文件方便我们管理这些。 解决方法：（共有2个方法） 1、借助插件  generate-asset-webpack-plugin 。...
magic-api：magic-api是一个接口快速开发框架，通过Web页编写脚本以及配置，自动映射为HTTP接口，无需定义控制器，服务，Dao，Mapper，XML，VO等Java对象
01-30
magic-api是一个基于Java的接口快速开发框架，编写接口将通过magic-api提供的UI界面完成，自动映射为HTTP接口，无需定义Controller，Service，Dao，Mapper，XML，VO等Java对象即可完成常见的HTTP API接口开发 ...
修改本地项目的访问域名 替换localhost为xxx
a_靖的博客
10-14 1万+
需求： VUE的项目本来是http://localhost:8080才能访问的，现在想改成http://jay.com:8080就能访问。 操作步骤 打开如下图的目录： 按照这个路径找到hosts文件，右键打开方式使用记事本打开，在localhost下面加上想要的任意域名。 因为不能直接保存，所以需要全选复制hosts文件的内容，新建一个txt文件，粘贴到里面，然后强制删除...
22-CMS前端页面查询开发-Api调用-跨域解决
minihuabei的博客
01-21 414
跨域问题解决 测试 上边的代理 ，结果 报错如下 ： No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:11000’ is therefore not allowed access. 原因：浏览器的同源策略不允许跨域访问，所谓同源策略是指协议、域名、端口相同。 解决：采用proxyTable解决。 proxyTable是什么？ vue-cli提供的解决v
vue获取div高度
yuyu_2019的博客
01-22 7883
<div class="top" ref="top"> mounted () { let topHeight = this.$refs.top.offsetHeight // 头部高度 console.log(topHeight) }
axios给.then传参
yuyu_2019的博客
03-16 2565
问题：想把mac那个参数，传到.then回调的方法里 解决 .then(res => { this.getAlarmDataSucc(res, mac) }) getAlarmDataSucc (res, mac) {
VUE监听resize
yuyu_2019的博客
12-22 2083
data () { return { windowHeight: window.innerHeight } } mounted () { window.onresize = () => { this.windowHeight = window.innerHeight } } watch: { 'windowHeight': function (newVal, oldVal) { //监听屏幕宽度变化 this.windowHe
vue 引入图片在data里使用
yuyu_2019的博客
11-28 1205
<script> import imgMobIconGray from '@/assets/images/SafetyWarningLinkagePlatform/shexiangtou-gray-icon-24.png' export default { name: 'Test', components: { }, data () { return { mobMarkers: [ { id: '01',
vue路由守卫——改页面title
yuyu_2019的博客
11-25 1046
index.vue <button @click="goLogin">跳登录页</button> goLogin: function () { this.$router.push('/Login') // 路由跳转 } login.vue <button @click="goHome">跳首页</button> goHome: functio...
Vue项目阿里云部署指南：从编译到域名配置
- 在admin项目中创建`vue.config.js`，设置`outputDir`为`../server/admin/`，确保构建后的文件输出到server目录下的admin文件夹。同时，根据环境变量`NODE_ENV`设置`publicPath`，在生产环境中为`/admin/`。 3. *...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值