Skip to content

Commit

Permalink
Update Manifest query to handle both schema versions
Browse files Browse the repository at this point in the history 
The Manifest API will return information about the image or tag. This information
is stored in a schema, that schema has two versions. For older Docker clients/
registries the v1 schema is returned by default; however, newer registries
can return either v1 or v2. The API requires that you set a header to tell
it which schema version you want.

PR kwk#101 added the use of the Manifest API so we can show the Dockerfile, and
size, and labels, etc. It is setting the header of the request so that we
get the v2 version of the schema however it is parsing/expecting the V1
version of the schema. If we are using an older registry (i.e. 2.1.1) then
this works because the header is ignored and only the V1 is returned; however,
if using a newer version (i.e. 2.6.2) the v2 schema would be returned and
not parsed correctly.

PR kwk#168 modifies the use of the Manifest API so that it _does_ parse/expect
the V2 schema; however, that means that the app will no longer work in
older registries (or for images pushed by older clients) as it no longer
supportes the V1 schema.

This change set merged these two PRs together by checking the content type
header in the response to figure out which version the registry returned.
It then parses the payload depending on the schema version. With this change
the user gets a very similar experance regardless of the manifest schema version
being returned.

Note: There is likly room for performance improvments here, I plan on a larger
refactor and will like to address the ineffeciencies their
  • Loading branch information
Brad van der Laan committed Jun 14, 2018
1 parent c144a1d commit ca0c5c0
Show file tree
Hide file tree
Showing 4 changed files with 225 additions and 111 deletions.
33 changes: 25 additions & 8 deletions app/image/image-controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,24 +13,41 @@ angular.module('image-controller', ['registry-services', 'app-mode-services'])


$scope.appMode = AppMode.query();
$scope.totalImageSize = 0;
$scope.imageDetails = Manifest.query({repository: $scope.repository, tagName: $scope.tagName});
Manifest.query({repository: $scope.repository, tagName: $scope.tagName})
.$promise.then(function(data) {
$scope.imageDetails = angular.copy(data);

return !data.isSchemaV2
? undefined
: Blob.query({repository: $scope.repository, digest: 'sha256:'+data.id})
.$promise.then(function(config) {
$scope.imageDetails.created = config.created;
$scope.imageDetails.docker_version = config.docker_version;
$scope.imageDetails.os = config.os;
$scope.imageDetails.architecture = config.architecture;
$scope.imageDetails.labels = config.container_config && config.container_config.Labels;
$scope.imageDetails.dockerfile = config.dockerfile;
$scope.imageDetails.layers = config.dockerfile.length;

$scope.totalImageSize = $scope.imageDetails.size;
});
});



/**
* Calculates the total download size for the image based on
* it's layers.
*/
$scope.totalImageSize = null;
$scope.calculateTotalImageSize = function() {
$scope.totalImageSize = 0;
angular.forEach($scope.imageDetails.fsLayers, function (id, key) {
Blob.query({repository: $scope.repository, digest: id.blobSum}).$promise.then(function(data){
if(!isNaN(data.contentLength-0)){
$scope.totalImageSize += data.contentLength;
}
});
Blob.querySize({repository: $scope.repository, digest: id.blobSum})
.$promise.then(function(data){
if(!isNaN(data.contentLength-0)){
$scope.totalImageSize += data.contentLength;
}
});
});
};
}]);
18 changes: 9 additions & 9 deletions app/image/image-details-directive.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,21 +14,21 @@ <h2>
General information
</tab-heading>
<form class="form-horizontal" role="form">
<div class="form-group">
<div class="form-group" ng-show="imageDetails.labels.maintainer || imageDetails.author">
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-user"></span> Author</label>
<div class="col-sm-10">
<p class="form-control-static">{{imageDetails.labels.maintainer || imageDetails.author}}</p>
</div>
</div>
<div class="form-group" ng-if="imageDetails.comment">
<div class="form-group" ng-show="imageDetails.comment">
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-comment"></span> Comment</label>
<div class="col-sm-10">
<p class="form-control-static">
<pre>{{imageDetails.comment}}</pre>
</p>
</div>
</div>
<div class="form-group" >
<div class="form-group" ng-show="imageDetails.created" >
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-calendar"></span> Created</label>
<div class="col-sm-10">
<p class="form-control-static">
Expand All @@ -37,25 +37,25 @@ <h2>
</p>
</div>
</div>
<div class="form-group">
<div class="form-group" ng-show="imageDetails.layers">
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-align-justify"></span> Layers</label>
<div class="col-sm-10">
<p class="form-control-static">{{imageDetails.layers}}</p>
</div>
</div>
<div class="form-group">
<div class="form-group" ng-show="imageDetails.docker_version">
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-eye-open"></span> Docker version</label>
<div class="col-sm-10">
<p class="form-control-static">{{imageDetails.docker_version}}</p>
</div>
</div>
<div class="form-group">
<div class="form-group" ng-show="imageDetails.os || imageDetails.architecture">
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-cog"></span> OS</label>
<div class="col-sm-10">
<p class="form-control-static">{{imageDetails.os}}/{{imageDetails.architecture}}</p>
</div>
</div>
<div class="form-group">
<div class="form-group" ng-show="imageDetails.id">
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-qrcode"></span> ID</label>
<div class="col-sm-10">
<p class="form-control-static">
Expand All @@ -75,10 +75,10 @@ <h2>
<label class="col-sm-2 control-label"><span class="glyphicon glyphicon-compressed"></span> Size <small>(including base image sizes)</small></label>
<div class="col-sm-10">
<p class="form-control-static">
<span ng-show="totalImageSize!==null">
<span ng-show="totalImageSize!==undefined">
{{totalImageSize/1024/1024 | number: 2}} <b>MB</b>
</span>
<button type="submit" class="btn btn-info" ng-click="calculateTotalImageSize()" ng-show="totalImageSize===null">
<button type="submit" class="btn btn-info" ng-click="calculateTotalImageSize()" ng-show="totalImageSize===undefined">
<span class="glyphicon glyphicon-stats"></span> Calculate
</button>
</p>
Expand Down
Loading

0 comments on commit ca0c5c0

Please sign in to comment.