I am glad you are asking questions.Cross-origin resource sharing (CORS) can sometimes present challenges for the apps and APIs you publish through the Microsoft Entra application proxy. ![]() PS: Being new to Docker is obvious but there is nothing wrong with that. If you are the only dev and you are deploying to the same server then it's entirely personal preference. ![]() If you would like Node to serve your angular app the command is npm start.Īs for whether they need to be split into separate containers or even apps and codebases depends entirely on your deployment and/or development cycle. Net Core can also do using app.UseStaticFiles() and you can even specify your dist directory to serve from. Your NGINX server is acting as a webserver in this case which. When you run npm run build it creates something more like a static site. When you had one in docker and one outside of docker it acts as the same because it's direct with no DNS involved but rather the hostname resolution which is handled differently.Īlso, your angular app is being built and not served. Since this route goes through the DNS it acts like a cross origin request. With both apps inside containers you going from one container up to the host machine and then back down to the other container. That happens because Docker has it's own DNS inside that manages the network. In containerized environments, you will have to restore to a gateway with routing and/or reverse proxy so that the browser sees both the UI and API as the same ip/port. But the browser will still makes this a problem if not configured as a proxy. In your UI code, the API requests are going to be made to :8080, which results in CORS headers needed. But your API server is generally port 8080 for developer boxes. running the npm start (my UI is React) on your developer box will start you UI on port 3000 by default. In developer mode, if you are using webpack or something like it to develop, you most likely have a proxy setup for your API calls so that it works. You configure it so that /api/* is routed to the API container, and the UI of / goes to the UI container. to make that work, you have to enable a reverse proxy like nginx as a container in FRONT of both your UI and API containers. This allows the browser UI to make API calls with no issues. The point is, your end user sees a single URL domain, with some sort of path from it. In production, you would want your users to go to and your API calls should be /api (or ) (or anything you want to name those). the reason this happens is the web browser that loads your UI from one ip/port, is trying to make a call to a different ip/port that your API is at. I have hardcoded the Web API of the URL as: Docker File of Angular stage 1ĬOPY -from=node /usr/src/app/dist/miniRws /usr/share/nginx/htmlĬOPY. ![]() So I am running the Angular via Browser as: https:\localhost:8001 BUT.Ģ)When the Angular App is Deployed in Docker, I Get Error to Enable CORS.ĭoes CORS need to be handled differently in DOCKERS?Īccess to XMLHttpRequest at ' from origin ' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.ĬONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMESįd9d8382adff minirws:v505 "nginx -g 'daemon of…" 6 seconds ago Up 4 seconds 0.0.0.0:8001->80/tcp minirwscontainer2Ĩdf134237c94 examservice:v3.2 "dotnet ExamService.…" 2 hours ago Up 2 hours 0.0.0.0:8080->80/tcp examservicecontainerĢbc88ab55195 mongo "docker-entrypoint.s…" 13 days ago Up 10 hours 0.0.0.0:27027->27017/tcp mongoDockdbĭocker run -d -net=isolated_network -p 8080:80 -name examservicecontainer examservice:3.2ĭocker run -d -net=isolated_network -p 8001:80 -name minirwscontainer2 minirws:v505 I have enabled CORS and have deployed the Web API to Dockers.ġ)When I run my Angular App locally and point to the Web API, its all good.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |