config.html 3.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <div class="gf-form-group">
  2. <div class="grafana-info-box">
  3. <h5>GCP Service Account</h5>
  4. <p>
  5. To authenticate with the Stackdriver API, you need to create a Google Cloud Platform (GCP) Service Account for
  6. the Project you want to show data for. A Grafana datasource integrates with one GCP Project. If you want to
  7. visualize data from multiple GCP Projects then you need to create one datasource per GCP Project.
  8. </p>
  9. <p>
  10. The <strong>Monitoring Viewer</strong> role provides all the permissions that Grafana needs.
  11. </p>
  12. <p>
  13. The following APIs need to be enabled on GCP for the datasource to work:
  14. <ul>
  15. <li><a class="external-link" target="_blank" href="https://console.cloud.google.com/apis/library/monitoring.googleapis.com">Monitoring
  16. API</a></li>
  17. <li><a class="external-link" target="_blank" href="https://console.cloud.google.com/apis/library/cloudresourcemanager.googleapis.com">Resource
  18. Manager API</a></li>
  19. </ul>
  20. </p>
  21. <p>Detailed instructions on how to create a Service Account can be found <a class="external-link" target="_blank"
  22. href="http://docs.grafana.org/datasources/stackdriver/">in
  23. the documentation.</a></p>
  24. </div>
  25. </div>
  26. <div class="gf-form-group">
  27. <div class="gf-form">
  28. <h3>Service Account Authentication</h3>
  29. <info-popover mode="header">Upload your Service Account key file or paste in the contents of the file. The file
  30. contents will be encrypted and saved in the Grafana database.</info-popover>
  31. </div>
  32. <div ng-if="!ctrl.current.jsonData.clientEmail && !ctrl.inputDataValid">
  33. <div class="gf-form-group" ng-if="!ctrl.inputDataValid">
  34. <div class="gf-form">
  35. <form>
  36. <dash-upload on-upload="ctrl.onUpload(dash)" btn-text="Upload Service Account key file"></dash-upload>
  37. </form>
  38. </div>
  39. </div>
  40. <div class="gf-form-group">
  41. <h5 class="section-heading" ng-if="!ctrl.inputDataValid">Or paste Service Account key JSON</h5>
  42. <div class="gf-form" ng-if="!ctrl.inputDataValid">
  43. <textarea rows="10" data-share-panel-url="" class="gf-form-input" ng-model="ctrl.jsonText" ng-paste="ctrl.onPasteJwt($event)"></textarea>
  44. </div>
  45. <div ng-repeat="valError in ctrl.validationErrors" class="text-error p-l-1">
  46. <i class="fa fa-warning"></i>
  47. {{valError}}
  48. </div>
  49. </div>
  50. </div>
  51. </div>
  52. <div class="gf-form-group" ng-if="ctrl.inputDataValid || ctrl.current.jsonData.clientEmail">
  53. <h6>Uploaded Key Details</h6>
  54. <div class="gf-form">
  55. <span class="gf-form-label width-9">Project</span>
  56. <input class="gf-form-input width-40" disabled type="text" ng-model="ctrl.current.jsonData.defaultProject" />
  57. </div>
  58. <div class="gf-form">
  59. <span class="gf-form-label width-9">Client Email</span>
  60. <input class="gf-form-input width-40" disabled type="text" ng-model="ctrl.current.jsonData.clientEmail" />
  61. </div>
  62. <div class="gf-form">
  63. <span class="gf-form-label width-9">Token URI</span>
  64. <input class="gf-form-input width-40" disabled type="text" ng-model='ctrl.current.jsonData.tokenUri' />
  65. </div>
  66. <div class="gf-form" ng-if="ctrl.current.secureJsonFields.privateKey">
  67. <span class="gf-form-label width-9">Private Key</span>
  68. <input type="text" class="gf-form-input max-width-12" disabled="disabled" value="configured">
  69. </div>
  70. <div class="gf-form width-18">
  71. <a class="btn btn-secondary gf-form-btn" href="#" ng-click="ctrl.resetValidationMessages()">Reset Service
  72. Account Key </a>
  73. <info-popover mode="right-normal">
  74. Reset to clear the uploaded key and upload a new file.
  75. </info-popover>
  76. </div>
  77. </div>
  78. <div class="grafana-info-box" ng-hide="ctrl.current.secureJsonFields.privateKey">
  79. Do not forget to save your changes after uploading a file.
  80. </div>