XAMPP的下载安装配置详细教程

news/2024/11/26 11:29:46/

XAMPP的下载安装配置详细教程(含拒绝访问坑)


xampp

话不相瞒,当初为了在XAMPP(Apache+MySQL+PHP+PERL)里面配置phpwind,我在卸载与安装之间来回了不下10次,但是我的phpwind始终还是安装不成功,我可能是招坑体质,真的很无奈。最终,我放弃了phpwind。
废话不说,如大标题所示,直接干了,分分钟的事情。

文章目录

  • 一、下载(三步)

    • 第一步:找对应的操作系统版本
    • 第二步:选一个迭代版本
    • 第三步:找到安装包
  • 二、安装

  • 三、配置(三步)

    • 第一步:配置Apache

      • 第一个文件(httpd.conf),需要修改两个地方。
      • 第二个文件(http-ssl.conf),需修改三个地方。
    • 第二步:配置MySQL

    • 第三步:配置Service和port设置

        • 保存时拒绝访问的小坑
  • 四、测试

    • 测试Apache

    • 测试MySQL

      • 又是一个拒绝访问坑
  • 五、修改MySQL默认密码

  • 六、部署

一、下载(三步)

第一步:找对应的操作系统版本

官方下载地址https://sourceforge.net/projects/xampp/files/
进入后选择自己对应的操作系统下载,如下图。
本文以Windows为例,所以选择第三行的XAMPP Windows其他系统也可作参考。
进去后的页面

第二步:选一个迭代版本

点击进去后会进入到这个软件的版本选择的页面,如下图:
我当时选了7.4.5的版本,是因为看到它后面显示下载量是最高的。
这时候的php是php7了。
版本选择

第三步:找到安装包

如下图,点击箭头指的链接,即可下载。
在这里插入图片描述

二、安装

下载完成后,就轮到安装了。
双击刚刚下载下来的exe程序安装。
打开后如下图,不用改,直接Next。
img
选好自己安装的路径,一般不放C盘(系统盘),我选择的是D盘,然后点Next。
在这里插入图片描述
等待安装完毕后点击完成。

三、配置(三步)

安装完后,不出意外的话,一般都会出现端口冲突,如下图:
在这里插入图片描述
展开后:
在这里插入图片描述
不冲突的话,就直接用吧,直接验证吧,没什么事了。
好了,冲突的小伙伴们,正事来了。

第一步:配置Apache

共需打开两个文件,修改五个地方:

第一个文件(httpd.conf),需要修改两个地方。

点击图中所示打开文件:
在这里插入图片描述
这里需要修改Apache端口号,不修改的话,会与默认80端口产生冲突,导致打开不成功。
两个地方修改后如图中红框内显示:
在这里插入图片描述
在这里插入图片描述

第二个文件(http-ssl.conf),需修改三个地方。

点击下图所示打开文件:
在这里插入图片描述
三个地方修改后如图中红框内显示:
在这里插入图片描述
在这里插入图片描述

第二步:配置MySQL

打开my.ini文件,需修改两个地方,如下图:
在这里插入图片描述
在这里插入图片描述

第三步:配置Service和port设置

这样可以使你点击Admin登进去,不用又在网址栏上输入端口号。
打开步骤如下:
在这里插入图片描述
打开后将端口号对应上我们刚刚修改的端口号
在这里插入图片描述
在这里插入图片描述
最后点击保存就好了。

保存时拒绝访问的小坑

保存的时候有些小伙伴可能会遇到拒绝访问的问题,如下图:
在这里插入图片描述
这里显示的是我们的权限不够。
我们顺着上面图中的路径找到该文件,然后使用管理员的身份去打开(右键→使用管理员身份打开),修改它的权限即可,如下图:
在这里插入图片描述
保存设置后再回xampp里点击保存就ok啦。

四、测试

到了验证我们成果的时候啦
Star Apache和MySQL
在这里插入图片描述

测试Apache

在这里插入图片描述
能打开下图网页就等于Apache配置完成啦!
然后有按照我配置了Service and Port Settings的话,直接打开就可以了,如果没有的话,需要在地址的localhost后面加上你的端口号。
在这里插入图片描述

测试MySQL

在这里插入图片描述
好了,我的坑又来了

又是一个拒绝访问坑

打开后,如果报错的话,无论你是这个报错
在这里插入图片描述
还是这个报错
在这里插入图片描述
你都先在config.inc.php这个文件里随便找个地方把这句话塞进去

1 c f g [ ′ S e r v e r s ′ ] [ cfg['Servers'][ cfg[Servers][i][‘port’] = ‘MySQL端口号’;

在这里插入图片描述
在这里插入图片描述
应该都能解决,还没解决的,找度娘吧。当初为了解决这个问题,我要疯。原来就差这句代码。
点击保存,再重新点击Admin测试。
结果如下图就代表成功啦:
在这里插入图片描述

五、修改MySQL默认密码

我们刚刚按照默认的安装结果,MySQL是没有密码的,需要设置密码。
修改步骤如下:
在这里插入图片描述
在这里插入图片描述
修改成功后会出现这个提示:
在这里插入图片描述
但是此时再操作其他,会出现报错,如下图;
在这里插入图片描述
不要慌,因为这和我们的配置文件内容不符。
此时需要我们再到那个config.inc.php文件,找到下图重点语句,在‘ ’里输入你刚刚修改的密码就ok啦,如下图:
在这里插入图片描述
保存之后再刷新页面就可以了。

到这里,恭喜你,xampp的基本配置已经完成啦。

六、部署

xampp下的htdocs文件夹就是你的站点根目录了,以后要部署的项目都需要放在这个文件夹下。
如图,我test项目:D:\xampp\htdocs\test ),然后在网址栏输入http://localhost:8081/test,ok,搞掂。
在这里插入图片描述


http://www.ppmy.cn/news/1192409.html

相关文章

Vue 事件绑定 和 修饰符

目录 一、事件绑定 1.简介 : 2.实例 : 二、修饰符 1.简介 : 2.实例 : 3.扩展 : 一、事件绑定 1.简介 : (1) 在Vue中,通过"v-on:事件名"可以绑定事件,eg : v-on:click表示绑定点击事件。 (2) 触发事件时调用的方法,定义在Vu…

自学VUE笔记

一、基础语法学习 1、Attribute 绑定 a、绑定单个属性&#xff1a;给这个div 增加id 属性 ​ <div v-bind:id"dynamicId"></div>简写&#xff1a; <div :id"dynamicId"></div> b、绑定多个属性值 data() {return {objectOf…

stable-diffusion 电商领域prompt测评集合

和GhostReivew一个思路&#xff0c;还是从比较好的图片或者是civitai上找一些热门的prompt&#xff0c;从小红书上也找到了不少的prompt&#xff0c;lexica.art上也有不少&#xff0c;主要是为了电商场景的一些测评&#xff1a; 小红书、civitai、Lexica、Liblib.ai、 depth o…

C++并发与多线程(14) | condition_varible、wait、notify_one、notify_all

概念 当谈到并发编程,特别是在多线程或多进程的上下文中,条件变量(Condition Variables)、等待(wait)、通知一个(notify_one)和通知所有(notify_all)是常见的概念。它们用于协调线程的执行,以实现同步并避免竞争条件。以下是对每个术语的解释: 条件变量: 条件变量…

详解React:Props构建可复用UI的基石

React是一种流行的JavaScript库&#xff0c;用于构建用户界面。它的组件化架构使得开发人员能够轻松地构建可复用的UI元素&#xff0c;从而提高开发效率。在本文中&#xff0c;我们将探讨React中的组件和Props的重要性&#xff0c;以及如何利用它们来构建可复用的UI。 引言 在…

挑战全网最简洁快速平方根倒数算法讲解

文章目录 一句话介绍前置知识推导过程误差分析课后作业参考资料 一句话介绍 功能等同于函数(x) > 1 / Math.sqrt(x)。源码传送门&#xff1a; float Q_rsqrt( float number ) {long i;float x2, y;const float threehalfs 1.5F;x2 number * 0.5F;y number;i * ( lon…

面向对象设计——装饰模式

装饰模式&#xff08;Decorator Pattern&#xff09;是一种结构型设计模式&#xff0c;它允许你动态地为对象添加额外的功能&#xff0c;而不需要修改其源代码。这种模式属于设计模式中的包装模式&#xff0c;它通过将对象包装在装饰器类中来实现。 装饰模式的核心思想是以透明…

【element-ui】表格

效果展示 组件代码 <el-table class"compTableClass" ref"tableOOOOO":class"(className in tableConfig)?tableConfig.className:":data"tableConfig.data" :height"tableConfig.height" style"width: 100%"…