我想使用AngularJS将Grafana嵌入到我的Web应用程序中.目标是,当用户在我的应用程序中时,她应该能够单击按钮并加载Grafana UI.就其本身而言,这是一项简单的任务.为此,我有apache代理Grafana并返回任何必要的CORS头.apache反向代理配置如下:
Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"
Header always set Access-Control-Max-Age "1000"
Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, Authorization, accept, client-security-token"
RewriteEngine on
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=200,L]
RewriteCond %{REQUEST_METHOD} OPTIONS
ProxyPass / http://localhost:3000/
Run Code Online (Sandbox Code Playgroud)
当没有安全措施时,所有工作都完美无缺.以下代码是一个简单的HTML/Javascript,显示了我在做什么:
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="http://requirejs.org/docs/release/2.1.11/minified/require.js"></script>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<body >
<script>
var app = angular.module('myApp', []);
app.controller('MainCtrl', function ($scope, $http, $sce) {
$scope.trustSrc = function(src) {
console.log(src);
return $sce.trustAsHtml(src);
}
$http({
method : 'GET',
url …
Run Code Online (Sandbox Code Playgroud)