How to selectively apply JavaScript block based on profile in JHipster - jhipster

I try to include HeapAnalytics javascript block in index.html.
HeapAnalytics gives me two version of javascript block, one meant for development and one for production. It looks like this:
// dev
<script>xxxx</script>
// prod
<script>yyyy</script>
I want to know how to include the right one when I use "-Dspring.profiles.active=prod"?
Currently I do it manually, which is error prone.

This information can be obtained in the http header, X-Application-Context, which is returned by the server. For example, the following were returned for prod and dev profiles, respectively:
X-Application-Context:application:prod:8080
or
X-Application-Context:application:dev:8080

Related

How to use `index.js` in a Node.js when creating an Express service?

Hi I am structuring my Node.js project based on this, like so:
Root
product name
index.js: (contains requires for the product and the main export)
productName.js: contains application logic
test
test1.js
test2.js
...
Now I have two questions
What should logically go in index.js? At the moment I have this (would this be a good way to do things and what else might I include in index.js?):
// index.js
var myServer = require('./myServer.js'); // "product name" = "myServer"
module.exports = {
run: myServer.listen
}
Does it matter what I call the object key in module.exports (currently "run")? Why does the server always run when I execute index.js with $ node index.js how does it automatically know to run myServer.listen?
P.S.: I am aware of web structure auto-generation tools, I just wish to understand the logical reason for this suggested structure (the idea of not having any logic in index.js)
As you mentioned this is a Express service, if it is only handling backend of some application or more specifically this is only backend application, I would suggest you change name of your index.js to server.js(Thus explicitly stating that it'll process all service requests).
But if not then even index.js is fine.
Now for
1
What you've put is absolutely fine, apart from this you could require all modules, routes(or controllers whatever you name them) in a way that it serves as entry point to your application. Try not to put any logic in here.
2
Actually the server runs because it executes the script in the file called index.js, the script says myServer.listen, now if you had written console.log("Hello World") and used $ node index.js it would've printed Hello World instead.
Node just expects and executes script that is there in index.js, in your case it is to start the server.
About the logic that why not put anything else in index.js, for me the reasoning I consider good enough is it provides abstraction as it is the entry point I don't want index.js to worry about things like what to do with this data and all. I believe it should provide a base to setup server. Thus following single responsibility to some extent. Also I won't have to touch it ever in projects lifetime unless some major change occurs e.g. I decide to shift from express to something else.
EDIT
Why have a key called run
You seem to have answered it yourself(in comments), you are giving or more proper description would be you're attaching an object to module.exports as it is a object similar to JSON it was supposed to have a key(which could be anything not necessarily run it could've been hii). Now if you don't want to pass a key and export only one thing that is server.listen then you could write same as module.exports = myServer.listen; instead of
module.exports = {
hii: myServer.listen
}
Note that you could export more modules using the way you did. For more details about module.exports refer this or better google about it as this link might expire anytime and does not seem an ideal thing to put on SO.

React FacebookAuth Error: FB.login() called before FB.init()

I'm using the admin-on-rest npm package starter project and trying to plug in a simple SSO Facebook login button using the FacebookAuth npm package. Every time I try to click the "Login" button, I get the following error:
FB.login() called before FB.init()
I'm using an .env file with the following variable: REACT_APP_FACEBOOK_APP_ID and setting it to the right value. I even did console.log() within my app and can see it output.
I checked and I'm only loading the FB SDK once, not multiple times (this was a common issue reported on other threads).
Ok, it turned out to be something pretty dumb, but something to point out nonetheless!
In my .env file, I had accidentally placed a semicolon (;) at the end of the declaration, like this:
REACT_APP_FACEBOOK_APP_ID = XXXXXXXXXXXX;
Apparently .env files do NOT like semi-colons. This was just very difficult to figure out from the error above.
So if any of you want to pull your hair out because of this issue, and you're using similar tech, check to make sure you're syntactically kosher EVERYWHERE variables are being declared.
the funny thing was i forgot to replace your-app-id with my app id:
<script>
FB.init({
appId: 'your-app-id',
autoLogAppEvents: true,
xfbml: true,
version: 'v8.0'
});
</script>

Can I set environment variable in node.js depending on domain?

Can I set environment variables depending on which domain the request is going through?
What I am thinking about is that I've got my node.js application up and running, I assign two domains, the same domain, with different TLD:s like below
mydomain.fr
mydomain.de
and doing something like this pseudo code
switch(app.host) {
case 'mydomain.fr':
process.env.LANGUAGE = 'fr';
break;
case 'mydomain.de':
process.env.LANGUAGE = 'de';
break;
default:
process.env.LANGUAGE = 'en';
break;
}
I am thinkg about doing this way because I'd really like to use a node module like i18n or similar but using the same code base then just add different language variables in specific json files.
This would make it a lot easier if I would like to launch my website in a new country like Italy (.it) or anything else. If I push an update to the website it's automatically pushed to all languages.
My main question is now first: Is this possible?
and second what are the pros and especially cons for this approach? I've already listed some pros and right now the only con I can think of is that one web server needs to be larger/stronger than I would've need if I set the page up on different servers.
Worth mentioning is that the traffic on each language site is rather low (below 10k per month for both languages)
Another mention that could be worth mentioning is that I'm planning to deploy these websites to Heroku if that would matter.
It wouldn't work if two domains run simultaneously.
Global variables like process in node.js are just that: global. What would happen if you run two services (apps) is that the first will set the variable process.env.LANGUAGE to something and the second will overwrite it.
It wouldn't even work if you do it per-connection. The first customer from France will set process.env.LANGUAGE to fr then the second customer from Germany will set it to de then by the time you respond to the first customer (who is French) you will end up giving him the page in German.
Remember, while node.js is only single threaded we still need to worry about multiple connections because they can be concurrent.
The correct place to attach something like this is the variable that you uniquely get for each connection: the request object and response object (usually abbreviated as req and res). If you want something standard-ish, add a pseudo-header to the request object using a middleware. I'd personally just do req.lang = 'de';

How can I make Plone portal registries find and cook new-style static resources?

All JS I register with an id such as ++theme++mythemename/js/myscript.js gives me the following error on portal_javascripts: (resource not found or not accessible)
I know the id is correct because I can access localhost/mysite/++theme++mythemename/js/myscript.js (even if Diazo is disabled).
If development mode is on the resource gets delivered on the final HTML. However on production mode cooking process fails silently. Or almost. Besides getting a different cachekey than the one showed on portal_javascripts/manage_jsComposition, I see the following error message by accessing the cooked file:
/* XXX ERROR -- access to '++theme++mythemename/js/myscript.js' not authorized */
Any hints on how to deal with those? Or will I really need to leave them uncooked?
Have you tried a browser:resourceDirectory instead of a plone:static ?
<browser:resourceDirectory
name="yourJsFolder"
directory="yourJsFolder"
layer=".interfaces.IThemeSpecific"
/>
and calling your js with :
++resource++yourJsFolder/yourJsFile.js
i added your observatorio.tema package to an existing plone 4.1 buildout and added a random js file to the js registry (positioned after collapsibleformfields.js so it gets properly cooked)
GS export looks like:
<javascript authenticated="False" cacheable="True" compression="safe"
conditionalcomment="" cookable="True" enabled="True" expression=""
id="++theme++observatorio/js/ui.js" inline="False" insert-after="collapsibleformfields.js"/>
no error in portal_jacascripts and the javascript file is included in /jquery-cachekey-e7bee35d43da7a91eb29c6586dcbd396.js
did you add cacheable="False" and cookable="False" for testing purposes?
https://github.com/observatoriogenero/observatorio.tema/blob/master/src/observatorio/tema/profiles/default/jsregistry.xml#L373
since plone:static internally is a resourceDirectory both should and do work with resourceregistries.
maybe there is some other code in your buildout that re-registers another (empty) directory for the same name (observatorio)?

How to do navigation durandal.js?

i am trying to use durandal.js for single page architecture,
i already have application where i am loading all pages in div = old approach for single page architecture,
what i want to do is when i click on page i need to open hotspa pages,
for now i write something like this . www.xyz.com#/details,
where # details is my durandal view page!
when i put <a> herf ....#/details, i got error like this :
http://postimg.org/image/hoeu1wiz5/
but when i refresh with same url, it is working fine, i am able to see view!
i do not know why i got this error
If you are using anything before version 2.0 of Durandal, you are getting this because in your Shell.js you are not defining router, or you have a bad definition of where the router module is, or possibly you are defining scripts in your index instead of 'requiring them' via require.js
1st - Check shell.js, at the top you should have a define function and it should say / do something like this, and should be exposing that to the view like so -
define(['durandal/plugins/router'], function (router) {
var shell = {
router: router
};
return shell;
};
2nd - Check and make sure the 'durandal/plugins/router' is point to the correct location in the solution explorer, in this case it is app > durandal > plugins > router. If it is not or if there is no router you can add it using nuget.
3rd - Make sure you aren't loading scripts up in your index or shell html pages. When using require.js you need to move any scripts you are loading into a require statement for everything to function properly. The 'Mismatched anonymous define() module' error usually occurs when you are loading them elsewhere - http://requirejs.org/docs/errors.html#mismatch

Resources