Apache 如何在本地通过HTTPS轻松地为静态文件提供服务

我们有前端和后端开发人员。目前，前端开发人员必须在他们的计算机上运行所有后端的东西，这对运行/编译来说可能相当繁重

我试图通过设置一个集成服务器来减轻这个开发过程，前端开发人员将能够在该服务器上插入本地服务的文件

基本上，前端开发人员会访问类似

https://integration.company.com/?baseStaticAssetUrl=http%3A%2F%2Flocalhost%3A8080

，以便开发人员可以指定后端应在何处获取JS/CSS文件

除了HTTPS之外，这一切都很好，因为如果后端html文件是用HTTPS加载的，则无法用HTTP加载JS文件

Chrome抱怨：

[阻止]页面位于 '' 已通过HTTPS加载，但从运行不安全的内容 ''：此内容也应加载 通过HTTPS

出于特定于我们业务的原因，我希望启用HTTPS（从HTTP切换到HTTPS已经让我们能够避免由于浏览器安全性而出现意外错误）

出于这些原因，我想知道是否可以轻松地在本地设置HTTPS服务器

对于HTTP，它非常简单（

python-msimplehttpserver$PORT

），但是对于HTTPS，有没有简单的解决方案（或者我应该使用类似Apache的东西）？我想我必须获得本地主机域或其他的证书

---

你有没有看到用HTTPS提供文件的其他替代方案可以解决我的问题？

事实上，我直到现在才注意到，但当Chrome限制发生时，Chrome url栏上有一个小屏蔽图标。单击它可以删除限制，以便在用户确实希望的情况下，可以从HTTPS服务的页面加载HTTP内容。这就解决了我的问题，因为我不再需要在本地提供HTTPS文件。

有几种方法可以根据您更喜欢的语言/框架/系统来实现

基本步骤是：

生成ssl证书（将CN=localhost.ssl替换为所需的域）

openssl-req-nodes-sha256-days 365-newkey rsa:2048-new-x509-sub\
“/C=GC/ST=Garbage/L=Collector/O=ProgrammerMan/OU=Codeland/CN=localhost.ssl/emailAddress=me@example.com" \
-keyout localhost.ssl.key-out localhost.ssl.cert

使用生成的证书启动web服务器，以提供所需文件夹中的文件。nginx的配置示例如下所示

让nginx通过3002端口为同一webapp文件夹提供服务的配置示例。Https在listen指令中使用ssl关键字打开。此外，ssl_证书和ssl_证书密钥也很重要<代码>启动

停止

和

重新加载

文件是为方便您而提供的。它们允许以自包含的方式启动nginx示例，并在机器上已经运行nginx的情况下进行隔离

error_log  error.log;
pid        nginx.pid;

events {
  worker_connections  1024;
}

http {
  # Usually nginx has much more comprehensive list of mime types
  # But to keep the example self contained, here are some essential
  # definitions
  types {
    text/html                             html htm shtml;
    text/css                              css;
    text/xml                              xml;
    image/gif                             gif;
    image/jpeg                            jpeg jpg;
    application/javascript                js;
    image/png                             png;
  }

  server {
    listen              3002 ssl;
    server_name         localhost.ssl;
    ssl_certificate     ../localhost.ssl.cert;
    ssl_certificate_key ../localhost.ssl.key;

    root ../webapp;

    location / {
      autoindex on;
      index index.html;
    }
  }
}

将配置保存在

localhost.ssl

文件中，将文件放入

webapp

文件夹中，并使用

nginx-p

pwd

-c localhost.ssl

我还写了一篇关于这个主题的博文

您可以使用并获得https代理地址

ngrok http $port

---

2020年5月更新：支持本地https。

谢谢是的，我已经知道Ngrok，但从未想过如何使用它轻松公开本地内容（https:）很好的技巧：）