6

angularjs アプリを構成 ( http://12factor.net/config ) に関して 12 ファクターに準拠させようとしています。

環境に依存する必要があり、コードに 、 、 などの単語が表示されないdevelopmentはずtestですproduction。

envたとえば、変数はbashに保存できます。それらをWebサーバーに渡すことができました。

.erb テンプレート ファイルをerb config.js.erb > config.js.

私はすでにこの記事を見つけましたhttp://mindthecode.com/how-to-use-environment-variables-in-your-angular-application/

しかし、これは大きな嘘であり、Grunt.js がこれを行うのは本当に... とにかく。

12factor の哲学がフロントエンド アプリケーション用に作成されたものではないことは知っていますが、角度のあるアプリケーションは多くの環境のさまざまなサーバーにデプロイでき、適切に処理しようとしても害はありません :)。

ありがとう ！

編集：

使用したい設定パラメータは、次のようなものです。

app:
   api:
       url: "The url of the api server"
       port: 8080
   cdn:
       images: "url of my images caching service"
   google:
       oauth:
           "api_key": "The api key used for that deployment"
   #other external frontend services

その他の編集:

この男はちょっと答えに行きました：http://bahmutov.calepin.co/inject-valid-constants-into-angular.html私はちょっと醜く、完全にangularjsにバインドされていると思います。しかし、それは動作します!

4

2 に答える 2

1

これが私が見つけた解決策です。これは完全にangularjsにバインドされていますが、Herokuで機能し、非常に簡単です。生成されたコードに conf モジュールを追加するだけです。

アプリを再起動するたびに、コードの新しいバージョンがコピーされるため、Append一度だけ発生します。

はAppend、既存の構成変数を再定義するだけです。誰かがもっと「上品」なものを見つけたら、私はそれを正しい解決策として喜んで言います!

var compression = require('compression');
var express = require('express');
var logfmt = require('logfmt');
var stdio = require('stdio');
var glob = require("glob");
var fs = require('fs');

// ------------------------
// Read config from args
var ops = stdio.getopt({
  'url': {
    key: 'u',
    args: 1,
    default: '',
    description: 'Url of api server'
  },
  'port': {
    key: 'p',
    args: 1,
    default: 5000,
    description: 'Port on which to listen'
  }
});


var port = ops.port || process.env.PORT;
ops.port = undefined;

// ------------------------
// Append config to js built file

var codeToAppend = 'angular.module("project.config",[]).constant("ApiConfig",' + JSON.stringify(ops) + ');';

glob(__dirname + '/dist/scripts/scripts.*.js', function(er, files) {
  fs.appendFile(files[0], codeToAppend, function(err) {
    if (err) {
      throw err;
    }
    console.log('The "conf code" was appended to file!');
  });
});

// ------------------------
// Start App :3

var app = express();

app.use(logfmt.requestLogger());
app.use(compression({
  threshold: 512
}));
app.use(express.static(__dirname + '/dist'));

app.get('/config', function(req, res) {
  res.json(ops);
});

app.listen(port);
于 2014-10-15T15:52:12.893 に答える
0

Angular-Express-Train-Seed に役立つことを願っている github のリポジトリを見つけました

于 2014-08-21T14:27:50.877 に答える