如何使用自签名证书正确设置我的Ionic(Angular)开发机? [英] How to properly setup my Ionic (Angular) dev machine with self-signed certificate?

查看：90
本文介绍了如何使用自签名证书正确设置我的Ionic(Angular)开发机?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在开发一个Ionic-Angular应用程序，由于文本流量清晰，我遇到了很多问题.所以我决定即使在编码时也要切换到https，但这并不容易.

I'm working on a Ionic-Angular app and faced quite a few issues due to clear text traffic. So I decided to switch to https even while coding but it wasn't so easy.

我打开了这个问题，并提出了我找到的答案，以保持跟踪，并希望为您节省一些时间.

I open this question and propose the answer I found to keep a trace and hopefully save you some time if you would like to do the same.

推荐答案

前提条件

您需要为您的开发机器使用一个主机名.此名称将在证书中声明，并使用该主机名访问https服务(URL必须类似于 https://[hostname]:... ，以通过证书检查).

Prerequisite

You need a hostname for your dev machine. This name will be declared in certificates and https services will be accessed using this hostname (URLs have to be like https://[hostname]:... for certificate check to pass).

如果您的网络还没有DNS，则可以使用托管在您主机上的 MaraDNS 之类的东西开发机(有关示例配置，请参阅PS).

If your network doesn't have a DNS already, you might use something like MaraDNS hosted on your dev-machine (see P.S. for sample configuration).

self_signed_template.config:

self_signed_template.config:

[req]
default_bits       = 2048
default_md         = sha256
prompt             = no
default_keyfile    = [hostname]_self_signed_key.pem
encrypt_key        = no

distinguished_name = dn

req_extensions     = v3_req
x509_extensions    = v3_req

[dn]
C            = PF
ST           = Tahiti
L            = Papeete
O            = c4-soft
emailAddress = ch4mp@c4-soft.com
CN           = [hostname]

[v3_req]
subjectAltName   = critical, @alt_names
basicConstraints = critical, CA:false
keyUsage         = critical, keyCertSign, nonRepudiation, digitalSignature, keyEncipherment
extendedKeyUsage = critical, serverAuth, clientAuth

[alt_names]
DNS.1 = [hostname]
DNS.2 = localhost
DNS.3 = 10.0.2.2

self_signed.sh

self_signed.sh

#!/bin/bash
if [ -z "$1" ]
then
  echo "Usage:"
  echo ""
  echo "self_signed.sh key_password [java_home] [hostname] [store_password] [certificates_directory_path] [cacerts_password]"
  echo ""
  echo "  - java_home is defaulted to $JAVA_HOME"
  echo "  - hostname is defaulted to $HOSTNAME"
  echo "  - store_password is defaulted to key_password"
  echo "  - certificates_directory_path is defaulted to current diretory"
  echo "  - cacerts_password is defaulted to changeit"
  echo ""
  echo "Sample:"
  echo "./self_signed.sh \"secr3!\" \"C:/Java/jdk1.8.0_281\" \"bravo-ch4mp\""
  echo ""
  exit 1
else

  echo "#------------------------------------------"
  echo "# This is a no-op script"
  echo "# Copy / paste output to:"
  echo "#   - generate certificate files"
  echo "#   - import certificates into cacerts file"
  echo "#------------------------------------------"
  
  KEY_PASSWORD="${1}"
  echo "# key password: $KEY_PASSWORD"
  
  if [ -z "$2" ]
  then
    if [ -z "$JAVA_HOME" ]
    then
      echo "ERROR: could not locate java home"
      exit 1
    else
      JAVA=$JAVA_HOME
    fi
  else
    JAVA=$2
  fi
  JAVA=$(echo $JAVA | sed 's/\\/\//g')
  echo "# java home: $JAVA"
  
  if [ -f "${JAVA}/lib/security/cacerts" ]
  then
    # recent JDKs and JREs style
    CACERTS="${JAVA}/lib/security/cacerts"
  elif [ -f "${JAVA}/jre/lib/security/cacerts" ]
  then
    # legacy JDKs style (1.8 and older)
    CACERTS="${JAVA}/jre/lib/security/cacerts"
  else
    echo "ERROR: could not locate cacerts under ${JAVA}"
    exit 1
  fi
  echo "# cacerts path: $CACERTS"
  
  if [ -z "${3}" ]
  then
    HOST="$HOSTNAME"
  else
    HOST="${3}"
  fi
  echo "# host (certificate CN): $HOST"
  
  if [ -z "${4}" ]
  then
    STORE_PASSWORD="$KEY_PASSWORD"
  else
    STORE_PASSWORD="${4}"
  fi
  echo "# store password : $STORE_PASSWORD"
  
  if [ -z "${5}" ]
  then
    CERTIF_DIR="."
  else
    CERTIF_DIR="${5}"
  fi
  echo "# certificates directory path: $CERTIF_DIR"
  CERTIF_DIR=$(echo $CERTIF_DIR | sed 's/\\/\//g')
  
  if [ -z "${6}" ]
  then
    CACERTS_PASSWORD="changeit"
  else
    CACERTS_PASSWORD="${6}"
  fi
  echo "# cacerts password: $CACERTS_PASSWORD" 
  echo "#------------------------------------------"
fi

echo ""

rm -f ${HOST}_self_signed.config;
sed 's/\[hostname\]/'${HOST}'/g' "${CERTIF_DIR}/self_signed_template.config" > "${CERTIF_DIR}/${HOST}_self_signed.config"

echo openssl req -config \"${CERTIF_DIR}/${HOST}_self_signed.config\" -new -keyout \"${CERTIF_DIR}/${HOST}_self_signed_key.pem\" -out \"${CERTIF_DIR}/${HOST}_self_signed_cert.pem\" -reqexts v3_req
echo ""

echo openssl x509 -req -days 365 -extfile \"${CERTIF_DIR}/${HOST}_self_signed.config\" -in \"${CERTIF_DIR}/${HOST}_self_signed_cert.pem\" -extensions v3_req -signkey \"${CERTIF_DIR}/${HOST}_self_signed_key.pem\" -out \"${CERTIF_DIR}/${HOST}_self_signed.crt\"
echo ""

echo openssl pkcs12 -export -in \"${CERTIF_DIR}/${HOST}_self_signed.crt\" -inkey \"${CERTIF_DIR}/${HOST}_self_signed_key.pem\" -name ${HOST}_self_signed -password pass:${KEY_PASSWORD} -out \"${CERTIF_DIR}/${HOST}_self_signed.pfx\"
echo ""

echo \"${JAVA}/bin/keytool\" -importkeystore -srckeystore \"${CERTIF_DIR}/${HOST}_self_signed.pfx\" -srcstorepass \"${STORE_PASSWORD}\" -srcstoretype pkcs12 -srcalias ${HOST}_self_signed -destkeystore \"${CERTIF_DIR}/${HOST}_self_signed.jks\" -deststoretype PKCS12 -deststorepass ${STORE_PASSWORD} -destalias ${HOST}_self_signed
echo ""

echo \"${JAVA}/bin/keytool\" -importkeystore -srckeystore \"${CERTIF_DIR}/${HOST}_self_signed.pfx\" -srcstorepass \"${STORE_PASSWORD}\" -srcstoretype pkcs12 -srcalias ${HOST}_self_signed -destkeystore \"${CACERTS}\" -deststorepass ${CACERTS_PASSWORD} -destalias ${HOST}_self_signed
echo ""

然后运行类似 ./self_signed.sh的"secr3！"C:/Java/jdk1.8.0_281 .

为每个JDK/JRE执行 ./self_signed.sh ，然后只需在第一次执行时复制/粘贴/运行所有输出命令，然后仅从第二次执行开始仅执行最后一个命令(将证书导入到JDK/JRE cacerts 文件中)，否则，您会松动以前的证书).

Execute ./self_signed.sh for each of your JDKs / JREs and then Simply copy / paste / run all output commands at 1st execution and last command only (import certificate in JDK / JRE cacerts file) from 2nd execution on (otherwise you'll loose previous certificates).

可能需要管理员特权才能将证书导入Java的cacerts中.

Admin privileges could be required to import the certificate in Java's cacerts.

在Windows上，Git Bash在路径上具有所有 sed ， openssl 和 keytool .

On windows, Git Bash has all of sed, openssl and keytool on the path.

如果将此证书添加到受信任的根颁发机构，则在导航诸如 https://[hostname]:... 之类的URL时，浏览器将不会显示任何错误或警告.

If you add this certificate to trusted root authorities, your browser will display no error nor warning when navigating URLs like https://[hostname]:....

在Windows上，可以使用 certmgr.msc (右键单击受信任的根权限，然后导入)来完成此操作.如果您在其他操作系统上成功执行此操作，请发表评论.

On windows, this can be done with certmgr.msc (right click trusted root authorities and then import). Please comment if you successfully do the same on other OS.

编辑 angular.json 来设置"sslCert"和"sslKey"在 your-project/architeect/serve/options/下，分别将其指向 [hostname] _self_signed.crt 和 [hostname] _self_signed_key.pem 产生得更早.

Edit angular.json to set "sslCert" and "sslKey" under your-project/architect/serve/options/ and point it to respectively [hostname]_self_signed.crt and [hostname]_self_signed_key.pem generated earlier.

这足以在运行 ionic serve --ssl --host = [主机名] 或 ionic电容器运行android -l --ssl --host时选择正确的证书= [主机名]

提醒:android资源文件夹位于项目下的 android/app/src/main/res/或Android Studio中的 app/res/

Reminder: android resource folder is android/app/src/main/res/ under your project or app/res/ in Android Studio

首先，将 [hostname] _self_signed.crt 复制到 raw 资源，并用 _ -(如果有).主机名中的code>.

First, copy [hostname]_self_signed.crt to raw resources, replacing -, if any, with _ in hostname.

在xml资源中创建 network_security_config.xml (请小心修改主机名)

Create network_security_config.xml in xml resources (careful with modified hostname)

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
          <certificates src="@raw/[hostname]_self_signed"/>
          <certificates src="system"/>
        </trust-anchors>
    </base-config>
</network-security-config>

重要说明:如果所有交通都通过https提供，则应将 cleartextTrafficPermitted 设置为false(这是Android 9以来的默认值).至少考虑为产品构建这么做.

important note: if all your trafic is served over https, you should set cleartextTrafficPermitted to false (which is default value since Android 9). Consider doing so for prod build at least.

最后，编辑 AndroidManifest.xml 并将 android:networkSecurityConfig ="@ xml/network_security_config" 添加到您的< application> 标签

Finally, edit AndroidManifest.xml and add android:networkSecurityConfig="@xml/network_security_config" to your <application > tag

我没有使用iOS的经验，如果可以使用，请随时发表评论或添加答案.

I have no experience with iOS, please feel free to comment or add an answer if you get it working.

嗯...这实际上取决于您使用的堆栈.一些示例:

Well... it really depends on the stack you use. A few samples:

  • 对于Kestrel(在Visual Studio中调试的.Net应用程序)，设置 ASPNETCORE_Kestrel__Certificates__Default__Password 和 ASPNETCORE_Kestrel__Certificates__Default__Path ，第二个指向 [hostname] _self_signed.pfx
  • 对于spring-boot，将 [hostname] _self_signed.jks 复制到 src/main/resources/并设置设置服务器
    • >
  • 如果您可以使用其他后端类型，请发表评论
  • For Kestrel (.Net app debugged in Visual Studio), set ASPNETCORE_Kestrel__Certificates__Default__Password and ASPNETCORE_Kestrel__Certificates__Default__Path, the second pointing to the [hostname]_self_signed.pfx
  • For spring-boot, copy [hostname]_self_signed.jks into src/main/resources/ and set server.ssl properties
  • Keycloak has comprensive doc to setup the server with custom certificate
  • Please comment if you get other backend types working

PS .我用于MaraDNS的 dwood3rc.txt 文件:

P.S. The dwood3rc.txt file I use for MaraDNS:

upstream_servers={}
# This are my internet provider DNS servers
upstream_servers["."]="104.42.155.203,52.229.31.10,113.197.68.2,113.197.68.3"

# My dev machine IP on local network
bind_address="192.168.8.100"

# The IPs allowed to connect (smartphones I test from)
recursive_acl="192.168.8.0/24"

# This is the file Deadwood uses to read the cache to and from disk
cache_file = "dw_cache_bin"

# laptop-jerem is referenced as [hostname] all over the tutorial
ip4={}
ip4["laptop-jerem."]="192.168.8.100"

一旦我的开发机器上的DNS服务器启动( net start deadwood )，我就将客户端配置为将其用作主DNS(编辑不需要网络设备的wifi网络属性)等等.

Once the DNS server is up (net start deadwood) on my dev machine, I configure clients to use it as primary DNS (edit wifi network properties which does not require rooted device) et voilà!

P.S.2 Keycloak独立配置，允许测试设备通过https连接到OpenId端点

P.S.2 Keycloak standalone configuration allowing test devices to connect to OpenId endpoints over https

将 [hostname] _self_signed.jks 复制到 standalone/configuration/.

编辑 standalone/configuration/standalone.xml 以将 $ {jboss.bind.address:127.0.0.1} 替换为 $ {jboss.bind.address:0.0.0.0} .保存并关闭.

Edit standalone/configuration/standalone.xml to replace ${jboss.bind.address:127.0.0.1} with ${jboss.bind.address:0.0.0.0}. Save and close.

使用 bin/standalone [.bat | .sh] 启动Keycloak，然后使用 bin/jboss-cli [.bat | .sh] :

Start Keycloak with bin/standalone[.bat|.sh], then using bin/jboss-cli[.bat|.sh]:

connect
/subsystem=keycloak-server/spi=hostname/provider=default:write-attribute(name=properties.frontendUrl,value="https://[hostname]:8443/auth")
/core-service=management/security-realm=UndertowRealm:add()
/core-service=management/security-realm=UndertowRealm/server-identity=ssl:add(keystore-path=[hostname]_self_signed.jks, keystore-relative-to=jboss.server.config.dir, keystore-password=[keystore_password])
/subsystem=undertow/server=default-server/https-listener=https:write-attribute(name=security-realm, value=UndertowRealm)
reload

这篇关于如何使用自签名证书正确设置我的Ionic(Angular)开发机?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆