vue项目使用自定义域名开启本地服务(ip地址和域名映射)

news2024/11/25 8:15:11

前言

有的时候,我们直接用script请求需要在同一个顶级(一级)域名下才可以拿到数据。
本地服务在开启时一般都是localhost,或者带ip。如果想要自定义域名访问本地服务,需要做以下配置。
在这里插入图片描述

ip地址和域名映射

在域名请求时会先访问电脑的hosts文件,所以我们先将自己的自定义域名和本地ip地址关联起来。

host文件修改

地址:C:\Windows\System32\drivers\etc

假如自定义域名是 zsk.haha.com ,加下面图中一条添加到hosts文件中,保存,关闭。

在这里插入图片描述

127.0.0.1 zskhaha.com

项目本地服务配置

修改好hosts文件后,还要修改项目的本地服务才可以正常访问。
以vite为例:
很简单,只需改变host属性即可,将vite.config.ts下的server对象的host属性修改为 自定义域名(zsk.haha.com)即可

在这里插入图片描述
然后 npm run dev 启动就成功了。
在这里插入图片描述

结语

如果 npm run dev启动后报奇怪的错误,例如:
在这里插入图片描述

  1. hosts文件域名映射ip地址 错了
  2. 项目的host 属性 域名写错了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/718847.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

六轴机械臂搬运仿真(机器人工具箱)

1、建立机械臂模型 工作台、货物 clear close all clc L(1)Link(d, 0.33, a,0 , alpha, pi/2,offset,pi); L(2)Link(d, 0, a, 0.26, alpha,0,offset,pi/2); L(3)Link(d, 0, a, 0.02, alpha,pi/2,offset,0); L(4)Link(d, -0.29, a, 0, alpha,pi/2,offset,0); L(5)Link(d, 0, a,…

问诊住院医疗业务数仓建模实操案例

一、数仓建模实超案例 (一)前言 医疗业务系统比较复杂,有HIS:医院信息管理系统( Hospital Information System)、CIS:临床信息系统(Clinical Information System)、LIS&…

临床数据 1. 临床基因突变数据如何发高分?

桓峰基因公众号的粉丝中医学类科研偏多,因此对于临床数据的分析需求还是很多的,因此我们再次推出临床数据相关的一些文献以及对应的分析方法,那么临床数据大概哪几类呢? 临床信息 患者的个人信息包括性别、年龄、家族遗传史、吸烟…

微众区块链开源分布式数据协作管理解决方案,建数据要素高效流通桥梁

数据要素已成为数字经济时代最核心的生产要素,为助力全行业伙伴提升区块链数据协作管理效率、保障数据要素高效有序流通,微众区块链在多年技术研究和应用实践的基础上,积极分析总结行业需求,研发了分布式数据协作管理解决方案DDCM…

css文字图标(阿里图标)使用及引入方式

首先打开 iconfont图标 网页 选择素材库中的单色图标库 选择自己需要用的图标 这里简绍四种类型的引入方式,其中是网页上的三种引入方式: 1. Unicode 使用方式 复制代码 引入样式 (这里是线上引入 通过网址引入的) 引入样式注意路径完整性 标签中间放入…

如何在Forlinx OK3588-C EVK上安装OpenCV?

OpenCV(开源计算机视觉库)是一个开源计算机视觉和机器学习软件库。 OpenCV 广泛应用于计算机视觉、机器人、智能交通、医学成像、安全等领域。 Forlinx RK3588 EVK 是一款高性能嵌入式计算机,结合 OpenCV,可进行高效的图像和视频处…

七牛云面试复盘-实习后端Java开发 一面复盘 【已通过】

💪💪💪欢迎订阅本专栏,持续更新,本专栏内容为我参加的各个公司面试的复盘专栏。将完整记录面试细节问题。 七牛云面试 实习后端Java开发 一面 [视频面试] 首先自我介绍 我是XXX,来自XXX,XXXX。 面试官提问: 1.先问几个基础题,循序渐进的来哈,谈谈Java⾃动装箱…

IM6ull LCD 驱动

一 LCD 简介 LCD(Liquid Crystal Display),液晶显示器。LCD的构造是在两片平行的玻璃基板中放置液晶盒,下基板玻璃上设置TFT(薄膜晶体管),上基板玻璃上设置彩色滤光片,通过TFT上的…

IDEA 集成 GIT

文章目录 16.IDEA中使用GIT-基本操作-add与commit 掌握目标内容 17.IDEA中使用GIT-基本操作-差异化比较目标内容 18.IDEA中使用GIT-基本操作-版本回退及撤消目标内容 19.IDEA中使用GIT-远程仓库-创建与关联远程仓库学习目标: 20.GitLab使用介绍_项目、用户和组介绍(…

Spark环境搭建与使用

第4关:使用Maven对Java独立应用程序进行编译打包 目录 第4关:使用Maven对Java独立应用程序进行编译打包 任务描述 相关知识 Maven安装 编程要求 任务描述 本关任务:编写一个简单的应用程序simpleApp2(实现spark自带文件REA…

Git使用入门

文章目录 简介安装linux离线安装windows安装 用户配置简单使用设置用户名提交至暂存区提交delete变更git add . 与 git add * 向远程库pushpush -f 分支建空白分支分支合并分支冲突 从远程库pull当远程库版本跟本地仓库不一致直接pull尚未pull 暂存区文件移除gitignoregitignor…

DuDuTalk:人工智能时代,AI技术如何赋能销售?

在数字化时代,人工智能(AI)正悄然改变着我们的生活和工作方式。销售领域作为商业运营的核心,自然也不能幸免于AI技术的影响。通过应用人工智能,销售团队能够在客户关系管理、销售预测、个性化营销等方面获得巨大的优势…

保姆级AT32F437 配置RT-Thread 以太网(UDP/TCP Server)

好记性不如烂笔头,既然不够聪明,就乖乖的做笔记,温故而知新。 本文档用于本人对知识点的梳理和记录。 一、前言 ENV版本:v1.3.5 rt-thread版本:V5 开发板:雅特力AT32F437 AT-START-F437 二、ENV配置 E…

回顾 | Let's Learn .NET - Web 开发实战

点击蓝字 关注我们 编辑:Alan Wang 排版:Rani Sun Lets Learn .NET 系列 “Lets Learn .NET” 是面向全球的 .NET 初学者学习系列,旨在通过不同语言,帮助不同地区的开发者掌握最新的 .NET 开发知识与技能。 “Lets Learn .NET”系…

【云原生架构模式】库(Library ) vs 服务(Service ) vs Sidecar(边车)

所有软件应用程序都由可重用的元素组成。这些可重用元素的目标和功能从基础设施级别到安全级别到业务能力各不相同。本文的目的是比较用于构建和部署这些可重用元素的不同方法。 1. 库 这是重用代码的最广泛使用的方法。可重用代码作为库开发和发布。在这种方法中,客…

web前端开发工程师工作的岗位职责(合集)

web前端开发工程师工作的岗位职责1 职责: 1、根据设计图进行前端页面开发并设计编写业务交互脚本 2、优化前端页面,保证良好的用户体验以及不同浏览器的兼容性 3、web前沿技术研究和新技术调研,将主流的特效应用到业务场景中 4、配合后台…

政府关注 | 国家人社部报道盖雅工场以云服务助力劳动者灵活就业

党的二十大报告提出,「加强灵活就业和新就业形态劳动者权益保障」,为促进新就业形态规范健康发展指明了方向。近年来,随着数字经济快速发展,依托互联网平台的新就业形态脱颖而出,成为吸纳就业、提高劳动参与率、增加劳…

FFmpeg从入门到入魔(2):保存流到本地MP4

1 . FFmpeg裁剪移植 之前我们简单地讲解了下如何在Linux系统中编译FFmpeg,但是编译出来的so体积太大,而且得到的多个so不便于使用。本节在此基础上,将详细讲解在编译FFmpeg时如何对相关模块作裁剪以精简so的体积,并且编译只生成一…

【Flutter 组件】005-基础组件:单选、开关和复选框

【Flutter 组件】005-基础组件:单选、开关和复选框 文章目录 【Flutter 组件】005-基础组件:单选、开关和复选框一、概述二、基本使用1、开关代码示例运行结果 2、复选框代码示例运行结果 3、多个选项单选代码示例运行结果 4、多个选项多选代码示例运行结…

一次源码编译安装PostgreSql失败

需要perl;之前博文已提到;之前有一种编程语言叫perl,此perl应该不是那个;可到其官网下载,Perl Download - www.perl.org 安装时添加到环境变量; 可能是一个东西;有编程语言和工具;大…