Question

我目前处于将我的一个ember应用程序部署到具有Ubuntu LTS + Apache / Nginx配置的服务器的状态。

然而，似乎构建过程出错了，可能是由于我身边缺少信息。

我的配置如下所示：

// config/environment.js
/* jshint node: true */

module.exports = function (environment) {
  var ENV = {
    modulePrefix: 'app-name',
    environment: environment,
    baseURL: '/',
    locationType: 'auto',
    bingMapsApiKey: null,
    EmberENV: {
      FEATURES: {
        // Here you can enable experimental features on an ember canary build
        // e.g. 'with-controller': true
      }
    },
    contentSecurityPolicy: {
      'default-src': "'none'",
      'script-src': "'self' 'unsafe-inline' 'unsafe-eval'",
      'font-src': "'self'",
      'connect-src': "'self'",
      'img-src': "'self'",
      'report-uri': "'localhost'",
      'style-src': "'self' 'unsafe-inline'",
      'frame-src': "'none'"
    },
    APP: {
      // Here you can pass flags/options to your application instance
      // when it is created
    }
  };

  if (environment === 'development') {
    //ENV.APP.LOG_RESOLVER = true;
    //ENV.APP.LOG_ACTIVE_GENERATION = true;
    //ENV.APP.LOG_TRANSITIONS = true;
    //ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
    //ENV.APP.LOG_VIEW_LOOKUPS = true;
    ENV.bingMapsApiKey = process.env.BING_MAPS_API_KEY;
  }

  if (environment === 'test') {
    // Testem prefers this...
    ENV.baseURL = '/';
    ENV.locationType = 'none';

    // keep test console output quieter
    ENV.APP.LOG_ACTIVE_GENERATION = false;
    ENV.APP.LOG_VIEW_LOOKUPS = false;

    ENV.APP.rootElement = '#ember-testing';
  }

  if (environment === 'production') {
    ENV.bingMapsApiKey = process.env.BING_MAPS_API_KEY;
  }

  return ENV;
};

// ember-cli-build.js
/*jshint node:true*/
/* global require, module */
var EmberApp = require('ember-cli/lib/broccoli/ember-app')
var Funnel = require('broccoli-funnel')

module.exports = function(defaults) {
  var app = new EmberApp(defaults, {
    // Add options here
  });

  var CesiumAsset = new Funnel('vendor/cesium/')

  app.import('vendor/cesium/Cesium/Cesium.js')
  app.import('vendor/cesium/Cesium/Widgets/widgets.css')

  // Use `app.import` to add additional libraries to the generated
  // output files.
  //
  // If you need to use different assets in different
  // environments, specify an object as the first parameter. That
  // object's keys should be the environment name and the values
  // should be the asset to use in that environment.
  //
  // If the library that you are including contains AMD or ES6
  // modules that you would like to import into your application
  // please specify an object with the list of modules as keys
  // along with the exports of each module as its value.
  return app.toTree(CesiumAsset)
};

似乎应用程序已链接到localhost：4200，因为我收到如下错误：

Mixed Content: The page at 'https://social-journey.com/' was loaded over HTTPS, but requested an insecure image 'http://localhost:4200/Cesium/Widgets/Images/ImageryProviders/bingAerial.png'. This content should also be served over HTTPS.

Image from origin 'http://localhost:4200' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://social-journey.com' is therefore not allowed access.

有人看到缺少配置吗？

提前谢谢。

Answer 1

我终于发现它不是一个灰烬问题。

我已经集成到我的ember项目中的第三方组件cesium.js需要一个基本URL。

此基本网址已在index.html中静态设置：

// app/index.html
<script type="text/javascript">
  var CESIUM_BASE_URL = "http://localhost:4200/Cesium";
</script>

但是，我发现这个npm module可以从environment.js配置文件中加载变量。

所以最后我的解决方案看起来像这样：

// app/index.html
<script>
  var CESIUM_BASE_URL = '{{content-for 'config.CESIUM_BASE_URL'}}';
</script>

// config/environment.js
  ...
  if (environment === 'development') {
    ENV.CESIUM_BASE_URL = "http://localhost:4200/Cesium";
  }


  if (environment === 'production') {
    ENV.CESIUM_BASE_URL = "https://domain/Cesium";
  }
  ...

为什么ember-cli使用错误的主机构建？

1 个答案: