谁能帮助我们如何部署一个角度温泉应用程序。我们正在使用 dockerfile 进行部署。当我对其进行 dockerize 时,应用程序已成功构建和部署,但是当我尝试访问 main.js url 时出现以下错误
Access to script at 'http://localhost:8080/main-es5.js' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
VM214154 system.min.js:4 GET http://localhost:8080/main-es5.js net::ERR_FAILED
VM214152 zone.js:209 Uncaught Error: Error loading http://localhost:8080/main-es5.js
at HTMLScriptElement.<anonymous> (VM211627 system.min.js:4)
at ZoneDelegate.invokeTask (VM211625 zone.js:434)
at Zone.runTask (VM211625 zone.js:205)
at ZoneTask.invokeTask [as invoke] (VM211625 zone.js:516)
at invokeTask (VM211625 zone.js:1656)
at HTMLScriptElement.globalZoneAwareCallback (VM211625 zone.js:1682)
我的根配置的 index.html
<script type="systemjs-importmap">
{
"imports": {
"app1": "http://localhost:8080/main-es5.js",
"app2": "http://localhost:4202/main.js",
"login": "http://localhost:4204/main.js",
"nav-bar": "http://localhost:4300/main.js",
"sldb-app": "http://localhost:4205/main.js",
"single-spa": "https://cdnjs.cloudflare.com/ajax/libs/single-spa/5.5.0/system/single-spa.min.js",
"single-spa-layout": "https://unpkg.com/single-spa-layout@1.0.0-beta.2/dist/system/single-spa-layout.min.js"
}
}
</script>
包.json
{
"name": "app1",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "npm run serve:single-spa",
"build": "npm run build:single-spa",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"build:single-spa": "ng build --prod --deploy-url /dist/app1 --output-hashing none",
"serve:single-spa": "ng serve --disable-host-check --port 4201 --deploy-url http://localhost:4201/ --live-reload false"
}
Dockerfile:
# ----- BUILD -----
# Base image used for build node js apps
FROM node:12.2.0-alpine AS build
# Set our working directory
WORKDIR /app
# Copy package manifest (we do this in order to cache dependencies)
COPY ./package.json .
# Install dependencies
RUN npm i
RUN npm install -g @angular/cli@8.3.26
# Copy our application files
COPY . .
# Build a static version of our angular app
RUN ng build --prod --aot --vendor-chunk --common-chunk --delete-output-path
# ----- SERVE -----
# We'll use an nginx base to host our built static assets
FROM nginx
# Copy our minimal custom configuration
#COPY nginx.conf /etc/nginx/nginx.conf
# Copy our static assets from our build container
COPY --from=build /app/dist/app1 /usr/share/nginx/html
# support running as arbitrary user which belogs to the root group
RUN chmod g+rwx /var/cache/nginx /var/run /var/log/nginx
# 80 is a priviliged port
# users are not allowed to listen on priviliged ports
RUN sed -i.bak 's/listen\(.*\)80;/listen 8080;/' /etc/nginx/conf.d/default.conf
EXPOSE 8080
# remove the user directive
# comment user directive as master process is run as user in OpenShift anyhow
RUN sed -i.bak 's/^user/#user/' /etc/nginx/nginx.conf
#EXPOSE 8081
CMD ["nginx", "-g", "daemon off;"]