kali+vue（vite）+cpolar 搭建公网可以访问的网站_vite项目部署公网

一、下载安装使用kali

安装教程网上有很多，也很详细，下面是大佬们整理好的安装步骤：

Kali在线安装详细教程【全】-腾讯云开发者社区-腾讯云

二、vue开发网页

首先开发工具很多，可以使用vscode也可以使用webstorm，推荐使用webstorm，我使用了vite所以打包的时候在vite.config.js中添加了base

export default defineConfig({

  resolve: {

    alias:{

      '~/': `${resolve(__dirname,'src')}/`

    }

  },

  plugins: [

    vue(),

    pages(),

    layouts(),

    DirResolverHelper(),

    autoImports({

      imports : ['vue','vue-router','pinia'],

      resolvers: [ElementPlusResolver(), dirResolver(), dirResolver({target: 'src/stores'})]

    }),

    components({

      resolvers : [ElementPlusResolver(),NaiveUiResolver()]

  })],

  base:'./'

})

三、cpolar登录注册使用

地址：https://dashboard.cpolar.com/get-started

首先，登录注册一个账号可以使用免费的套餐

四、具体使用流程

（1）kali安装后启动

（2）启动apache2

        安装apache2的流程：①sudo apt update
                                           ②sudo apt install apache2

                                           ③sudo systemctl status apache2 如果这一步显示的是dead则执行启动

                                           ④sudo systemctl start apache2  安装后访问localhost 出现了apache2                                                 的页面

（2）把写的代码打包生成dist文件

此时假如你要把dist文件从本机放到kali里面的话，检查kali的虚拟机，里面有一个vmware tool，把这个安装一下就可以把本机的文件直接拖拽到kali的桌面

（3）把kali的桌面上的dist文件配置到apache2上的话可以使用命令行,进入到Desktop中（cd Desktop）cp -r  dist  /var/www/html/   这就把dist文件复制到apache2的html下，距离能访问还差一个配置，在/etc/apache2/sites-available路径下建立一个.conf文件例如 ：sudo vim vite.conf,然后将下列的内容填进去

<VirtualHost *:80>
    ServerAdmin webmaster@localhost
    DocumentRoot /var/www/html/dist
    <Directory /var/www/html/dist>
        Options Indexes FollowSymLinks
        AllowOverride All
        Require all granted
    </Directory>
    ErrorLog ${APACHE_LOG_DIR}/vite-error.log
    CustomLog ${APACHE_LOG_DIR}/vite-access.log combined
</VirtualHost>
注意端口、路径和权限

这一步完成后，就可以访问localhost/dist/# 所展示的内容了

（4）内网击穿实现公网访问

linux环境下：

①curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash（国内使用）或者curl -sL https://git.io/cpolar | sudo bash（国外使用）

②安装完毕后cpolar version 查看版本号，出现版本号证明已经安装成功

③获取授权token

使用 cpolar authtoken xxxxxxx  添加进去

④进行穿透

cpolar http 80（注意端口）

穿透后的结果

此时已经可以使用上述的地址http：xxxx/dist/ 访问官网了

⑤向系统添加服务

sudo systemctl enable cpolar
⑥启动服务

sudo systemctl start cpolar
⑦查看服务状态

sudo systemctl status cpolar
如果要是不用卸载的话使用下一个命令

curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash -s -- --remove
四、防火墙的常用指令，如果上述访问通，查看防火墙端口是否允许通过

firewalld(linux)

查看防火墙状态：firewall-cmd --state

启用/停用防火墙：systemctl start firewalld 或 systemctl stop firewalld

开放端口：firewall-cmd --zone=public --add-port=<端口号>/tcp --permanent

允许特定IP：firewall-cmd --zone=public --add-source=<IP地址> --permanent

重新加载防火墙规则：firewall-cmd --reload