Angular 2 app routing issue on aws cloud front
We are migrating our existing website on angular 5 app. I have created static website on s3 and added error document url /new/index.html.
As idea is to serve everything on the same domain, angular app base-href is new. So it's served through /new and existing website will served as is.
To achieve this,in cloudfront i have added two origin one is old application served through load balancer and second new one served through s3 website. In behaviour path pattern new/* is served through s3 website and rest all (default *) should be through ec2 loadbalancer.
It works fine except one thing. Routing is not working correctly. Whenever I try to access specific url eg. mywebsite.com/new/auth/login it throws me back on mywebsite.com/new.
On s3 website same behaviour works fine. If i change default behaviour on cloudfront to s3 website. It works fine for angular app. But then I can't serve my existing app.
What i need to change in cloudfront to serve my angular routing correctly?
angular amazon-s3 amazon-cloudfront
asked Nov 14 '18 at 3:52
Mahen Nakar
946
add a comment |
We are migrating our existing website on angular 5 app. I have created static website on s3 and added error document url /new/index.html.
As idea is to serve everything on the same domain, angular app base-href is new. So it's served through /new and existing website will served as is.
To achieve this,in cloudfront i have added two origin one is old application served through load balancer and second new one served through s3 website. In behaviour path pattern new/* is served through s3 website and rest all (default *) should be through ec2 loadbalancer.
It works fine except one thing. Routing is not working correctly. Whenever I try to access specific url eg. mywebsite.com/new/auth/login it throws me back on mywebsite.com/new.
On s3 website same behaviour works fine. If i change default behaviour on cloudfront to s3 website. It works fine for angular app. But then I can't serve my existing app.
What i need to change in cloudfront to serve my angular routing correctly?
angular amazon-s3 amazon-cloudfront
asked Nov 14 '18 at 3:52
Mahen Nakar
946
There could be some error, please add the error details.
– Aparna
Nov 14 '18 at 4:26
there is no error. It shows me angular home page I set. Whereas same behaviour works fine on s3-website
– Mahen Nakar
Nov 14 '18 at 4:39
you need both --deploy-url and --base-href set, optional --output-path if you want to deploy it somewhere
– pixelbits
Nov 14 '18 at 5:50
as I mentioned, if i set default behaviour in cloudfront as s3 website. Then it works. And if I check on s3 website it is working. Still let me check if --deploy-url set works or not
– Mahen Nakar
Nov 14 '18 at 7:45
add a comment |
We are migrating our existing website on angular 5 app. I have created static website on s3 and added error document url /new/index.html.
As idea is to serve everything on the same domain, angular app base-href is new. So it's served through /new and existing website will served as is.
To achieve this,in cloudfront i have added two origin one is old application served through load balancer and second new one served through s3 website. In behaviour path pattern new/* is served through s3 website and rest all (default *) should be through ec2 loadbalancer.
It works fine except one thing. Routing is not working correctly. Whenever I try to access specific url eg. mywebsite.com/new/auth/login it throws me back on mywebsite.com/new.
On s3 website same behaviour works fine. If i change default behaviour on cloudfront to s3 website. It works fine for angular app. But then I can't serve my existing app.
What i need to change in cloudfront to serve my angular routing correctly?
angular amazon-s3 amazon-cloudfront
asked Nov 14 '18 at 3:52
Mahen Nakar
946
We are migrating our existing website on angular 5 app. I have created static website on s3 and added error document url /new/index.html.
As idea is to serve everything on the same domain, angular app base-href is new. So it's served through /new and existing website will served as is.
To achieve this,in cloudfront i have added two origin one is old application served through load balancer and second new one served through s3 website. In behaviour path pattern new/* is served through s3 website and rest all (default *) should be through ec2 loadbalancer.
It works fine except one thing. Routing is not working correctly. Whenever I try to access specific url eg. mywebsite.com/new/auth/login it throws me back on mywebsite.com/new.
On s3 website same behaviour works fine. If i change default behaviour on cloudfront to s3 website. It works fine for angular app. But then I can't serve my existing app.
What i need to change in cloudfront to serve my angular routing correctly?
angular amazon-s3 amazon-cloudfront
angular amazon-s3 amazon-cloudfront
asked Nov 14 '18 at 3:52
Mahen Nakar
946
asked Nov 14 '18 at 3:52
Mahen Nakar
946
asked Nov 14 '18 at 3:52
Mahen Nakar
946
asked Nov 14 '18 at 3:52
Mahen Nakar
946
asked Nov 14 '18 at 3:52
Mahen Nakar
946
946
There could be some error, please add the error details.
– Aparna
Nov 14 '18 at 4:26
there is no error. It shows me angular home page I set. Whereas same behaviour works fine on s3-website
– Mahen Nakar
Nov 14 '18 at 4:39
you need both --deploy-url and --base-href set, optional --output-path if you want to deploy it somewhere
– pixelbits
Nov 14 '18 at 5:50
as I mentioned, if i set default behaviour in cloudfront as s3 website. Then it works. And if I check on s3 website it is working. Still let me check if --deploy-url set works or not
– Mahen Nakar
Nov 14 '18 at 7:45
add a comment |
There could be some error, please add the error details.
– Aparna
Nov 14 '18 at 4:26
there is no error. It shows me angular home page I set. Whereas same behaviour works fine on s3-website
– Mahen Nakar
Nov 14 '18 at 4:39
you need both --deploy-url and --base-href set, optional --output-path if you want to deploy it somewhere
– pixelbits
Nov 14 '18 at 5:50
as I mentioned, if i set default behaviour in cloudfront as s3 website. Then it works. And if I check on s3 website it is working. Still let me check if --deploy-url set works or not
– Mahen Nakar
Nov 14 '18 at 7:45
There could be some error, please add the error details.
– Aparna
Nov 14 '18 at 4:26
There could be some error, please add the error details.
– Aparna
Nov 14 '18 at 4:26
there is no error. It shows me angular home page I set. Whereas same behaviour works fine on s3-website
– Mahen Nakar
Nov 14 '18 at 4:39
there is no error. It shows me angular home page I set. Whereas same behaviour works fine on s3-website
– Mahen Nakar
Nov 14 '18 at 4:39
you need both --deploy-url and --base-href set, optional --output-path if you want to deploy it somewhere
– pixelbits
Nov 14 '18 at 5:50
you need both --deploy-url and --base-href set, optional --output-path if you want to deploy it somewhere
– pixelbits
Nov 14 '18 at 5:50
as I mentioned, if i set default behaviour in cloudfront as s3 website. Then it works. And if I check on s3 website it is working. Still let me check if --deploy-url set works or not
– Mahen Nakar
Nov 14 '18 at 7:45
as I mentioned, if i set default behaviour in cloudfront as s3 website. Then it works. And if I check on s3 website it is working. Still let me check if --deploy-url set works or not
– Mahen Nakar
Nov 14 '18 at 7:45
add a comment |
1 Answer
1
active
oldest
votes
There was session redirection written in angular by my developer by mistake. I had commented code and it's working as desired. Thanks.
answered Nov 22 '18 at 8:23
Mahen Nakar
946
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53292953%2fangular-2-app-routing-issue-on-aws-cloud-front%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
There was session redirection written in angular by my developer by mistake. I had commented code and it's working as desired. Thanks.
answered Nov 22 '18 at 8:23
Mahen Nakar
946
add a comment |
There was session redirection written in angular by my developer by mistake. I had commented code and it's working as desired. Thanks.
answered Nov 22 '18 at 8:23
Mahen Nakar
946
add a comment |
There was session redirection written in angular by my developer by mistake. I had commented code and it's working as desired. Thanks.
answered Nov 22 '18 at 8:23
Mahen Nakar
946
There was session redirection written in angular by my developer by mistake. I had commented code and it's working as desired. Thanks.
answered Nov 22 '18 at 8:23
Mahen Nakar
946
answered Nov 22 '18 at 8:23
Mahen Nakar
946
answered Nov 22 '18 at 8:23
Mahen Nakar
946
answered Nov 22 '18 at 8:23
Mahen Nakar
946
946
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53292953%2fangular-2-app-routing-issue-on-aws-cloud-front%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
There could be some error, please add the error details.
– Aparna
Nov 14 '18 at 4:26
there is no error. It shows me angular home page I set. Whereas same behaviour works fine on s3-website
– Mahen Nakar
Nov 14 '18 at 4:39
you need both --deploy-url and --base-href set, optional --output-path if you want to deploy it somewhere
– pixelbits
Nov 14 '18 at 5:50
as I mentioned, if i set default behaviour in cloudfront as s3 website. Then it works. And if I check on s3 website it is working. Still let me check if --deploy-url set works or not
– Mahen Nakar
Nov 14 '18 at 7:45