完成以下步驟，透過使用 Amazon S3 主控台上傳範例公司網站資產。
- 將範例公司網站資產從我們的資料儲存器下載至您的本機電腦。
- 在本機電腦上，將您下載的檔案解壓縮。
- 導覽至 Web_generic\Web 資料夾，並開啟 index.html。 對此檔案執行以下變更。此檔案的預設格式已包含在本程序末尾。
必要：
- stateMachineArn = 使用您在單元 3 中建立的 狀態機器的 ARN 取代預設值。
- subnet1id = 使用您用於此專案的 VPC 中的第一個私有子網路的 ID 取代 <SUBNET-ID>。
- subnet2id = 使用您用於此專案的 VPC 中的第二個私有子網路的 ID 取代 <SUBNET-ID>。
- securitygroup = 使用您想與 AppStream 2.0 關聯的安全群組的 ID 取代 <SECURITY-GROUP-ID>。
- url: = 使用您的 API 執行 URL 取代預設值。
要取得此 URL，請開啟 API Gateway 主控台。在導覽窗格中的 APIs 下，選擇 examplecorp_eao，然後選擇階段。在階段窗格中，展開測試，然後選擇 POST。在窗格的頂部，會顯示叫用 URL。URL 遵循此格式：
https://<UNIQUE-ID>.execute-api.amazonaws.com/test/execute
選擇性：
- ib_arn = 您想用於建立映像產生器的基本 AppStream 2.0 映像的 ARN。執行以下其中一項：
- 選項 1：要使用提供的預設映像 (公有 Windows Server 2012 R2 基本映像)，請使用您區域的值取代以下 ARN 中的 <REGION-CODE>。
- arn:aws:appstream:<REGION-CODE>::image/AppStream-WinServer2012R2-09-18-2019
- 選項 2：要使用近期發佈的 Windows Server 2016 或 Windows Server 2019 基本映像，請指定以下其中一個 ARN：
- arn:aws:appstream:<REGION-CODE>::image/AppStream-WinServer2016-09-18-2019
- arn:aws:appstream:<REGION-CODE>::image/AppStream-WinServer2019-09-18-2019
- 選項 3：指定您擁有的私有映像的 ARN。要取得映像的 ARN，請使用 AppStream 2.0 DescribeImages API 動作或 describe-images AWS CLI 命令。映像 ARN 遵循此格式：
- 私有基本映像：arn:aws:appstream:<REGION-CODE>:<AWS-ACCOUNT-ID>:image/<IMAGE-NAME>
- 公有基本映像：arn:aws:appstream:<REGION-CODE>::image/<IMAGE-NAME>
- instance_type = 用於研討會的 AppStream 2.0 執行個體類型。預設值為 stream.standard.medium。
您的帳戶必須為您選擇的執行個體大小設定限制。預設情況下，stream.standard.medium 執行個體類型的帳戶限制為五個執行個體。
4.在以下網址開啟 Amazon S3 主控台：https://console.aws.amazon.com/s3/。
5.在儲存貯體名稱清單中，選擇您在先前步驟中建立的儲存貯體的名稱。
6.在 Amazon S3 主控台視窗中的概觀標籤上，選擇上傳。
7.在除主控台視窗之外的其他視窗中，導覽至您本機電腦上的解壓縮網站資產目錄。選取該目錄下的所有檔案和資料夾。確認未選取 Web 目錄本身。
8.將您的選擇拖放至上傳對話方塊。
9.選擇上傳。
10.等待上傳完成，並確認概觀標籤上的清單中顯示的是正確的檔案和資料夾。
<!DOCTYPE HTML>
<!--
Miniport by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>Example Corp Enterprise Application Onboarding</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="icon" type="image/png" href="images/exampleco_ico.png">
<!-- API Call -->
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#submit").click(function(e) {
e.preventDefault();
var name = $("#fName").val(),
lastname = $("#lName").val(),
email = $("#email").val(),
deptcode = $("#deptcode").val(),
name_id = name.concat(deptcode),
ib_name = name.concat(deptcode,"_IB"),
ib_arn = "arn:aws:appstream:<REGION-CODE>::image/AppStream-WinServer2012R2-05-28-2019",
stateMachineArn = "arn:aws:states:<REGION-CODE>:<AWS-ACCOUNT-ID>:stateMachine:EAOv1",
subnet1id = "<SUBNET-ID>"
subnet2id = "<SUBNET-ID>"
securitygroup = "<SECURITY-GROUP-ID>"
fleet_name = deptcode.concat("_Fleet")
stack_name = deptcode.concat("_Stack")
$.ajax({
type: "POST",
url: 'https://<UNIQUE-ID>.execute-api.<REGION-CODE>.amazonaws.com/Prod/execution',
crossDomain: true,
contentType: 'application/json',
data: JSON.stringify({
'name': name_id,
'stateMachineArn': stateMachineArn,
'input': "{\"user_name\": \"" + name + "\", \"email\": \"" + email + "\", \"instance_type\": \"stream.standard.medium\", \"subnet1id\": \"" + subnet1id + "\", \"subnet2id\": \"" + subnet2id + "\", \"securitygroups\": \"" + securitygroup + "\", \"deptcode\": \"" + deptcode + "\", \"ib_arn\": \"" + ib_arn + "\", \"ib_name\": \"" + ib_name + "\", \"fleet_name\": \"" + fleet_name + "\", \"stack_name\": \"" + stack_name + "\"}"
}),
success: function(res, data, status){
console.log(res.message)
window.location.replace('https://docs.aws.amazon.com/appstream2/latest/developerguide/tutorial-image-builder.html');
},
error: function(res, data, status){
console.log(res.message)
}
});
})
});
</script>
</head>
<body class="is-preload">
<!-- Nav -->
<nav id="nav">
</nav>
<!-- Home -->
<article id="top" class="wrapper style1">
<div class="container">
<div class="row">
<div class="col-4 col-5-large col-12-medium">
<span class="image fit"><img src="images/exampleco.png" alt="Example Corp" /></span>
</div>
<div class="col-8 col-7-large col-12-medium">
<header>
<h2><strong>Enterprise Application Onboarding Portal</strong></h2>
</header>
<p>
<div class="col-12">
<form id="EAOForm">
<div class="row">
<h4>Fill out the following information to get started onboarding your applications to AppStream2.0. This will allow secure access to your application from any computer, anywhere
that has internet access via a web browser. No client device installations required.</h4>
<div class="col-6 col-12-small">
<input type="text" id="fName" placeholder="First Name" pattern="*" required>
</div>
<div class="col-6 col-12-small">
<input type="text" id="lName" placeholder="Last Name" pattern="*" required>
</div>
<div class="col-12">
<input type="email" id="email" placeholder="Email" pattern=".*" required>
</div>
<div class="col-6 col-12-small">
<input type="text" id="deptcode" placeholder="Department Code" pattern=".*" required>
</div>
<div class="col-12">
<ul class="actions">
<li><button id="submit" onclick="alert('You have submitted your request, please check your e-mail in 30 minutes.')">Start</button></li>
<li><button id="reset" class="alt">Clear</button></li>
</ul>
</div>
<p id="result"></p>
<h4>Within 30 minutes of clicking Start, you will be sent an e-mail with instructions on the next steps.</h4>
</div>
</form>
</div>
</p>
</div>
</div>
</div>
</article>
</body>
</html>
