前言

针对在本地访问文件或资源出现的跨域问题,可以通过搭建本地服务器来解决,本篇随笔主要介绍通过搭建Apache Tomcat服务器来解决跨域。包括Apache Tomcat的下载、安装、环境变量的配置以及项目部署等。

具体内容

一、Apache Tomcat的下载

Apache Tomcat下载网址:https://tomcat.apache.org/

选择下载版本,现在最新的版本是Tomcat 9.0.27。这里下载最新版本,单击"Download",进入到下载页面,如下图所示:

选择"zip(pgp, sha512)"进行下载,下载zip版本的好处是不用安装,下载完成直接解压就可以使用了。下载完成后,如下图所示:

二、Apache Tomcat的安装及环境变量的配置

由于下载的是zip版本的,故不需要再单独安装,直接对压缩包进行解压,并进行环境变量的配置。

(1)解压完成之后,如下图所示:

(2)进入"高级系统设置"窗口,配置环境变量

使用"Win + X",点击"系统",如下图所示:

点击"系统信息",如下图所示:

点击"高级系统设置",如下图所示:

打开"高级系统设置"之后,如下图所示:

单击"环境变量",进入如下图所示:

单击"新建",新建2个系统变量"CATALINA_BASECATALINA_HOME",以及配置Path.

•新建CATALINA_BASE变量,如下图所示:

•新建CATALINA_HOME变量,如下图所示:

PS1:不太了解的读者可能会对Tomcat安装目录的环境变量的名字(如CATALINA_HOME)而感到疑惑,按照其他环境变量的设置来看,JAVA_HOME表示JDK的安装目录,同理,应该使用TOMCAT_HOME来表示Tomcat的安装目录,为何要使用CATALINA_HOME呢?事实上,在Tomcat 4以前就是使用TOMCAT_HOME来表示Tomcat的安装目录,在Tomcat 4以后,采用了新的Servlet容器Catalina,所以环境变量的名字也改为了CATALINA_HOME。

PS2:在Windows系统下,环境变量的名字不区分大小写,也就是说CATALINA_HOME与catalina_home是一样的。

PS3:如果要想在任意目录下都能启动Tomcat,就需要设置CATALINA_HOME环境变量,将CATALINA_HOME添加到Windows系统的环境变量中,其值就是Tomcat的安装目录。此处Tomcat的安装目录是D:\Apache tomcat \apache-tomcat-9.0.27。如果不想在系统的环境变量中添加,也可以直接在startup.bat文件头部设置以下这行代码:

SET  CATALINA_HOME= D:\Apache tomcat \apache-tomcat-9.0.27

•配置Path

打开Path,添加变量值,如下图所示:

单击"确定"配置完成之后,检验Tomcat环境变量是否配置成功,是否能成功启动Tomcat服务?

启动Tomcat服务的方法有2种:

方法一:

在终端输入startup命令,然后回车,或者直接在Tomcat目录的bin文件夹下,双击“startup.bat”来启动Tomcat服务,启动成功如下图所示:

PS1:在Tomcat目录下的bin文件件下,直接双击打开"startup.bat"文件会闪退,解决方法如下:

右击startup.bat文件,选择"编辑"打开该文件,在该文件尾部加上"pause"即可,如下图所示:

方法二:将方法一中通过手动启动方式改为自动启动方式

当我打开“计算机管理”->“服务和应用程序”->“服务”下时,没有找到Apache Tomcat服务;于是就在网上找了好多解决方法,找到没有Tomcat服务的原因是:在Tomact的bin目录文件夹下没有“service.bat”和“tomcat9.exe”这两个文件,因为我使用的是Tomcat免安装版,所以为了能得到这两个缺少的文件,去Tomcat官网下载免安装版所对应版本号的EXE安装版,下载完成后,将其中的“service.bat”和“tomcat9.exe”这两个文件复制到bin目录下,然后将“service.bat”鼠标左键点击拖入到dos窗口, 按Enter键打开终端,输入“service.bat install Tomcat”命令安装服务,安装成功后,再按照上述方法打开“服务”,即可看到已存在Apache Tomcat服务,右键点击该服务,选择“属性”,将“启动类型”由“手动”设置为“自动”。如下图所示:

测试Tomcat的方法:打开浏览器,在地址栏输入http://127.0.0.1:8080或者http://localhost:8080,回车,启动成功如下图所示:

以上表示在顺利的情况下,就表示配置完成了,前提是在本机上已安装JAVA JDK。

===============================================================

当然,在验证Tomcat是否配置成功时,出现了一点儿小插曲,在命令行运行startup命令,命令行报错,如下图所示:

分析错误原因是:计算机上未安装JAVA,更没有配置JAVA环境变量,于是就去下载安装了JAVA,并进行JAVA环境变量的配置,最终解决了上述问题。

下面记录安装Java,以及配置环境变量的过程:

安装JAVA,直接去网页上下载,然后安装JDK即可,直接运行JDK.exe的可执行文件,默认安装即可,安装JDK,会默认安装JRE。安装路径最好是不包含中文名。安装完成之后,配置环境变量:

配置JAVA环境变量的步骤和Tomcat相似,需要新建"JAVA_HOME"和"CLASSPATH"变量名,以及配置Path。

•新建JAVA_HOME变量,如下图所示:

•新建CLASSPATH变量,如下图所示:

CLASSPATH变量值:.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar

解释说明:

.表示当前路径,%JAVA_HOME%就是引用前面指定的JAVA_HOME;

JAVA_HOME指明JDK安装路径,此路径下包括lib,bin,jre等文件夹,tomcat,eclipse等的运行都需要依靠此变量。

PATH使得系统可以在任何路径下识别java命令。

CLASSPATH为java加载类(class or lib)路径,只有类在classpath中,java命令才能识别。

•配置Path

打开Path,添加变量值,如下图所示:

单击"确定"配置完成之后,检验JAVA环境变量是否配置成功?

在CMD终端输入"java -version",如下图所示,表示安装成功

三、Apache Tomcat项目部署

部署静态页面或项目,其实有很多种方法,下面介绍3种:

方法一:直接把静态页面复制到Tomcat安装目录的webapps目录中

例如:新建一个practice文件夹,在文件夹里新建一个test.html文件,然后将整个practice文件夹复制到Tomcat安装目录的webapps目录中,启动tomcat后,在浏览器输入ip:port/practice/test.html即可访问了。

方式二:在Tomcat安装目录中有一个conf文件夹,打开此文件夹,其中包含配置文件server.xml,打开配置文件,并在<host>和</host>之间插入如下语句

<Context path="practice" docBase="D:\practice" debug="0" reloadable="true" crossContext="true"/>

其中,path为虚拟路径,docBase为项目的路径,启动tomcat后在浏览器输入ip:port/practice/test.html即可访问了。

方式三:在conf目录中,在Catalina\localhost(此处需要注意目录的大小写)目录下新建一个XML文件,任意命名(例如:hello),只要和当前文件中的文件名不重复即可,代码如下

<Context path="" docBase="D:\ practice " debug="0" reloadable="true" crossContext="true"/>

其中,path属性可以不写,docBase为项目的路径,启动tomcat后在浏览器输入ip:port/hello/test.html即可访问了。

结束语

  不管是项目,还是单个的文件,都可以通过扔到服务器上再去访问,这样就可以解决使用file协议访问文件带来的跨域问题,服务器上的文件一般都是通过http协议来访问文件,则不会存在跨域的问题。

  在搭建Tomcat服务器的整个过程中,遇到了不少问题,自己慢慢查询得以解决,收货颇多。

Apache Tomcat下载、安装、环境变量配置以及项目部署的更多相关文章

  1. Maven下载与环境变量配置

    前言: Maven 是一个基于 Java 的工具,所以要做的第一件事情就是安装 JDK.如果还未安装 JDK,可以参考Win10下JDK下载与环境变量配置. 项目 要求 JDK Maven 3.3+ ...

  2. Python下载、环境变量配置、 模块安装方法

    下载 Windows版官网下载地址:https://www.python.org/downloads/windows/ 类似下图以 installer结尾的文件就是我们需要下载的,位数根据自己的电脑进 ...

  3. Win10下JDK下载与环境变量配置

    一.JDK下载 1.JDK下载地址:https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.ht ...

  4. git的安装-环境变量配置

    windows安装git和环境变量配置 2015.10.12 评论(0) 10,729 点此嗨一下 Git是一款免费.开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目. Git是一个开源 ...

  5. windows系统Android-sdk的下载与环境变量配置

    最近一段时间在做app的开发,作为前端而言,开发app并不像android工程师那样熟悉android开发:无论是使用cordova.js或者react-native开发都需要配置android开发环 ...

  6. java下载和环境变量配置

    初学java,以前没有接触过这方面内容,所以简要记录一下我2个月的学习流程. 首先,我在慕课上学习java的基础,浙江大学翁恺老师的课程. 下载ECLIPSE-java 进入官网:https://ww ...

  7. Java Web框架play framework的下载与环境变量配置

    Web项目的开发有着众多的框架,近期刚刚接触了play. 对于一个Java开发者来说,play是一个不可多得的好框架.以下我简介下怎样下载play .以及play的环境变量配置方法. (1)登录pla ...

  8. maven的下载,环境变量配置,和eclipse配置,和IntelliJIDEA配置

    一.maven简介 Maven是一个项目管理工具,它包含了一个项目对象模型 (Project Object Model),一组标准集合,一个项目生命周期(Project Lifecycle),一个依赖 ...

  9. jdk 安装 环境变量配置

    右键选择 计算机→属性→高级系统设置→高级→环境变量 1.系统变量→新建 变量名:JAVA_HOME 变量值:(变量值填写你的jdk的安装目录,例如本人是 C:\Program Files\Java\ ...

随机推荐

  1. 关于solr的一些知识

    简单了解 怎么理解Solr是个什么东西呢? 引用官网的介绍, Solr is the popular, blazing-fast, open source enterprise search plat ...

  2. zabbix快速安装(Ubuntu18.04, Nginx)

    ubuntu18.04快速安装zabbix4.0 https://blog.csdn.net/qq_33317586/article/details/83867756 需要安装的东西:nginx,ph ...

  3. Opencv 特征提取与检测-Haar特征

    Haar特征介绍(Haar Like Features) 高类间变异性 低类内变异性 局部强度差 不同尺度 计算效率高 这些所谓的特征不就是一堆堆带条纹的矩形么,到底是干什么用的?我这样给出 ...

  4. Codeforces 1155F 状压DP

    题意:给你一张图,问最少保留多少条边,使得这张图是边双联通分量. 思路:如果一个点集中的点已经是边双联通分量,那么从这个点集中的点x出发,经过若干个不是点集中的点,回到点集中的点y(x可能等于y),那 ...

  5. 使用ReadStream方法读取文件事件传递过程

    const fs = require('fs'); let file = fs.createReadStream("filename.js"); file.on("ope ...

  6. vue全家桶(vue2.x+vue-router+axios+webpack)项目搭建

    参考博客文章 博主FungLeo的Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版 注:原博主写的非常详细 本文章为根据原博主教程总结的自己的搭建流程 一.安装n ...

  7. CodeFirst命令

    CodeFirst get-help entityFramework          NuGet命令 Add-Migration                     Adds a new mig ...

  8. 用 CSS 实现酷炫的动画充电效果

    巧用 CSS 实现酷炫的充电动画 循序渐进,看看只使用 CSS ,可以鼓捣出什么样的充电动画效果. 画个电池 当然,电池充电,首先得用 CSS 画一个电池,这个不难,随便整一个: 欧了,勉强就是它了. ...

  9. Vue学习笔记【22】——Vue中的动画(列表的排序过渡)

    <transition-group> 组件还有一个特殊之处.不仅可以进入和离开动画,还可以改变定位.要使用这个新功能只需了解新增的 v-move 特性,它会在元素的改变定位的过程中应用. ...

  10. PHP ftp_pwd() 函数

    定义和用法 ftp_pwd() 函数返回指定 FTP 连接的当前目录名称. 语法 ftp_pwd(ftp_connection) 参数 描述 ftp_connection 必需.规定要使用的 FTP ...