如何正確添加和引用js sdk到aws S3主機的Angular項目

Question

我正在做一個Angular（4）SPA，我打算在AWS S3上作爲靜態站點託管並使用AWS API網關。

因此，我現在有API-Gateway爲您生成的SDK（即JavaScript文件夾）（它是lib文件夾，apigClient.js和README.md），如果我將它放在頂層文件夾中項目（一個使用angular-cli創建的項目，因此該文件夾還具有src和package.json文件）並在index.html文件中引用它，它在本地很好地與ng serve甚至ng serve --prod --aot配合使用。下面是index.html文件的相關部分：

... 
<script type="text/javascript" src="lib/axios/dist/axios.standalone.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/rollups/hmac-sha256.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/rollups/sha256.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/components/hmac.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/components/enc-base64.js"></script> 
<script type="text/javascript" src="lib/url-template/url-template.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/sigV4Client.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/apiGatewayClient.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/simpleHttpClient.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/utils.js"></script> 
<script type="text/javascript" src="apigClient.js"></script> 
</head> 
... 

然後，我ng build --prod --aot創建項目，並在dist文件夾中的S3存儲和現場所有上傳作品的一切，除了任何來自進口的精API網關SDK。他們都返回404尋找它在：http://<my-bucket>/apigClient.js和其他圖書館得到同樣的東西。

那麼在這種情況下使用這個SDK的正確方法是什麼 - 也就是說，我應該在哪裏放置apigClient.js和lib文件夾，以及如何引用它們，以便在網站作爲靜態站點上傳後AWS S3）？

Answer 1

一種方法，我發現這樣做是把它在產生「/資產/」文件夾自動的（我把所有的JavaScript文件在/資產/ JS /），那麼可以的index.html有類似

<script type="text/javascript" src="assets/js/apiGateway/lib/axios/dist/axios.standalone.js"></script> 
... 
<script type="text/javascript" src="assets/js/apiGateway/apigClient.js"></script> 

然後一切都會編譯在一起，

而且在這種特殊情況下，我需要可以通過將一個declare var apigClientFactory: any;在requests.service.ts的頂部，我使用作出調用來引用的變量API網關。

Answer 2

src =「apigClient.js」的引用是相對於您的網站根目錄的，在這種情況下是您的s3存儲桶。只要看看你的桶，看看庫的實際位置。我認爲這是類似於http://<my-bucket>/<my-app>/apigClient.js，並確保它們在上傳後可公開訪問，因爲存儲區默認情況下不是公開的。