html如何访问外部网站,利用Github部署外部可访问的H5网站(无需服务器)

news/2024/5/17 11:28:22/文章来源:https://blog.csdn.net/weixin_31240135/article/details/118262322

没有服务器如何外部访问你的HTML 本文是借助GitHub 实现 一半测试或者做个小的静态页面还是可以的。 下文是转载(像素级复制)亲测有效,找了几篇博客下文算是比较全的。

Step1 :登录到自己的Github,查看代码仓库

点击“Repositories”进入自己的代码仓库页面,点击“New”,新建一个代码仓库,用来存放将要上传的网页文件。

图1 查看代码仓库

4c3c87e5db7c8bd73b941f4c97b9e7cb.png

Step2 :新建代码仓库

进入新建代码仓库页面,填写“Repository name”,这是新建的代码仓库的名字,点击“legendary-carnival”可以查看命名规则;填写“Description”,可以是代码仓库的中文描述,出现在readme文;选择“Public”,私有的需要付费;填写完毕后,检查一下,点击“Create repository”,确认新建代码仓库。

图2 新建代码仓库

31ec1b27b1c965edb9e67c8ebb3e3626.png

Step3 :设置Github Pages

新建完毕代码仓库后,进入该代码仓库页,点击“Settings”,进入设置页da50d3798fbbee03955521457ddefed1.png

图3 点击点击“Settings”

一直想下拉,找到Github Pages,点击“Change theme”,进入主题设置页(没设置之前是没有Your site的)

0922aef02fed8daa8f492ef2e90428ff.png

图4 点击“Change theme”

选择“Cayman”主题,点击“Select theme”

a8d13ddc2580e99ddd87e79a2ba316fa.png

图5 点击“Select theme”

由于设置了主题,所以要提交变化,点击“Commit changes”来提交变化

577c68dffca683dcf9d0463d7217de64.png

图6 点击“Commit changes”来提交变化

db1250aa5f8a27439b73fe8c12cc827c.png

此时在"Settings"中的“GitHub Pages”中出现了“Your site”,点击该网址可以访问你的网站,但是此时你的网站里只有默认内容,所以下一步是要上传你的内容到该代码仓库

892d1a9c77bae3c06c143eba24be78ae.png

图7 在"Settings"中的“GitHub Pages”中出现了“Your site”

Step4 :上传本地代码到github

点击“Clone or download”点击复制代码仓库的链接,或者在浏览器顶部复制链接

f74a0394568708c141cf825d5aec6ae1.png

图8 复制代码仓库的链接

在终端写“git clone "刚刚复制的链接"”,之后自动下载该代码仓库的文件到本地,显示100%表示下载完成。

360324b0987d66b271ca5b3d1e903489.png

图9 下载该代码仓库的文件到本地

找到下载的文件夹,将你的网站文件复制到该文件夹

写“cd "下载的文件夹"”,进入该文件夹

写“git add .”提交该文件夹到缓存区,注意add后面有空格

写“git commit -m "该次提交的描述"”,为该次添加描述

05c0ad20b3612c7f9ff2761073b65753.png

图10 准备提交本地代码到github

此时提示你还没有登录,按照提示代码,填写邮箱和用户名,并在此提交,具体输入如下划线所示

a9a721781f62918cb4e9e27fc8d180b3.png

图11 设置邮箱和用户名后提交

写“git push origin master”将缓存区的代码提交到github的“master”分支

890f67d3ad94eaac3338f00460f94527.png

图12 代码提交到github的“master”分支

显示如图13表示代码上传完成,此时可以点击如图7所示的链接来访问自己的网站了。

df0c787dd7fe87f10cc34e2bc4c34597.png

Step5 :更新代码并上传到github

图13 上传代码完成

270ff5180bbd54ee3b828c97a2c90f5d.png

//  测试demo   https://github.com/YST521/HTMLTest.git

//外部访问网址是: 图七那个  Your site 后面的那个链接:不过需要拼接文件名称

例如: https://yst521.github.io/HTMLTest/rainTest.html

https://yst521.github.io/HTMLTest/rainTest1.html

//有文件夹 则需要加上文件夹路径 例子:

html5学习笔记:  https://yst521.github.io/HTMLTest/HTML/index.html

每次git更新代码时 建议先创建一个分支 提交新分支 然后删除分支 合并分支 推到远程主分支。这样避免出错 可以参考这篇博文: https://www.cnblogs.com/horanly/p/6265182.html

链接:https://www.jianshu.com/p/da9a6af86e74

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

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

holdpwd php,PHPMyWind后台管理界面的SQL注入漏洞 - 网站安全

后台管理界面因为过滤不严格导致SQL注入漏洞,可以使权限较低的管理员取得较高权限,以及获取并修改超级管理员的用户名密码。存在问题的代码,admin_save.php 59-101行,SQL语句中的$id存在注入else if($action update){//创始人账号…

网站地图在线生成html,如何制作网站地图(sitemap.html和sitemap.xml)?

总所周知,一个网站的网站地图非常重要,也是SEO站内优化的其中一个基本步骤,可总有人跟我咨询,到底如何制作网站地图,其实很简单,网站地图分为:sitemap.html(百度搜索引擎)和sitemap.xml(谷歌搜索…

网站服务器接入地在哪里查,接入服务器的地址在哪查

接入服务器的地址在哪查 内容精选换一换使用Touch对终端进行配置前需要先将Touch接入终端,接入方式包括TOUCH口连接、交换机网口连接和Wi-Fi连接。TOUCH口连接将Touch接入终端的TOUCH口,如图1所示。TOUCH口连接TOUCH口具有供电功能,使用TOUCH…

jsp+ssm体育新闻资讯网站springboot

体育资讯网站的设计与实现的需求和管理上的不断提升,体育资讯网站的设计与实现的潜力将无限扩大,体育资讯网站的设计与实现在业界被广泛关注,本网站及对此进行总体分析,将体育资讯网站的发展提供参考。体育资讯网站的设计与实现对…

域名被墙检测网站_网站备案前一定要检查这些域名隐患!

网站备案是域名主机的一体化过程,而域名是网站备案的载体。一般网站备案的展现形式是在域名上的。所以域名对网站备案是很重要的哦!1、首先,域名后缀的选择。可在工信部备案的域名后缀:.cn/.ren/.wang/.citic/.top/.sohu/.xin/.co…

nodejs+vue菜谱美食食谱网站系统

目 录 摘 要 I 1 绪论 1 1.1研究背景 1 1. 2研究现状 1 1. 3研究内容 2 2 系统关键技术 3 前端技术:nodejsvueelementui 前端:HTML5,CSS3、JavaScript、VUE 下面我们讲解 1、 node_modules文件夹(有npn install产生) 这文件夹…

nodejs+vue+elementui数字化家谱网站管理系统express

目 录 第一章 绪 论 1 1.1背景及意义 1 1.2国内外研究概况 2 1.3 研究的内容 2 第二章 关键技术的研究 3 前端技术:nodejsvueelementui 前端:HTML5,CSS3、JavaScript、VUE 下面我们讲解 1、 node_modules文件夹(有npn install产生) …

nodejs+vue+elementui服装销售-汉服文化宣传网站mysql

前端技术:nodejsvueelementui 前端:HTML5,CSS3、JavaScript、VUE 用户的主要功能有: 1.用户注册和登陆系统 2.查看汉服知识信息 3.用户查看服装展示信息 4.用户可以在线购买汉服,把商品加入购物车 4.用户提交购物车,生…

python+django家政服务中介网站系统

通常 一个Django model 对应一张数据表,model是以类的形式表现的 实现了ORM 对象与数据库映射 隐藏了数据访问细节 不需要写sql语句 admin是Django自带的 自动化数据管理界面 前端技术:nodejsvueelementui 我们最初的项目结构由五个文件组成&#xf…

springboot+vue网上零食购物商城网站java

零食商店管理系统是基于java编程语言,mysql数据库,springboot框架和idea开发工具开发,本系统主要分为用户和管理员两个角色,用户可以注册登陆查看零食资讯,零食分类,零食详情,收藏零食&#xff…

Springboot网络图片相册照片分享网站vue

图片分享网站主要是为了提高工作人员的工作效率和更方便快捷的满足用户,更好存储所有数据信息及快速方便的检索功能,对系统的各个模块是通过许多今天的发达系统做出合理的分析来确定考虑用户的可操作性,遵循开发的系统优化的原则,…

java基于ssm的旅游景点酒店预订网站

在经济快速发展的带动下,旅游业的发展也是越来越快速。人们对旅游信息的获取需求很大。在互联网飞速发展的今天,制作一个旅游网站是非常必要的。本网站是借鉴其他人的开发基础上,用MySQL数据库和JSP定制了武夷山旅游网站。系统前台实现了用户…

Springboot+ssm宠物美容网站idea maven

开发一个宠物美容服务网站,该网站能为用户提供一下便捷服务。 预期成果: (1) 用户可以在本系统,根据自己情况预约宠物活动信息。 (2) 用户可以预约宠物洗澡,宠物剪发等。 &…

php mysql校园网的大学生社交网站

目 录 第1章 绪论 1 1.1开发背景 1 1.2开发现状 1 1.3论文结构 1 1.4本章小结 1 第2章 系统开发技术的介绍 3 2.1 Adobe Dreamweaver简介 3 2.2 HTML/CSS简介 3 2.3 PHP(Hypertext Preprocessor)简介 3 2.4 MySQL数据库概念和特点 4 2.5本章小结…

php mysql c语言教学网站

目 录 1 绪论 1 1.1 课题背景 1 1.2 课题研究的目的和意义 1 1.3 课题的可行性研究 2 1.3.1 技术可行性 2 1.3.2 经济可行性 2 1.3.3 操作可行性 2 1.3.4 法律可行性 2 2 开发技术介绍 3 2.1 B/S体系结构 3 2.2 PHP技术 4 2.3 MYSQL数据库 …

python django旅游网站设计与实现sq91sd-pycharm毕业设计项目源码

目 录 1 绪论 1 1.1 系统简介 2 1.2 研发背景和意义 3 1.3项目研究的目的和方法 4 1.3.1项目的研究目的 5 1.3.2开发方法及步骤 6 1.4 本章小结 7 2. 开发平台介绍 8 2.1 系统平台环境 9 2.1.1 硬件平台 10 2.1.2 软件平台 1…

python+django图书交易捐赠 借阅 租借网站pycharm毕业设计项目

目 录 1 绪 论 1 1.1 课题背景 2 1.2 课题研究的意义 3 1.3 系统实现的功能 4 1.4 课题研究现状 5 2系统相关技术 7 2.2 mysql数据库介绍 7 2.3 MySQL环境配置 7 2.4 B/S架构 7 3系统需求分析 9 3.1系统功能 9 3.2可行性研究 10 3.2.1…

ajax 回调数据 刷新table_【实战演练】Python+Django网站开发系列12-前后端数据交互总结...

#本文欢迎转载&#xff0c;转载请注明出处和作者。经过前面11篇&#xff0c;我们把功能简单版的学生选课系统开发完成了。关于前端往后端提交数据&#xff0c;以及后端如何往前端返回数据进行一下总结。1、前端往后端提交数据1.1 HTML原生<form>表单html原生就带表单<…

学计算机大学累不累_大学计算机专业新生,零基础学编程?这几个网站让你快速上手...

作为一名身处十八线&#xff0c;自学成才的攻城狮&#xff0c;经常有朋友问我&#xff1a;“怎么学编程&#xff1f;为什么我看了两周的视频还是啥也做不成呀&#xff1f;”呵呵&#xff0c;我就想反问一句&#xff1a;“你看2个月游泳视频能学会游泳吗&#xff1f;”只有亲身实…

服务器不稳定会出现情况,服务器的不稳定对网站有哪些影响?

相信大家都会遇到一种情况就是服务器不稳定&#xff0c;让人很是着急&#xff0c;用户想看你的网站但是因为服务器不稳定导致网站打不开&#xff0c;你认为用户会一直等着你的网站恢复吗?服务器的安稳对网站的持续性开展至关重要&#xff0c;服务器的安稳性不只会影响网站的运…