Ufdjrw

Fastening aluminum fascia to wooden subfascia

Is HostGator storing my password in plaintext?

How does buying out courses with grant money work?

Failed to fetch jessie backports repository

How can a function with a hole (removable discontinuity) equal a function with no hole?

Risk of infection at the gym?

What does the word "Atten" mean?

Is expanding the research of a group into machine learning as a PhD student risky?

Tiptoe or tiphoof? Adjusting words to better fit fantasy races

Why not increase contact surface when reentering the atmosphere?

Short story about space worker geeks who zone out by 'listening' to radiation from stars

Large drywall patch supports

Do the temporary hit points from Reckless Abandon stack if I make multiple attacks on my turn?

Why didn't Theresa May consult with Parliament before negotiating a deal with the EU?

Was Spock the First Vulcan in Starfleet?

How do I extract a value from a time formatted value in excel?

when is out of tune ok?

How to write papers efficiently when English isn't my first language?

Unreliable Magic - Is it worth it?

How do we know the LHC results are robust?

How can I kill an app using Terminal?

How to draw lines on a tikz-cd diagram

India just shot down a satellite from the ground. At what altitude range is the resulting debris field?

Fine Tuning of the Universe

Can i access Angular 6 build without a server?

Run Angular2 as static app in browser without a serverRun Angular 7 project locally on file:/// without serverCORS missing in Angular 4HTTP headers on Angular 5Angular getting CORS No Access-Control-Allow Origin when references css file on a https serverCross-origin request blocked--app built with Angular and ASP.NET CoreSend custom header in preflight request OPTIONS angular 5Handle offline server in angular 5 service post requestCORS error with PayPal Rest API, firebase functions and Angular 6Multiple CORS header ‘Access-Control-Allow-Origin’ not allowed / CORS header ‘Access-Control-Allow-Origin’ missing)Angular app sends just option request without postCORS Issue - Angular

0

Context

For a client, I wrap 3D animations in interactive HTML/CSS/JS mini-apps. As their demands are getting more complex, i would like to use Angular 6 as framework to replace my from-scratch base. Also, they need it to work without Internet access.

Problem

The animations must be open-able locally without an http server. No apache, or anything. My client need it simple: They can at best unzip the project and open the index.html file but installing anything would be too much to ask.

So i ran some tests, and built a "real" angular 6 app i previously designed, which uses internationalization. I figured that opening the index.html file outside of a http server breaks the app with the following error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///assets/i18n/fr.json. (Reason: CORS request not http).[Learn More]

This is because, without an server, CORS requests fail. My contents are not loaded.

References
This post seemed promising but did not help.

Also i thought there was a way to replace file:///assets/i18n/fr.json with something like ./assets/i18n/fr.json but i found no explanation in the docs (I might have missed it but it's technical for a backend-dev like me).

So i am trying to search for other workarounds. Any clues?

angular

share|improve this question

edited Mar 7 at 13:12

Loïc Pennamen

asked Mar 7 at 12:53

Loïc PennamenLoïc Pennamen

5212

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  A quick search wouldn't have been dangerous stackoverflow.com/a/54143163/4544288
  
  – Massimiliano Sartoretto
  Mar 7 at 13:01
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  You can serve your production build in place using a npm package - http-server
  
  – Tushar Walzade
  Mar 7 at 13:05
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @MassimilianoSartoretto indeed, my many searches did not hurt me. I wonder why this post did not pop up in Google neither SO. stackoverflow.com/search?q=angular+without+server I will now look into it.
  
  – Loïc Pennamen
  Mar 7 at 13:14
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Don't worry, sometimes you just need better search engines. Hope the link solution works for you.
  
  – Massimiliano Sartoretto
  Mar 7 at 13:16
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Unfortunately, http-server would require to be installed on every machine where the app would be lanched - i think. And the post stackoverflow.com/questions/54143002/… does not solve my issue; the translation file is still fetched via file:///assets/i18n/fr.json. So i guess this is a problem with ngx-translate module.
  
  – Loïc Pennamen
  Mar 7 at 13:29
  

  
  
  
  

add a comment | 

0

Context

For a client, I wrap 3D animations in interactive HTML/CSS/JS mini-apps. As their demands are getting more complex, i would like to use Angular 6 as framework to replace my from-scratch base. Also, they need it to work without Internet access.

Problem

The animations must be open-able locally without an http server. No apache, or anything. My client need it simple: They can at best unzip the project and open the index.html file but installing anything would be too much to ask.

So i ran some tests, and built a "real" angular 6 app i previously designed, which uses internationalization. I figured that opening the index.html file outside of a http server breaks the app with the following error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///assets/i18n/fr.json. (Reason: CORS request not http).[Learn More]

This is because, without an server, CORS requests fail. My contents are not loaded.

References
This post seemed promising but did not help.

Also i thought there was a way to replace file:///assets/i18n/fr.json with something like ./assets/i18n/fr.json but i found no explanation in the docs (I might have missed it but it's technical for a backend-dev like me).

So i am trying to search for other workarounds. Any clues?

angular

share|improve this question

edited Mar 7 at 13:12

Loïc Pennamen

asked Mar 7 at 12:53

Loïc PennamenLoïc Pennamen

5212

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  A quick search wouldn't have been dangerous stackoverflow.com/a/54143163/4544288
  
  – Massimiliano Sartoretto
  Mar 7 at 13:01
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  You can serve your production build in place using a npm package - http-server
  
  – Tushar Walzade
  Mar 7 at 13:05
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @MassimilianoSartoretto indeed, my many searches did not hurt me. I wonder why this post did not pop up in Google neither SO. stackoverflow.com/search?q=angular+without+server I will now look into it.
  
  – Loïc Pennamen
  Mar 7 at 13:14
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Don't worry, sometimes you just need better search engines. Hope the link solution works for you.
  
  – Massimiliano Sartoretto
  Mar 7 at 13:16
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Unfortunately, http-server would require to be installed on every machine where the app would be lanched - i think. And the post stackoverflow.com/questions/54143002/… does not solve my issue; the translation file is still fetched via file:///assets/i18n/fr.json. So i guess this is a problem with ngx-translate module.
  
  – Loïc Pennamen
  Mar 7 at 13:29
  

  
  
  
  

add a comment | 

Context

For a client, I wrap 3D animations in interactive HTML/CSS/JS mini-apps. As their demands are getting more complex, i would like to use Angular 6 as framework to replace my from-scratch base. Also, they need it to work without Internet access.

Problem

The animations must be open-able locally without an http server. No apache, or anything. My client need it simple: They can at best unzip the project and open the index.html file but installing anything would be too much to ask.

So i ran some tests, and built a "real" angular 6 app i previously designed, which uses internationalization. I figured that opening the index.html file outside of a http server breaks the app with the following error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///assets/i18n/fr.json. (Reason: CORS request not http).[Learn More]

This is because, without an server, CORS requests fail. My contents are not loaded.

References
This post seemed promising but did not help.

Also i thought there was a way to replace file:///assets/i18n/fr.json with something like ./assets/i18n/fr.json but i found no explanation in the docs (I might have missed it but it's technical for a backend-dev like me).

So i am trying to search for other workarounds. Any clues?

angular

share|improve this question

edited Mar 7 at 13:12

Loïc Pennamen

asked Mar 7 at 12:53

Loïc PennamenLoïc Pennamen

5212

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///assets/i18n/fr.json. (Reason: CORS request not http).[Learn More]

angular

angular

share|improve this question

edited Mar 7 at 13:12

Loïc Pennamen

asked Mar 7 at 12:53

Loïc PennamenLoïc Pennamen

5212

share|improve this question

edited Mar 7 at 13:12

Loïc Pennamen

asked Mar 7 at 12:53

Loïc PennamenLoïc Pennamen

5212

asked Mar 7 at 12:53

Loïc PennamenLoïc Pennamen

5212

asked Mar 7 at 12:53

Loïc PennamenLoïc Pennamen

5212

2 Answers
2

active

oldest

votes

0

I think not. Angular needs a server to run upon. But you can deploy on heroku and present this to client in realtime.
Otherwise they have to install packages if the client want to run on his/her local machine.

share|improve this answer

answered Mar 7 at 12:57

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

520114

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I forgot to mention the client needs it to work offline. I will add it to my question, thank you.
  
  – Loïc Pennamen
  Mar 7 at 13:12
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  sure @LoicPenn but i think it is not possible, without installing packages.
  
  – Muhammad Abdullah Shafiq
  Mar 7 at 13:15
  
  

  
  
  
  

add a comment | 

0

Solved it. So the real issue was with ngx-translate.

This thread answers my question, but my app was still bugged by the fact that ngx-translate fetched translations files with an absolute file\ URL.

So, i had to use ngx-translate with an HTTP loader as explained here but most importantly change the prefix of the files in production as such (in app.module.ts):

export function HttpLoaderFactory(http: HttpClient) 
 return new TranslateHttpLoader(http, "./assets/i18n/", ".json");

The . before /assets is the key. That allows locally-openable, translatable, Angular6 apps without http server.

share|improve this answer

answered Mar 7 at 14:08

Loïc PennamenLoïc Pennamen

5212

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
);



);

draft saved

draft discarded

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

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55044289%2fcan-i-access-angular-6-build-without-a-server%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

I think not. Angular needs a server to run upon. But you can deploy on heroku and present this to client in realtime.
Otherwise they have to install packages if the client want to run on his/her local machine.

share|improve this answer

answered Mar 7 at 12:57

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

520114

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I forgot to mention the client needs it to work offline. I will add it to my question, thank you.
  
  – Loïc Pennamen
  Mar 7 at 13:12
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  sure @LoicPenn but i think it is not possible, without installing packages.
  
  – Muhammad Abdullah Shafiq
  Mar 7 at 13:15
  
  

  
  
  
  

add a comment | 

0

I think not. Angular needs a server to run upon. But you can deploy on heroku and present this to client in realtime.
Otherwise they have to install packages if the client want to run on his/her local machine.

share|improve this answer

answered Mar 7 at 12:57

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

520114

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I forgot to mention the client needs it to work offline. I will add it to my question, thank you.
  
  – Loïc Pennamen
  Mar 7 at 13:12
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  sure @LoicPenn but i think it is not possible, without installing packages.
  
  – Muhammad Abdullah Shafiq
  Mar 7 at 13:15
  
  

  
  
  
  

add a comment | 

I think not. Angular needs a server to run upon. But you can deploy on heroku and present this to client in realtime.
Otherwise they have to install packages if the client want to run on his/her local machine.

share|improve this answer

answered Mar 7 at 12:57

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

520114

share|improve this answer

answered Mar 7 at 12:57

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

520114

answered Mar 7 at 12:57

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

520114

answered Mar 7 at 12:57

Muhammad Abdullah ShafiqMuhammad Abdullah Shafiq

520114

0

Solved it. So the real issue was with ngx-translate.

This thread answers my question, but my app was still bugged by the fact that ngx-translate fetched translations files with an absolute file\ URL.

So, i had to use ngx-translate with an HTTP loader as explained here but most importantly change the prefix of the files in production as such (in app.module.ts):

export function HttpLoaderFactory(http: HttpClient) 
 return new TranslateHttpLoader(http, "./assets/i18n/", ".json");

The . before /assets is the key. That allows locally-openable, translatable, Angular6 apps without http server.

share|improve this answer

answered Mar 7 at 14:08

Loïc PennamenLoïc Pennamen

5212

add a comment | 

0

Solved it. So the real issue was with ngx-translate.

This thread answers my question, but my app was still bugged by the fact that ngx-translate fetched translations files with an absolute file\ URL.

So, i had to use ngx-translate with an HTTP loader as explained here but most importantly change the prefix of the files in production as such (in app.module.ts):

export function HttpLoaderFactory(http: HttpClient) 
 return new TranslateHttpLoader(http, "./assets/i18n/", ".json");

The . before /assets is the key. That allows locally-openable, translatable, Angular6 apps without http server.

share|improve this answer

answered Mar 7 at 14:08

Loïc PennamenLoïc Pennamen

5212

add a comment | 

Solved it. So the real issue was with ngx-translate.

This thread answers my question, but my app was still bugged by the fact that ngx-translate fetched translations files with an absolute file\ URL.

So, i had to use ngx-translate with an HTTP loader as explained here but most importantly change the prefix of the files in production as such (in app.module.ts):

export function HttpLoaderFactory(http: HttpClient) 
 return new TranslateHttpLoader(http, "./assets/i18n/", ".json");

The . before /assets is the key. That allows locally-openable, translatable, Angular6 apps without http server.

share|improve this answer

answered Mar 7 at 14:08

Loïc PennamenLoïc Pennamen

5212

export function HttpLoaderFactory(http: HttpClient) 
 return new TranslateHttpLoader(http, "./assets/i18n/", ".json");

share|improve this answer

answered Mar 7 at 14:08

Loïc PennamenLoïc Pennamen

5212

answered Mar 7 at 14:08

Loïc PennamenLoïc Pennamen

5212

answered Mar 7 at 14:08

Loïc PennamenLoïc Pennamen

5212