2659 lines
222 KiB
HTML
2659 lines
222 KiB
HTML
|
<!DOCTYPE html><html lang="fr">
|
|||
|
|
<head><meta charset="utf-8">
|
|||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"><title>Autorité de certification et authentification par certificat client (OpenSSL,nginx) - YannStatic</title>
|
|||
|
|
|
|||
|
|
<meta name="description" content="Autorité de certification et certificats OpenSSL">
|
|||
|
|
<link rel="canonical" href="https://static.rnmkcy.eu/2019/07/10/Autorite-de-certification-et-certificats-OpenSSL.html"><link rel="alternate" type="application/rss+xml" title="YannStatic" href="/feed.xml">
|
|||
|
|
|
|||
|
|
<!-- - include head/favicon.html - -->
|
|||
|
|
<link rel="shortcut icon" type="image/png" href="/assets/favicon/favicon.png"><link rel="stylesheet" href="/assets/css/main.css"><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" ><!-- start custom head snippets --><link rel="stylesheet" href="/assets/css/expand.css">
|
|||
|
|
<!-- end custom head snippets --><script>(function() {
|
|||
|
|
window.isArray = function(val) {
|
|||
|
|
return Object.prototype.toString.call(val) === '[object Array]';
|
|||
|
|
};
|
|||
|
|
window.isString = function(val) {
|
|||
|
|
return typeof val === 'string';
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
window.hasEvent = function(event) {
|
|||
|
|
return 'on'.concat(event) in window.document;
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
window.isOverallScroller = function(node) {
|
|||
|
|
return node === document.documentElement || node === document.body || node === window;
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
window.isFormElement = function(node) {
|
|||
|
|
var tagName = node.tagName;
|
|||
|
|
return tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA';
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
window.pageLoad = (function () {
|
|||
|
|
var loaded = false, cbs = [];
|
|||
|
|
window.addEventListener('load', function () {
|
|||
|
|
var i;
|
|||
|
|
loaded = true;
|
|||
|
|
if (cbs.length > 0) {
|
|||
|
|
for (i = 0; i < cbs.length; i++) {
|
|||
|
|
cbs[i]();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
return {
|
|||
|
|
then: function(cb) {
|
|||
|
|
cb && (loaded ? cb() : (cbs.push(cb)));
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
})();
|
|||
|
|
})();
|
|||
|
|
(function() {
|
|||
|
|
window.throttle = function(func, wait) {
|
|||
|
|
var args, result, thisArg, timeoutId, lastCalled = 0;
|
|||
|
|
|
|||
|
|
function trailingCall() {
|
|||
|
|
lastCalled = new Date;
|
|||
|
|
timeoutId = null;
|
|||
|
|
result = func.apply(thisArg, args);
|
|||
|
|
}
|
|||
|
|
return function() {
|
|||
|
|
var now = new Date,
|
|||
|
|
remaining = wait - (now - lastCalled);
|
|||
|
|
|
|||
|
|
args = arguments;
|
|||
|
|
thisArg = this;
|
|||
|
|
|
|||
|
|
if (remaining <= 0) {
|
|||
|
|
clearTimeout(timeoutId);
|
|||
|
|
timeoutId = null;
|
|||
|
|
lastCalled = now;
|
|||
|
|
result = func.apply(thisArg, args);
|
|||
|
|
} else if (!timeoutId) {
|
|||
|
|
timeoutId = setTimeout(trailingCall, remaining);
|
|||
|
|
}
|
|||
|
|
return result;
|
|||
|
|
};
|
|||
|
|
};
|
|||
|
|
})();
|
|||
|
|
(function() {
|
|||
|
|
var Set = (function() {
|
|||
|
|
var add = function(item) {
|
|||
|
|
var i, data = this._data;
|
|||
|
|
for (i = 0; i < data.length; i++) {
|
|||
|
|
if (data[i] === item) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
this.size ++;
|
|||
|
|
data.push(item);
|
|||
|
|
return data;
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
var Set = function(data) {
|
|||
|
|
this.size = 0;
|
|||
|
|
this._data = [];
|
|||
|
|
var i;
|
|||
|
|
if (data.length > 0) {
|
|||
|
|
for (i = 0; i < data.length; i++) {
|
|||
|
|
add.call(this, data[i]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
Set.prototype.add = add;
|
|||
|
|
Set.prototype.get = function(index) { return this._data[index]; };
|
|||
|
|
Set.prototype.has = function(item) {
|
|||
|
|
var i, data = this._data;
|
|||
|
|
for (i = 0; i < data.length; i++) {
|
|||
|
|
if (this.get(i) === item) {
|
|||
|
|
return true;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
};
|
|||
|
|
Set.prototype.is = function(map) {
|
|||
|
|
if (map._data.length !== this._data.length) { return false; }
|
|||
|
|
var i, j, flag, tData = this._data, mData = map._data;
|
|||
|
|
for (i = 0; i < tData.length; i++) {
|
|||
|
|
for (flag = false, j = 0; j < mData.length; j++) {
|
|||
|
|
if (tData[i] === mData[j]) {
|
|||
|
|
flag = true;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (!flag) { return false; }
|
|||
|
|
}
|
|||
|
|
return true;
|
|||
|
|
};
|
|||
|
|
Set.prototype.values = function() {
|
|||
|
|
return this._data;
|
|||
|
|
};
|
|||
|
|
return Set;
|
|||
|
|
})();
|
|||
|
|
|
|||
|
|
window.Lazyload = (function(doc) {
|
|||
|
|
var queue = {js: [], css: []}, sources = {js: {}, css: {}}, context = this;
|
|||
|
|
var createNode = function(name, attrs) {
|
|||
|
|
var node = doc.createElement(name), attr;
|
|||
|
|
for (attr in attrs) {
|
|||
|
|
if (attrs.hasOwnProperty(attr)) {
|
|||
|
|
node.setAttribute(attr, attrs[attr]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return node;
|
|||
|
|
};
|
|||
|
|
var end = function(type, url) {
|
|||
|
|
var s, q, qi, cbs, i, j, cur, val, flag;
|
|||
|
|
if (type === 'js' || type ==='css') {
|
|||
|
|
s = sources[type], q = queue[type];
|
|||
|
|
s[url] = true;
|
|||
|
|
for (i = 0; i < q.length; i++) {
|
|||
|
|
cur = q[i];
|
|||
|
|
if (cur.urls.has(url)) {
|
|||
|
|
qi = cur, val = qi.urls.values();
|
|||
|
|
qi && (cbs = qi.callbacks);
|
|||
|
|
for (flag = true, j = 0; j < val.length; j++) {
|
|||
|
|
cur = val[j];
|
|||
|
|
if (!s[cur]) {
|
|||
|
|
flag = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (flag && cbs && cbs.length > 0) {
|
|||
|
|
for (j = 0; j < cbs.length; j++) {
|
|||
|
|
cbs[j].call(context);
|
|||
|
|
}
|
|||
|
|
qi.load = true;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
var load = function(type, urls, callback) {
|
|||
|
|
var s, q, qi, node, i, cur,
|
|||
|
|
_urls = typeof urls === 'string' ? new Set([urls]) : new Set(urls), val, url;
|
|||
|
|
if (type === 'js' || type ==='css') {
|
|||
|
|
s = sources[type], q = queue[type];
|
|||
|
|
for (i = 0; i < q.length; i++) {
|
|||
|
|
cur = q[i];
|
|||
|
|
if (_urls.is(cur.urls)) {
|
|||
|
|
qi = cur;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
val = _urls.values();
|
|||
|
|
if (qi) {
|
|||
|
|
callback && (qi.load || qi.callbacks.push(callback));
|
|||
|
|
callback && (qi.load && callback());
|
|||
|
|
} else {
|
|||
|
|
q.push({
|
|||
|
|
urls: _urls,
|
|||
|
|
callbacks: callback ? [callback] : [],
|
|||
|
|
load: false
|
|||
|
|
});
|
|||
|
|
for (i = 0; i < val.length; i++) {
|
|||
|
|
node = null, url = val[i];
|
|||
|
|
if (s[url] === undefined) {
|
|||
|
|
(type === 'js' ) && (node = createNode('script', { src: url }));
|
|||
|
|
(type === 'css') && (node = createNode('link', { rel: 'stylesheet', href: url }));
|
|||
|
|
if (node) {
|
|||
|
|
node.onload = (function(type, url) {
|
|||
|
|
return function() {
|
|||
|
|
end(type, url);
|
|||
|
|
};
|
|||
|
|
})(type, url);
|
|||
|
|
(doc.head || doc.body).appendChild(node);
|
|||
|
|
s[url] = false;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
return {
|
|||
|
|
js: function(url, callback) {
|
|||
|
|
load('js', url, callback);
|
|||
|
|
},
|
|||
|
|
css: function(url, callback) {
|
|||
|
|
load('css', url, callback);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
})(this.document);
|
|||
|
|
})();
|
|||
|
|
</script><script>
|
|||
|
|
(function() {
|
|||
|
|
var TEXT_VARIABLES = {
|
|||
|
|
version: '2.2.6',
|
|||
|
|
sources: {
|
|||
|
|
font_awesome: 'https://use.fontawesome.com/releases/v5.0.13/css/all.css',
|
|||
|
|
jquery: '/assets/js/jquery.min.js',
|
|||
|
|
leancloud_js_sdk: '//cdn.jsdelivr.net/npm/leancloud-storage@3.13.2/dist/av-min.js',
|
|||
|
|
chart: 'https://cdn.bootcss.com/Chart.js/2.7.2/Chart.bundle.min.js',
|
|||
|
|
gitalk: {
|
|||
|
|
js: 'https://cdn.bootcss.com/gitalk/1.2.2/gitalk.min.js',
|
|||
|
|
css: 'https://cdn.bootcss.com/gitalk/1.2.2/gitalk.min.css'
|
|||
|
|
},
|
|||
|
|
valine: 'https://unpkg.com/valine/dist/Valine.min.js'
|
|||
|
|
},
|
|||
|
|
site: {
|
|||
|
|
toc: {
|
|||
|
|
selectors: 'h1,h2,h3'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
paths: {
|
|||
|
|
search_js: '/assets/search.js'
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
window.TEXT_VARIABLES = TEXT_VARIABLES;
|
|||
|
|
})();
|
|||
|
|
</script>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="root" data-is-touch="false">
|
|||
|
|
<div class="layout--page js-page-root">
|
|||
|
|
<!----><div class="page__main js-page-main page__viewport hide-footer has-aside has-aside cell cell--auto">
|
|||
|
|
|
|||
|
|
<div class="page__main-inner">
|
|||
|
|
<div class="page__header d-print-none">
|
|||
|
|
<header class="header"><div class="main">
|
|||
|
|
<div class="header__title">
|
|||
|
|
<div class="header__brand">
|
|||
|
|
<svg id="svg" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="400" height="478.9473684210526" viewbox="0, 0, 400,478.9473684210526"><g id="svgg"><path id="path0" d="M308.400 56.805 C 306.970 56.966,303.280 57.385,300.200 57.738 C 290.906 58.803,278.299 59.676,269.200 59.887 L 260.600 60.085 259.400 61.171 C 258.010 62.428,256.198 63.600,255.645 63.600 C 255.070 63.600,252.887 65.897,252.598 66.806 C 252.460 67.243,252.206 67.600,252.034 67.600 C 251.397 67.600,247.206 71.509,247.202 72.107 C 247.201 72.275,246.390 73.190,245.400 74.138 C 243.961 75.517,243.598 76.137,243.592 77.231 C 243.579 79.293,241.785 83.966,240.470 85.364 C 239.176 86.740,238.522 88.365,237.991 91.521 C 237.631 93.665,236.114 97.200,235.554 97.200 C 234.938 97.200,232.737 102.354,232.450 104.472 C 232.158 106.625,230.879 109.226,229.535 110.400 C 228.933 110.926,228.171 113.162,226.434 119.500 C 226.178 120.435,225.795 121.200,225.584 121.200 C 225.373 121.200,225.200 121.476,225.200 121.813 C 225.200 122.149,224.885 122.541,224.500 122.683 C 223.606 123.013,223.214 123.593,223.204 124.600 C 223.183 126.555,220.763 132.911,219.410 134.562 C 218.443 135.742,217.876 136.956,217.599 138.440 C 217.041 141.424,215.177 146.434,214.532 146.681 C 214.240 146.794,214.000 147.055,214.000 147.261 C 214.000 147.467,213.550 148.086,213.000 148.636 C 212.450 149.186,212.000 149.893,212.000 150.208 C 212.000 151.386,208.441 154.450,207.597 153.998 C 206.319 153.315,204.913 150.379,204.633 147.811 C 204.365 145.357,202.848 142.147,201.759 141.729 C 200.967 141.425,199.200 137.451,199.200 135.974 C 199.200 134.629,198.435 133.224,196.660 131.311 C 195.363 129.913,194.572 128.123,193.870 125.000 C 193.623 123.900,193.236 122.793,193.010 122.540 C 190.863 120.133,190.147 118.880,188.978 115.481 C 188.100 112.928,187.151 111.003,186.254 109.955 C 185.358 108.908,184.518 107.204,183.847 105.073 C 183.280 103.273,182.497 101.329,182.108 100.753 C 181.719 100.177,180.904 98.997,180.298 98.131 C 179.693 97.265,178.939 95.576,178.624 94.378 C 178.041 92.159,177.125 90.326,175.023 87.168 C 174.375 86.196,173.619 84.539,173.342 83.486 C 172.800 81.429,171.529 79.567,170.131 78.785 C 169.654 78.517,168.697 77.511,168.006 76.549 C 167.316 75.587,166.594 74.800,166.402 74.800 C 166.210 74.800,164.869 73.633,163.421 72.206 C 160.103 68.936,161.107 69.109,146.550 69.301 C 133.437 69.474,128.581 70.162,126.618 72.124 C 126.248 72.495,125.462 72.904,124.872 73.033 C 124.282 73.163,123.088 73.536,122.219 73.863 C 121.349 74.191,119.028 74.638,117.061 74.858 C 113.514 75.254,109.970 76.350,108.782 77.419 C 107.652 78.436,100.146 80.400,97.388 80.400 C 95.775 80.400,93.167 81.360,91.200 82.679 C 90.430 83.195,89.113 83.804,88.274 84.031 C 85.875 84.681,78.799 90.910,74.400 96.243 L 73.400 97.456 73.455 106.028 C 73.526 117.055,74.527 121.238,77.820 124.263 C 78.919 125.273,80.400 127.902,80.400 128.842 C 80.400 129.202,81.075 130.256,81.900 131.186 C 83.563 133.059,85.497 136.346,86.039 138.216 C 86.233 138.886,87.203 140.207,88.196 141.153 C 89.188 142.098,90.000 143.104,90.000 143.388 C 90.000 144.337,92.129 148.594,92.869 149.123 C 93.271 149.410,93.600 149.831,93.600 150.059 C 93.600 150.286,93.932 150.771,94.337 151.136 C 94.743 151.501,95.598 153.004,96.237 154.475 C 96.877 155.947,97.760 157.351,98.200 157.596 C 98.640 157.841,99.900 159.943,101.000 162.267 C 102.207 164.817,103.327 166.644,103.825 166.876 C 104.278 167.087,105.065 168.101,105.573 169.130 C 107.658 173.348,108.097 174.093,110.006 176.647 C 111.103 178.114,112.000 179.725,112.000 180.227 C 112.000 181.048,113.425 183.163,114.678 184.200 C 115.295 184.711,117.396 188.733,117.720 190.022 C 117.855 190.562,118.603 191.633,119.381 192.402 C 120.160 193.171,121.496 195.258,122.351 197.039 C 123.206 198.820,124.167 200.378,124.487 200.501 C 124.807 200.624,125.953 202.496,127.034 204.662 C 128.114 206.828,129.676 209.299,130.505 210.153 C 131.333 211.007,132.124 212.177,132.262 212.753 C 132.618 214.239,134.291 217.048,136.288 219.516 C 137.230 220.679,138.000 221.92
|
|||
|
|
" href="/">YannStatic</a>
|
|||
|
|
</div>
|
|||
|
|
<!--<button class="button button--secondary button--circle search-button js-search-toggle"><i class="fas fa-search"></i></button>--><!-- <li><button class="button button--secondary button--circle search-button js-search-toggle"><i class="fas fa-search"></i></button></li> -->
|
|||
|
|
<!-- Champ de recherche -->
|
|||
|
|
<div id="searchbox" class="search search--dark" style="visibility: visible">
|
|||
|
|
<div class="main">
|
|||
|
|
<div class="search__header"></div>
|
|||
|
|
<div class="search-bar">
|
|||
|
|
<div class="search-box js-search-box">
|
|||
|
|
<div class="search-box__icon-search"><i class="fas fa-search"></i></div>
|
|||
|
|
<input id="search-input" type="text">
|
|||
|
|
<!-- <div class="search-box__icon-clear js-icon-clear">
|
|||
|
|
<a><i class="fas fa-times"></i></a>
|
|||
|
|
</div> -->
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- Script pointing to search-script.js -->
|
|||
|
|
<script>/*!
|
|||
|
|
* Simple-Jekyll-Search
|
|||
|
|
* Copyright 2015-2020, Christian Fei
|
|||
|
|
* Licensed under the MIT License.
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
(function(){
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$Templater_7 = {
|
|||
|
|
compile: compile,
|
|||
|
|
setOptions: setOptions
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const options = {}
|
|||
|
|
options.pattern = /\{(.*?)\}/g
|
|||
|
|
options.template = ''
|
|||
|
|
options.middleware = function () {}
|
|||
|
|
|
|||
|
|
function setOptions (_options) {
|
|||
|
|
options.pattern = _options.pattern || options.pattern
|
|||
|
|
options.template = _options.template || options.template
|
|||
|
|
if (typeof _options.middleware === 'function') {
|
|||
|
|
options.middleware = _options.middleware
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function compile (data) {
|
|||
|
|
return options.template.replace(options.pattern, function (match, prop) {
|
|||
|
|
const value = options.middleware(prop, data[prop], options.template)
|
|||
|
|
if (typeof value !== 'undefined') {
|
|||
|
|
return value
|
|||
|
|
}
|
|||
|
|
return data[prop] || match
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict';
|
|||
|
|
|
|||
|
|
function fuzzysearch (needle, haystack) {
|
|||
|
|
var tlen = haystack.length;
|
|||
|
|
var qlen = needle.length;
|
|||
|
|
if (qlen > tlen) {
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
if (qlen === tlen) {
|
|||
|
|
return needle === haystack;
|
|||
|
|
}
|
|||
|
|
outer: for (var i = 0, j = 0; i < qlen; i++) {
|
|||
|
|
var nch = needle.charCodeAt(i);
|
|||
|
|
while (j < tlen) {
|
|||
|
|
if (haystack.charCodeAt(j++) === nch) {
|
|||
|
|
continue outer;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
return true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var _$fuzzysearch_1 = fuzzysearch;
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
/* removed: const _$fuzzysearch_1 = require('fuzzysearch') */;
|
|||
|
|
|
|||
|
|
var _$FuzzySearchStrategy_5 = new FuzzySearchStrategy()
|
|||
|
|
|
|||
|
|
function FuzzySearchStrategy () {
|
|||
|
|
this.matches = function (string, crit) {
|
|||
|
|
return _$fuzzysearch_1(crit.toLowerCase(), string.toLowerCase())
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$LiteralSearchStrategy_6 = new LiteralSearchStrategy()
|
|||
|
|
|
|||
|
|
function LiteralSearchStrategy () {
|
|||
|
|
this.matches = function (str, crit) {
|
|||
|
|
if (!str) return false
|
|||
|
|
|
|||
|
|
str = str.trim().toLowerCase()
|
|||
|
|
crit = crit.trim().toLowerCase()
|
|||
|
|
|
|||
|
|
return crit.split(' ').filter(function (word) {
|
|||
|
|
return str.indexOf(word) >= 0
|
|||
|
|
}).length === crit.split(' ').length
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$Repository_4 = {
|
|||
|
|
put: put,
|
|||
|
|
clear: clear,
|
|||
|
|
search: search,
|
|||
|
|
setOptions: __setOptions_4
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* removed: const _$FuzzySearchStrategy_5 = require('./SearchStrategies/FuzzySearchStrategy') */;
|
|||
|
|
/* removed: const _$LiteralSearchStrategy_6 = require('./SearchStrategies/LiteralSearchStrategy') */;
|
|||
|
|
|
|||
|
|
function NoSort () {
|
|||
|
|
return 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const data = []
|
|||
|
|
let opt = {}
|
|||
|
|
|
|||
|
|
opt.fuzzy = false
|
|||
|
|
opt.limit = 10
|
|||
|
|
opt.searchStrategy = opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6
|
|||
|
|
opt.sort = NoSort
|
|||
|
|
opt.exclude = []
|
|||
|
|
|
|||
|
|
function put (data) {
|
|||
|
|
if (isObject(data)) {
|
|||
|
|
return addObject(data)
|
|||
|
|
}
|
|||
|
|
if (isArray(data)) {
|
|||
|
|
return addArray(data)
|
|||
|
|
}
|
|||
|
|
return undefined
|
|||
|
|
}
|
|||
|
|
function clear () {
|
|||
|
|
data.length = 0
|
|||
|
|
return data
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isObject (obj) {
|
|||
|
|
return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Object]'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isArray (obj) {
|
|||
|
|
return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Array]'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function addObject (_data) {
|
|||
|
|
data.push(_data)
|
|||
|
|
return data
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function addArray (_data) {
|
|||
|
|
const added = []
|
|||
|
|
clear()
|
|||
|
|
for (let i = 0, len = _data.length; i < len; i++) {
|
|||
|
|
if (isObject(_data[i])) {
|
|||
|
|
added.push(addObject(_data[i]))
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return added
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function search (crit) {
|
|||
|
|
if (!crit) {
|
|||
|
|
return []
|
|||
|
|
}
|
|||
|
|
return findMatches(data, crit, opt.searchStrategy, opt).sort(opt.sort)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function __setOptions_4 (_opt) {
|
|||
|
|
opt = _opt || {}
|
|||
|
|
|
|||
|
|
opt.fuzzy = _opt.fuzzy || false
|
|||
|
|
opt.limit = _opt.limit || 10
|
|||
|
|
opt.searchStrategy = _opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6
|
|||
|
|
opt.sort = _opt.sort || NoSort
|
|||
|
|
opt.exclude = _opt.exclude || []
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function findMatches (data, crit, strategy, opt) {
|
|||
|
|
const matches = []
|
|||
|
|
for (let i = 0; i < data.length && matches.length < opt.limit; i++) {
|
|||
|
|
const match = findMatchesInObject(data[i], crit, strategy, opt)
|
|||
|
|
if (match) {
|
|||
|
|
matches.push(match)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return matches
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function findMatchesInObject (obj, crit, strategy, opt) {
|
|||
|
|
for (const key in obj) {
|
|||
|
|
if (!isExcluded(obj[key], opt.exclude) && strategy.matches(obj[key], crit)) {
|
|||
|
|
return obj
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isExcluded (term, excludedTerms) {
|
|||
|
|
for (let i = 0, len = excludedTerms.length; i < len; i++) {
|
|||
|
|
const excludedTerm = excludedTerms[i]
|
|||
|
|
if (new RegExp(excludedTerm).test(term)) {
|
|||
|
|
return true
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* globals ActiveXObject:false */
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$JSONLoader_2 = {
|
|||
|
|
load: load
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function load (location, callback) {
|
|||
|
|
const xhr = getXHR()
|
|||
|
|
xhr.open('GET', location, true)
|
|||
|
|
xhr.onreadystatechange = createStateChangeListener(xhr, callback)
|
|||
|
|
xhr.send()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function createStateChangeListener (xhr, callback) {
|
|||
|
|
return function () {
|
|||
|
|
if (xhr.readyState === 4 && xhr.status === 200) {
|
|||
|
|
try {
|
|||
|
|
callback(null, JSON.parse(xhr.responseText))
|
|||
|
|
} catch (err) {
|
|||
|
|
callback(err, null)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getXHR () {
|
|||
|
|
return window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$OptionsValidator_3 = function OptionsValidator (params) {
|
|||
|
|
if (!validateParams(params)) {
|
|||
|
|
throw new Error('-- OptionsValidator: required options missing')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (!(this instanceof OptionsValidator)) {
|
|||
|
|
return new OptionsValidator(params)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const requiredOptions = params.required
|
|||
|
|
|
|||
|
|
this.getRequiredOptions = function () {
|
|||
|
|
return requiredOptions
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.validate = function (parameters) {
|
|||
|
|
const errors = []
|
|||
|
|
requiredOptions.forEach(function (requiredOptionName) {
|
|||
|
|
if (typeof parameters[requiredOptionName] === 'undefined') {
|
|||
|
|
errors.push(requiredOptionName)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
return errors
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function validateParams (params) {
|
|||
|
|
if (!params) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
return typeof params.required !== 'undefined' && params.required instanceof Array
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$utils_9 = {
|
|||
|
|
merge: merge,
|
|||
|
|
isJSON: isJSON
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function merge (defaultParams, mergeParams) {
|
|||
|
|
const mergedOptions = {}
|
|||
|
|
for (const option in defaultParams) {
|
|||
|
|
mergedOptions[option] = defaultParams[option]
|
|||
|
|
if (typeof mergeParams[option] !== 'undefined') {
|
|||
|
|
mergedOptions[option] = mergeParams[option]
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return mergedOptions
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isJSON (json) {
|
|||
|
|
try {
|
|||
|
|
if (json instanceof Object && JSON.parse(JSON.stringify(json))) {
|
|||
|
|
return true
|
|||
|
|
}
|
|||
|
|
return false
|
|||
|
|
} catch (err) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var _$src_8 = {};
|
|||
|
|
(function (window) {
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
let options = {
|
|||
|
|
searchInput: null,
|
|||
|
|
resultsContainer: null,
|
|||
|
|
json: [],
|
|||
|
|
success: Function.prototype,
|
|||
|
|
searchResultTemplate: '<li><a href="{url}" title="{desc}">{title}</a></li>',
|
|||
|
|
templateMiddleware: Function.prototype,
|
|||
|
|
sortMiddleware: function () {
|
|||
|
|
return 0
|
|||
|
|
},
|
|||
|
|
noResultsText: 'No results found',
|
|||
|
|
limit: 10,
|
|||
|
|
fuzzy: false,
|
|||
|
|
debounceTime: null,
|
|||
|
|
exclude: []
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let debounceTimerHandle
|
|||
|
|
const debounce = function (func, delayMillis) {
|
|||
|
|
if (delayMillis) {
|
|||
|
|
clearTimeout(debounceTimerHandle)
|
|||
|
|
debounceTimerHandle = setTimeout(func, delayMillis)
|
|||
|
|
} else {
|
|||
|
|
func.call()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const requiredOptions = ['searchInput', 'resultsContainer', 'json']
|
|||
|
|
|
|||
|
|
/* removed: const _$Templater_7 = require('./Templater') */;
|
|||
|
|
/* removed: const _$Repository_4 = require('./Repository') */;
|
|||
|
|
/* removed: const _$JSONLoader_2 = require('./JSONLoader') */;
|
|||
|
|
const optionsValidator = _$OptionsValidator_3({
|
|||
|
|
required: requiredOptions
|
|||
|
|
})
|
|||
|
|
/* removed: const _$utils_9 = require('./utils') */;
|
|||
|
|
|
|||
|
|
window.SimpleJekyllSearch = function (_options) {
|
|||
|
|
const errors = optionsValidator.validate(_options)
|
|||
|
|
if (errors.length > 0) {
|
|||
|
|
throwError('You must specify the following required options: ' + requiredOptions)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
options = _$utils_9.merge(options, _options)
|
|||
|
|
|
|||
|
|
_$Templater_7.setOptions({
|
|||
|
|
template: options.searchResultTemplate,
|
|||
|
|
middleware: options.templateMiddleware
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
_$Repository_4.setOptions({
|
|||
|
|
fuzzy: options.fuzzy,
|
|||
|
|
limit: options.limit,
|
|||
|
|
sort: options.sortMiddleware,
|
|||
|
|
exclude: options.exclude
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
if (_$utils_9.isJSON(options.json)) {
|
|||
|
|
initWithJSON(options.json)
|
|||
|
|
} else {
|
|||
|
|
initWithURL(options.json)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const rv = {
|
|||
|
|
search: search
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
typeof options.success === 'function' && options.success.call(rv)
|
|||
|
|
return rv
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initWithJSON (json) {
|
|||
|
|
_$Repository_4.put(json)
|
|||
|
|
registerInput()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initWithURL (url) {
|
|||
|
|
_$JSONLoader_2.load(url, function (err, json) {
|
|||
|
|
if (err) {
|
|||
|
|
throwError('failed to get JSON (' + url + ')')
|
|||
|
|
}
|
|||
|
|
initWithJSON(json)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function emptyResultsContainer () {
|
|||
|
|
options.resultsContainer.innerHTML = ''
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function appendToResultsContainer (text) {
|
|||
|
|
options.resultsContainer.innerHTML += text
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function registerInput () {
|
|||
|
|
options.searchInput.addEventListener('input', function (e) {
|
|||
|
|
if (isWhitelistedKey(e.which)) {
|
|||
|
|
emptyResultsContainer()
|
|||
|
|
debounce(function () { search(e.target.value) }, options.debounceTime)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function search (query) {
|
|||
|
|
if (isValidQuery(query)) {
|
|||
|
|
emptyResultsContainer()
|
|||
|
|
render(_$Repository_4.search(query), query)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function render (results, query) {
|
|||
|
|
const len = results.length
|
|||
|
|
if (len === 0) {
|
|||
|
|
return appendToResultsContainer(options.noResultsText)
|
|||
|
|
}
|
|||
|
|
for (let i = 0; i < len; i++) {
|
|||
|
|
results[i].query = query
|
|||
|
|
appendToResultsContainer(_$Templater_7.compile(results[i]))
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isValidQuery (query) {
|
|||
|
|
return query && query.length > 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isWhitelistedKey (key) {
|
|||
|
|
return [13, 16, 20, 37, 38, 39, 40, 91].indexOf(key) === -1
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function throwError (message) {
|
|||
|
|
throw new Error('SimpleJekyllSearch --- ' + message)
|
|||
|
|
}
|
|||
|
|
})(window)
|
|||
|
|
|
|||
|
|
}());
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<!-- Configuration -->
|
|||
|
|
<script>
|
|||
|
|
SimpleJekyllSearch({
|
|||
|
|
searchInput: document.getElementById('search-input'),
|
|||
|
|
resultsContainer: document.getElementById('results-container'),
|
|||
|
|
json: '/search.json',
|
|||
|
|
//searchResultTemplate: '<li><a href="https://static.rnmkcy.eu{url}">{date} {title}</a></li>'
|
|||
|
|
searchResultTemplate: '<li><a href="{url}">{date} {title}</a></li>'
|
|||
|
|
})
|
|||
|
|
</script>
|
|||
|
|
<!-- Fin déclaration champ de recherche -->
|
|||
|
|
</div>
|
|||
|
|
<nav class="navigation">
|
|||
|
|
<ul>
|
|||
|
|
<li class="navigation__item"><a href="/archive.html">Etiquettes</a></li>
|
|||
|
|
<li class="navigation__item"><a href="/htmldoc.html">Documents</a></li>
|
|||
|
|
<li class="navigation__item"><a href="/liens_ttrss.html">Liens</a></li>
|
|||
|
|
<li class="navigation__item"><a href="/aide-jekyll-text-theme.html">Aide</a></li>
|
|||
|
|
</ul>
|
|||
|
|
</nav>
|
|||
|
|
</div>
|
|||
|
|
</header>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="page__content"><div class="main"><div class="grid grid--reverse">
|
|||
|
|
<div class="col-main cell cell--auto">
|
|||
|
|
<!-- start custom main top snippet --><div id="results-container" class="search-result js-search-result"></div>
|
|||
|
|
<!-- end custom main top snippet -->
|
|||
|
|
<article itemscope itemtype="http://schema.org/Article"><div class="article__header"><header><h1 style="color:Tomato;">Autorité de certification et authentification par certificat client (OpenSSL,nginx)</h1></header></div>
|
|||
|
|
<meta itemprop="headline" content="Autorité de certification et authentification par certificat client (OpenSSL,nginx)">
|
|||
|
|
<div class="article__info clearfix">
|
|||
|
|
<ul class="left-col menu"><li>
|
|||
|
|
<a class="button button--secondary button--pill button--sm" href="/archive.html?tag=ssl">ssl</a>
|
|||
|
|
</li></ul>
|
|||
|
|
<ul class="right-col menu"><li>
|
|||
|
|
<i class="far fa-calendar-alt"></i> <span title="Création" style="color:#FF00FF">10 juil. 2019</span>
|
|||
|
|
|
|||
|
|
<span title="Modification" style="color:#00FF7F">28 mai 2020</span>
|
|||
|
|
</li></ul>
|
|||
|
|
</div>
|
|||
|
|
<meta itemprop="datePublished" content="2020-05-28T00:00:00+02:00">
|
|||
|
|
<meta itemprop="keywords" content="ssl">
|
|||
|
|
<div class="js-article-content">
|
|||
|
|
<div class="layout--article">
|
|||
|
|
<!-- start custom article top snippet -->
|
|||
|
|
<style>
|
|||
|
|
#myBtn {
|
|||
|
|
display: none;
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 10px;
|
|||
|
|
right: 10px;
|
|||
|
|
z-index: 99;
|
|||
|
|
font-size: 12px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
border: none;
|
|||
|
|
outline: none;
|
|||
|
|
background-color: white;
|
|||
|
|
color: black;
|
|||
|
|
cursor: pointer;
|
|||
|
|
padding: 5px;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#myBtn:hover {
|
|||
|
|
background-color: #555;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
|
|||
|
|
<button onclick="topFunction()" id="myBtn" title="Haut de page">⇧</button>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
//Get the button
|
|||
|
|
var mybutton = document.getElementById("myBtn");
|
|||
|
|
|
|||
|
|
// When the user scrolls down 20px from the top of the document, show the button
|
|||
|
|
window.onscroll = function() {scrollFunction()};
|
|||
|
|
|
|||
|
|
function scrollFunction() {
|
|||
|
|
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
|||
|
|
mybutton.style.display = "block";
|
|||
|
|
} else {
|
|||
|
|
mybutton.style.display = "none";
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// When the user clicks on the button, scroll to the top of the document
|
|||
|
|
function topFunction() {
|
|||
|
|
document.body.scrollTop = 0;
|
|||
|
|
document.documentElement.scrollTop = 0;
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<!-- end custom article top snippet -->
|
|||
|
|
<div class="article__content" itemprop="articleBody">
|
|||
|
|
<details>
|
|||
|
|
<summary><b>Afficher/cacher Sommaire</b></summary>
|
|||
|
|
<!-- affichage sommaire -->
|
|||
|
|
<div class="toc-aside js-toc-root"></div>
|
|||
|
|
</details><h1 id="autorité-de-certification-et-certificats-openssl">Autorité de certification et certificats OpenSSL</h1>
|
|||
|
|
|
|||
|
|
<ul>
|
|||
|
|
<li><a href="https://www.admin-linux.fr/autorite-de-certification-et-certificats-openssl/">Autorité de certification et certificats OpenSSL (article original)</a></li>
|
|||
|
|
<li><a href="https://medium.com/@sevcsik/authentication-using-https-client-certificates-3c9d270e8326">Authentication using HTTPS client certificates</a></li>
|
|||
|
|
</ul>
|
|||
|
|
|
|||
|
|
<h2 id="création-dune-autorité-de-certification">Création d’une autorité de certification</h2>
|
|||
|
|
|
|||
|
|
<p>Cette autorité de certification est la base de la chaine de certification. Il s’agit, ni plus ni moins, que d’un certificat x509 (auto signé) et d’une arborescence de gestion des certificats. Le certificat racine doit être protégé par un mot de passe et disposer d’une durée de validité non nulle.</p>
|
|||
|
|
|
|||
|
|
<p>La procédure de création d’une autorité de certification avec OpenSSL est grandement simplifiée par les scripts perl et bash « CA.XX » fournit dans les pacquages d’OpenSSL. En fonction des distributions, vous les trouverez dans « /usr/lib/ssl/misc/ », dans « /usr/local/ssl/misc/ », dans « <strong>/etc/ssl/misc/</strong> », ou dans « /etc/openssl/misc ». Ces scripts font la même choses, ils sont juste scriptés dans un langage différent.</p>
|
|||
|
|
|
|||
|
|
<p>Les paramètres de création de l’autorité de certification sont déclarées dans le script « CA.xx » et dans le fichier de configuration de « openssl.cnf ».</p>
|
|||
|
|
|
|||
|
|
<p>Par défaut, l’arborescence de l’autorité de certification est créée sous « ./demoCA » mais cela peut être changé dans le fichier de configuration et dans le script de création de l’autorité.</p>
|
|||
|
|
|
|||
|
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nb">sudo</span> <span class="nt">-s</span>
|
|||
|
|
<span class="nb">pwd</span>
|
|||
|
|
/etc/ssl
|
|||
|
|
tree
|
|||
|
|
<span class="nb">.</span>
|
|||
|
|
|-- misc
|
|||
|
|
| |-- CA.pl
|
|||
|
|
| |-- CA.sh
|
|||
|
|
| |-- c_hash
|
|||
|
|
| |-- c_info
|
|||
|
|
| |-- c_issuer
|
|||
|
|
| <span class="sb">`</span><span class="nt">--</span> c_name
|
|||
|
|
<span class="sb">`</span><span class="nt">--</span> openssl.cnf
|
|||
|
|
|
|||
|
|
1 directory, 7 files
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Par exemple pour créer une autorité de certification basée sur un certificat ayant une durée de validité de 10 ans dont la racine est « /etc/ssl/CertificateAuthority » , modifier les variables » CADAYS » et « CATOP » dans le fichier du script « <strong>/etc/ssl/misc/CA.pl</strong> » ou « CA.sh »</p>
|
|||
|
|
|
|||
|
|
<div class="language-perl highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">my</span> <span class="nv">$CADAYS</span> <span class="o">=</span> <span class="p">"</span><span class="s2">-days 3650</span><span class="p">";</span> <span class="c1"># 10 years</span>
|
|||
|
|
<span class="k">my</span> <span class="nv">$CATOP</span> <span class="o">=</span> <span class="p">"</span><span class="s2">/etc/ssl/CertificateAuthority</span><span class="p">";</span>
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>ainsi que la valeur de « dir » dans « <strong>/etc/ssl/openssl.cnf</strong> »</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>[ CA_default ]
|
|||
|
|
|
|||
|
|
dir = /etc/ssl/CertificateAuthority # Where everything is kept
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>avant de lancer « /chemin/vers/CA.xx -newca » :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>/etc/ssl/misc/CA.pl -newca
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code>CA certificate filename <span class="o">(</span>or enter to create<span class="o">)</span>
|
|||
|
|
|
|||
|
|
Making CA certificate ...
|
|||
|
|
<span class="o">====</span>
|
|||
|
|
openssl req <span class="nt">-new</span> <span class="nt">-keyout</span> /etc/ssl/CertificateAuthority/private/cakey.pem <span class="nt">-out</span> /etc/ssl/CertificateAuthority/careq.pem
|
|||
|
|
Generating a RSA private key
|
|||
|
|
....................................................+++++
|
|||
|
|
.+++++
|
|||
|
|
writing new private key to <span class="s1">'/etc/ssl/CertificateAuthority/private/cakey.pem'</span>
|
|||
|
|
Enter PEM pass phrase:
|
|||
|
|
Verifying - Enter PEM pass phrase:
|
|||
|
|
<span class="nt">-----</span>
|
|||
|
|
You are about to be asked to enter information that will be incorporated
|
|||
|
|
into your certificate request.
|
|||
|
|
What you are about to enter is what is called a Distinguished Name or a DN.
|
|||
|
|
There are quite a few fields but you can leave some blank
|
|||
|
|
For some fields there will be a default value,
|
|||
|
|
If you enter <span class="s1">'.'</span>, the field will be left blank.
|
|||
|
|
<span class="nt">-----</span>
|
|||
|
|
Country Name <span class="o">(</span>2 letter code<span class="o">)</span> <span class="o">[</span>AU]:FR
|
|||
|
|
State or Province Name <span class="o">(</span>full name<span class="o">)</span> <span class="o">[</span>Some-State]:Pays-De-Loire
|
|||
|
|
Locality Name <span class="o">(</span>eg, city<span class="o">)</span> <span class="o">[]</span>:SMM
|
|||
|
|
Organization Name <span class="o">(</span>eg, company<span class="o">)</span> <span class="o">[</span>Internet Widgits Pty Ltd]:yan
|
|||
|
|
Organizational Unit Name <span class="o">(</span>eg, section<span class="o">)</span> <span class="o">[]</span>:dom
|
|||
|
|
Common Name <span class="o">(</span>e.g. server FQDN or YOUR name<span class="o">)</span> <span class="o">[]</span>:YM
|
|||
|
|
Email Address <span class="o">[]</span>:admin@cinay.xyz
|
|||
|
|
|
|||
|
|
Please enter the following <span class="s1">'extra'</span> attributes
|
|||
|
|
to be sent with your certificate request
|
|||
|
|
A challenge password <span class="o">[]</span>:
|
|||
|
|
An optional company name <span class="o">[]</span>:
|
|||
|
|
<span class="o">==></span> 0
|
|||
|
|
<span class="o">====</span>
|
|||
|
|
<span class="o">====</span>
|
|||
|
|
openssl ca <span class="nt">-create_serial</span> <span class="nt">-out</span> /etc/ssl/CertificateAuthority/cacert.pem <span class="nt">-days</span> 3650 <span class="nt">-batch</span> <span class="nt">-keyfile</span> /etc/ssl/CertificateAuthority/private/cakey.pem <span class="nt">-selfsign</span> <span class="nt">-extensions</span> v3_ca <span class="nt">-infiles</span> /etc/ssl/CertificateAuthority/careq.pem
|
|||
|
|
Using configuration from /etc/ssl/openssl.cnf
|
|||
|
|
Enter pass phrase <span class="k">for</span> /etc/ssl/CertificateAuthority/private/cakey.pem:
|
|||
|
|
Check that the request matches the signature
|
|||
|
|
Signature ok
|
|||
|
|
Certificate Details:
|
|||
|
|
Serial Number:
|
|||
|
|
7e:22:56:d6:e6:90:67:7e:0d:b5:80:f0:62:af:4e:20:e3:29:d9:f1
|
|||
|
|
Validity
|
|||
|
|
Not Before: Jul 3 14:02:53 2019 GMT
|
|||
|
|
Not After : Jun 30 14:02:53 2029 GMT
|
|||
|
|
Subject:
|
|||
|
|
countryName <span class="o">=</span> FR
|
|||
|
|
stateOrProvinceName <span class="o">=</span> Pays-De-Loire
|
|||
|
|
organizationName <span class="o">=</span> yan
|
|||
|
|
organizationalUnitName <span class="o">=</span> dom
|
|||
|
|
commonName <span class="o">=</span> YM
|
|||
|
|
emailAddress <span class="o">=</span> admin@cinay.xyz
|
|||
|
|
X509v3 extensions:
|
|||
|
|
X509v3 Subject Key Identifier:
|
|||
|
|
61:D3:36:38:72:51:5C:D7:0F:53:D9:DB:3C:9F:BF:1B:02:F0:1A:73
|
|||
|
|
X509v3 Authority Key Identifier:
|
|||
|
|
keyid:61:D3:36:38:72:51:5C:D7:0F:53:D9:DB:3C:9F:BF:1B:02:F0:1A:73
|
|||
|
|
|
|||
|
|
X509v3 Basic Constraints: critical
|
|||
|
|
CA:TRUE
|
|||
|
|
Certificate is to be certified <span class="k">until </span>Jun 30 14:02:53 2029 GMT <span class="o">(</span>3650 days<span class="o">)</span>
|
|||
|
|
|
|||
|
|
Write out database with 1 new entries
|
|||
|
|
Data Base Updated
|
|||
|
|
<span class="o">==></span> 0
|
|||
|
|
<span class="o">====</span>
|
|||
|
|
CA certificate is <span class="k">in</span> /etc/ssl/CertificateAuthority/cacert.pem
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Qui aura pour effet de créer l’arborescence suivante :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>tree /etc/ssl/CertificateAuthority/
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code>/etc/ssl/CertificateAuthority/
|
|||
|
|
├── cacert.pem
|
|||
|
|
├── careq.pem
|
|||
|
|
├── certs
|
|||
|
|
├── crl
|
|||
|
|
├── crlnumber
|
|||
|
|
├── index.txt
|
|||
|
|
├── index.txt.attr
|
|||
|
|
├── index.txt.old
|
|||
|
|
├── newcerts
|
|||
|
|
│ └── 7E2256D6E690677E0DB580F062AF4E20E329D9F1.pem
|
|||
|
|
├── private
|
|||
|
|
│ └── cakey.pem
|
|||
|
|
└── serial
|
|||
|
|
|
|||
|
|
4 directories, 9 files
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Où :</p>
|
|||
|
|
|
|||
|
|
<ul>
|
|||
|
|
<li>
|
|||
|
|
<strong>cacert.pem</strong> est la clé publique de votre autorité de certification ;</li>
|
|||
|
|
<li>
|
|||
|
|
<strong>private/cakey.pem</strong> est la clé privée ;</li>
|
|||
|
|
<li>
|
|||
|
|
<strong>index.txt</strong> est le fichier d’index conservant l’association certificat/propriétaire ;</li>
|
|||
|
|
<li>
|
|||
|
|
<strong>index.txt.attr</strong> est le fichier d’option des indexes ;</li>
|
|||
|
|
<li>
|
|||
|
|
<strong>serial</strong> est le numéro du prochain certificat créé ;</li>
|
|||
|
|
<li>
|
|||
|
|
<strong>certs</strong> est le répertoire des certificats signés et de leurs hash associé.</li>
|
|||
|
|
</ul>
|
|||
|
|
|
|||
|
|
<blockquote>
|
|||
|
|
<p><strong>Note sur le répertoire « certs »</strong><br>
|
|||
|
|
Afin de pouvoir vérifier une chaine de certification, on crée dans le répertoire « certs » un lien symbolique pointant vers les certificats signés par la chaine de certification. Ce lien à pour nom « hash.0 » où « hash » est le hachage du « DN » (Dir Name de la forme /C=FR/ST=Ile-De-France/L=Paris/O=Admin Linux/OU=Service Informatique/CN=Marc Dupond/emailAddress=marc.dupond@admin-linux.fr) du certificat.</p>
|
|||
|
|
</blockquote>
|
|||
|
|
|
|||
|
|
<p>Le « hash » du certificat est retourné par :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl x509 -hash -noout -in certif.{pem,crt}
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Dans l’exemple ci dessus nous obtenons :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl x509 -hash -noout -in CertificateAuthority/cacert.pem
|
|||
|
|
ecd697ae
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>et créons donc le lien « /etc/ssl/CertificateAuthority/certs/ecd697ae.0 » pointant vers « /etc/ssl/CertificateAuthority/cacert.pem »</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>ln -s /etc/ssl/CertificateAuthority/cacert.pem /etc/ssl/CertificateAuthority/certs/ecd697ae.0
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<blockquote>
|
|||
|
|
<p><strong>Note sur les informations des certificats</strong><br>
|
|||
|
|
ATTENTION : Par défaut, la signature de plusieurs certificats créés avec EXACTEMENT LES MÊMES PARAMÈTRES de sujet (countryName, stateOrProvinceName, organizationName, organizationalUnitName, commonName, emailAddress) n’est pas autorisé !</p>
|
|||
|
|
</blockquote>
|
|||
|
|
|
|||
|
|
<p>Pour des certificats machine, il est d’usage que le « commonName » désigne le nom de la machine (souvent dans son entier nom.domaine) tandis que pour les utilisateurs ils désigne leurs « Prénom NOM ».</p>
|
|||
|
|
|
|||
|
|
<p>Si toutefois vous devez impérativement créer deux certificats ayant le même sujet (même DN), passez la valeur « unique_subject » à « no » dans le fichier « index.txt.attr » de votre autorité de certification.</p>
|
|||
|
|
|
|||
|
|
<p>Sans cette modification, vous obtiendrez l’erreur suivante au moment de signer le certificat :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Certificate is to be certified until Oct 21 15:36:37 2010 GMT (365 days)
|
|||
|
|
Sign the certificate? [y/n]:y
|
|||
|
|
|
|||
|
|
failed to update database
|
|||
|
|
TXT_DB error number 2
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<h2 id="création-dun-certificat">Création d’un certificat</h2>
|
|||
|
|
|
|||
|
|
<p>Dans le dossier /etc/ssl/CertificateAuthority en mode su</p>
|
|||
|
|
|
|||
|
|
<p>Pour générer une clé SSL utilisable par un service tel qu’Apache, nginx ou autre, deux alternatives (RSA ou ECC)</p>
|
|||
|
|
|
|||
|
|
<p>RSA -générer la clé privée:</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl genrsa -out admin-linux.key 4096
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Generating RSA private key, 4096 bit long modulus
|
|||
|
|
..................... . . . ...........++
|
|||
|
|
..................... . . . .......................++
|
|||
|
|
e is 65537 (0x10001)
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Note : l’option « -des3 », « -aes128 », etc, lors de la génération de la clé privée permet de spécifier un mot de passe pour l’utilisation de la clé. Ce mot de passe sera demandé à chaque démarrage du service.</p>
|
|||
|
|
|
|||
|
|
<p>ECC -générer la clé privée (OpenSSL >= 1.0.1g)</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl ecparam -out admin-linux.key -name prime256v1 -genkey
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>A partir de cette clé, création de la demande de signature qui sera transmise à l’autorité de certification :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl req -key admin-linux.key -new -out admin-linux.csr -days 365 # RSA
|
|||
|
|
openssl req -new -key admin-linux.key -out admin-linux.csr -sha256 # ECC
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>You are about to be asked to enter information that will be incorporated
|
|||
|
|
into your certificate request.
|
|||
|
|
What you are about to enter is what is called a Distinguished Name or a DN.
|
|||
|
|
There are quite a few fields but you can leave some blank
|
|||
|
|
For some fields there will be a default value,
|
|||
|
|
If you enter '.', the field will be left blank.
|
|||
|
|
-----
|
|||
|
|
Country Name (2 letter code) [AU]:FR
|
|||
|
|
State or Province Name (full name) [Some-State]:Pays-De-Loire
|
|||
|
|
Locality Name (eg, city) []:SMM
|
|||
|
|
Organization Name (eg, company) [Internet Widgits Pty Ltd]:yan
|
|||
|
|
Organizational Unit Name (eg, section) []:Dom
|
|||
|
|
Common Name (e.g. server FQDN or YOUR name) []:Yannick M
|
|||
|
|
Email Address []:yannick@cinay.xyz
|
|||
|
|
|
|||
|
|
Please enter the following 'extra' attributes
|
|||
|
|
to be sent with your certificate request
|
|||
|
|
A challenge password []:
|
|||
|
|
An optional company name []:
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Vérifier
|
|||
|
|
ls
|
|||
|
|
admin-linux.csr admin-linux.key</p>
|
|||
|
|
|
|||
|
|
<p>Enfin, génération du certificat proprement dit :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl req -x509 -in admin-linux.csr -key admin-linux.key > admin-linux.crt
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Les informations du certificat peuvent être lues via la commande suivante :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl x509 -text -in admin-linux.crt -noout
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Certificate:
|
|||
|
|
Data:
|
|||
|
|
Version: 3 (0x2)
|
|||
|
|
Serial Number:
|
|||
|
|
19:6e:58:dc:31:00:26:af:a5:3b:80:f0:e9:e2:44:64:5a:1d:6f:10
|
|||
|
|
Signature Algorithm: ecdsa-with-SHA256
|
|||
|
|
Issuer: C = FR, ST = Pays-De-Loire, L = SMM, O = yan, OU = Dom, CN = Yannick M, emailAddress = yannick@cinay.xyz
|
|||
|
|
Validity
|
|||
|
|
Not Before: Jul 3 14:53:56 2019 GMT
|
|||
|
|
Not After : Aug 2 14:53:56 2019 GMT
|
|||
|
|
Subject: C = FR, ST = Pays-De-Loire, L = SMM, O = yan, OU = Dom, CN = Yannick M, emailAddress = yannick@cinay.xyz
|
|||
|
|
Subject Public Key Info:
|
|||
|
|
Public Key Algorithm: id-ecPublicKey
|
|||
|
|
Public-Key: (256 bit)
|
|||
|
|
pub:
|
|||
|
|
04:8a:ba:14:06:d3:5b:62:ad:8e:01:af:ea:1d:f6:
|
|||
|
|
d9:cf:58:33:62:6f:6d:c7:78:e4:53:9f:87:72:7c:
|
|||
|
|
71:dc:cd:77:3b:11:1d:d5:d6:f6:cb:87:ff:3a:f8:
|
|||
|
|
67:7d:cd:13:1d:2d:fd:85:c1:b1:a8:3c:16:a4:5d:
|
|||
|
|
57:81:10:1c:e4
|
|||
|
|
ASN1 OID: prime256v1
|
|||
|
|
NIST CURVE: P-256
|
|||
|
|
X509v3 extensions:
|
|||
|
|
X509v3 Subject Key Identifier:
|
|||
|
|
F2:B6:29:B4:B4:12:D0:78:CC:75:8D:06:78:23:B2:91:FB:31:E9:D8
|
|||
|
|
X509v3 Authority Key Identifier:
|
|||
|
|
keyid:F2:B6:29:B4:B4:12:D0:78:CC:75:8D:06:78:23:B2:91:FB:31:E9:D8
|
|||
|
|
|
|||
|
|
X509v3 Basic Constraints: critical
|
|||
|
|
CA:TRUE
|
|||
|
|
Signature Algorithm: ecdsa-with-SHA256
|
|||
|
|
30:46:02:21:00:e2:77:1c:93:94:30:d4:65:c9:6d:85:02:8e:
|
|||
|
|
bb:e6:a7:bd:d7:78:e2:dd:4d:b6:f9:bb:32:a5:05:e0:0f:67:
|
|||
|
|
1b:02:21:00:83:64:e2:62:bc:3c:99:06:6d:fe:a5:6b:b1:de:
|
|||
|
|
ab:dc:d7:45:3f:62:f4:f8:77:88:d9:f9:06:56:cd:e2:e4:71
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<h2 id="signature-dun-certificat">Signature d’un certificat</h2>
|
|||
|
|
|
|||
|
|
<p>Récapitulons :</p>
|
|||
|
|
|
|||
|
|
<ul>
|
|||
|
|
<li>dans un premier temps, nous avons créé une autorité de certification ;</li>
|
|||
|
|
<li>ensuite, nous avons généré un certificat SSL valide et prêt à être signé.</li>
|
|||
|
|
</ul>
|
|||
|
|
|
|||
|
|
<p>L’objectif est maintenant de signer le certificat avec l’autorité de certification précédemment créé. Pour cela lancer la commande suivante (en remplaçant par vos paramètres les paramètres de l’exemple) :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl ca -policy policy_anything -out admin-linux.crt -infiles admin-linux.csr
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Using configuration from /etc/ssl/openssl.cnf
|
|||
|
|
Enter pass phrase for /etc/ssl/CertificateAuthority/private/cakey.pem:
|
|||
|
|
Check that the request matches the signature
|
|||
|
|
Signature ok
|
|||
|
|
Certificate Details:
|
|||
|
|
Serial Number:
|
|||
|
|
7e:22:56:d6:e6:90:67:7e:0d:b5:80:f0:62:af:4e:20:e3:29:d9:f2
|
|||
|
|
Validity
|
|||
|
|
Not Before: Jul 3 15:01:37 2019 GMT
|
|||
|
|
Not After : Jul 2 15:01:37 2020 GMT
|
|||
|
|
Subject:
|
|||
|
|
countryName = FR
|
|||
|
|
stateOrProvinceName = Pays-De-Loire
|
|||
|
|
localityName = SMM
|
|||
|
|
organizationName = yan
|
|||
|
|
organizationalUnitName = Dom
|
|||
|
|
commonName = Yannick M
|
|||
|
|
emailAddress = yannick@cinay.xyz
|
|||
|
|
X509v3 extensions:
|
|||
|
|
X509v3 Basic Constraints:
|
|||
|
|
CA:FALSE
|
|||
|
|
Netscape Comment:
|
|||
|
|
OpenSSL Generated Certificate
|
|||
|
|
X509v3 Subject Key Identifier:
|
|||
|
|
F2:B6:29:B4:B4:12:D0:78:CC:75:8D:06:78:23:B2:91:FB:31:E9:D8
|
|||
|
|
X509v3 Authority Key Identifier:
|
|||
|
|
keyid:61:D3:36:38:72:51:5C:D7:0F:53:D9:DB:3C:9F:BF:1B:02:F0:1A:73
|
|||
|
|
|
|||
|
|
Certificate is to be certified until Jul 2 15:01:37 2020 GMT (365 days)
|
|||
|
|
Sign the certificate? [y/n]:y
|
|||
|
|
|
|||
|
|
|
|||
|
|
1 out of 1 certificate requests certified, commit? [y/n]y
|
|||
|
|
Write out database with 1 new entries
|
|||
|
|
Data Base Updated
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p><strong>Rappel :</strong> si vous rencontrez à cette étape une erreur du type :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>failed to update database
|
|||
|
|
TXT_DB error number 2
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>C’est probablement que vous tentez de signer un certificat créé avec le même « Subject » (ou DN) qu’un autre. Voir Note sur les informations des certificats pour plus de détails.</p>
|
|||
|
|
|
|||
|
|
<p>OpenSSL demande le mot de passe de l’autorité de certification puis après vérification affiche le détail du certificat à signer. Le système nous avertis alors que le certificat va être validé pour une durée de 365 jours et demande confirmation. Une fois le certificat signé, il est ajouté à la base des certificats gérés par l’autorité de certification.</p>
|
|||
|
|
|
|||
|
|
<p>En jetant un œil aux fichiers d’index du CA, on peut lire le numéro correspondant aux certificats géré :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>cat /etc/ssl/CertificateAuthority/index.txt
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>V 290630140253Z 7E2256D6E690677E0DB580F062AF4E20E329D9F1 unknown /C=FR/ST=Pays-De-Loire/O=yan/OU=dom/CN=YM/emailAddress=admin@cinay.xyz
|
|||
|
|
V 200702150137Z 7E2256D6E690677E0DB580F062AF4E20E329D9F2 unknown /C=FR/ST=Pays-De-Loire/L=SMM/O=yan/OU=Dom/CN=Yannick M/emailAddress=yannick@cinay.xyz
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>et constater que le certificat que nous venons de signer à bien été ajouté à la liste. De même, le numéro de série du prochain certificat à bien été incrémenté :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>cat /etc/ssl/CertificateAuthority/serial
|
|||
|
|
7E2256D6E690677E0DB580F062AF4E20E329D9F3
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<h2 id="diffuser-sa-chaine-dauthentification">Diffuser sa chaine d’authentification</h2>
|
|||
|
|
|
|||
|
|
<p>Tous fonctionne pour le moment pour le mieux, mais lors de la connexion à un site utilisant un certificat auto signé ou signé par une autorité de certification non officielle, un avertissement sera affiché à l’utilisateur.</p>
|
|||
|
|
|
|||
|
|
<p>Cela est dû au fait que votre Autorité de Certification n’est pas connue par les navigateurs Web du marché (à moins que vous ne vous appeliez VeriSign ou quelque chose du genre).</p>
|
|||
|
|
|
|||
|
|
<p>Pour résoudre ce problème, vous pouvez diffuser votre chaîne de certification via un site internet. Copiez, ou vous le souhaitez sur votre site web le certificat « <strong>cacert.pem</strong> » en « <strong>cacert.crt</strong> ».</p>
|
|||
|
|
|
|||
|
|
<h3 id="navigateur">Navigateur</h3>
|
|||
|
|
|
|||
|
|
<p><strong>Firefox</strong><br>
|
|||
|
|
Préférences →Vie privée et sécurité → Certificats → Afficher les certificats<br>
|
|||
|
|
Ongle “Autorités” et Importer</p>
|
|||
|
|
|
|||
|
|
<p><img src="/images/cacrt1.png" alt="" width="600"></p>
|
|||
|
|
|
|||
|
|
<p>Dès que l’autorité de certification est ajoutée, le navigateur internet reconnais le certificat lors de son passage sur vos page. Les détails sur l’autorité de certification sont consultable via la liste des autorité racines comme présenté sur cette capture d’écran réalisée sous firefox 3.X :</p>
|
|||
|
|
|
|||
|
|
<p><img src="/images/cacrt2.png" alt="" width="600"></p>
|
|||
|
|
|
|||
|
|
<p><strong>en ligne de commande</strong> <br>
|
|||
|
|
Les navigateurs Web comme Firefox, Chromium, Google Chrome, Vivaldi et même les clients de messagerie comme Mozilla Thunderbird n’utilisent pas le magasin de confiance du système d’exploitation, mais utilisent leur propre magasin de confiance de certificat. Ces magasins de clés de confiance sont des fichiers du répertoire utilisateur, nommés «cert8.db» et «cert9.db» (pour les versions plus récentes). Vous pouvez modifier les fichiers du magasin de clés certifiées à l’aide de l’outil «certutil».<br>
|
|||
|
|
Pour installer <strong>certutil</strong></p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>sudo apt install libnss3-tools
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Ce petit script d’aide trouve les bases de données du magasin de confiance et importe le nouveau certificat racine dans celles-ci.</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>#!/bin/bash
|
|||
|
|
|
|||
|
|
### Script installs root.cert.pem to certificate trust store of applications using NSS
|
|||
|
|
### (e.g. Firefox, Thunderbird, Chromium)
|
|||
|
|
### Mozilla uses cert8, Chromium and Chrome use cert9
|
|||
|
|
|
|||
|
|
###
|
|||
|
|
### Requirement: apt install libnss3-tools
|
|||
|
|
###
|
|||
|
|
|
|||
|
|
|
|||
|
|
###
|
|||
|
|
### CA file to install (CUSTOMIZE!)
|
|||
|
|
###
|
|||
|
|
|
|||
|
|
certfile="root.cert.pem"
|
|||
|
|
certname="My Root CA"
|
|||
|
|
|
|||
|
|
|
|||
|
|
###
|
|||
|
|
### For cert8 (legacy - DBM)
|
|||
|
|
###
|
|||
|
|
|
|||
|
|
for certDB in $(find ~/ -name "cert8.db")
|
|||
|
|
do
|
|||
|
|
certdir=$(dirname ${certDB});
|
|||
|
|
certutil -A -n "${certname}" -t "TCu,Cu,Tu" -i ${certfile} -d dbm:${certdir}
|
|||
|
|
done
|
|||
|
|
|
|||
|
|
|
|||
|
|
###
|
|||
|
|
### For cert9 (SQL)
|
|||
|
|
###
|
|||
|
|
|
|||
|
|
for certDB in $(find ~/ -name "cert9.db")
|
|||
|
|
do
|
|||
|
|
certdir=$(dirname ${certDB});
|
|||
|
|
certutil -A -n "${certname}" -t "TCu,Cu,Tu" -i ${certfile} -d sql:${certdir}
|
|||
|
|
done
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Après l’exécution de ce script, votre autorité de certification racine doit être connue de Firefox, Chrome, Chromium et d’autres navigateurs.</p>
|
|||
|
|
|
|||
|
|
<h3 id="sur-un-serveur-linux">Sur un serveur Linux</h3>
|
|||
|
|
|
|||
|
|
<p>Dans la plupart des cas, il n’est pas conseillé d’exécuter une propre autorité de certification (autorité de certification) sauf si vous souhaitez sécuriser des services internes et l’utilisation de votre propre autorité de certification peut être nécessaire.<br>
|
|||
|
|
Le certificat racine doit être importé sur tous les serveurs qui utilisent l’accès par certificat client.</p>
|
|||
|
|
|
|||
|
|
<p>Se connecter sur le serveur<br>
|
|||
|
|
Importer le certificat (autorité de certification) extension .pem ou .crt (si .pem le renommer en .crt)<br>
|
|||
|
|
Copier le fichier dans <strong>/usr/local/share/ca-certificates/extra/</strong> (extension .crt obligatoire)</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>sudo mkdir -p /usr/local/share/ca-certificates/extra
|
|||
|
|
sudo mv *.crt /usr/local/share/ca-certificates/extra
|
|||
|
|
sudo update-ca-certificates
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Après ces étapes, la nouvelle autorité de certification est connue des utilitaires “système” comme curl et wget</p>
|
|||
|
|
|
|||
|
|
<h2 id="questions-diverses">Questions diverses</h2>
|
|||
|
|
|
|||
|
|
<h3 id="comment-vérifier-la-signature-dun-certificat-">Comment vérifier la signature d’un certificat ?</h3>
|
|||
|
|
|
|||
|
|
<p>Afin de vérifier la validité du certificat, nous faisons appel à l’option « verify » d’ »openssl » soit en lui précisant le la clé publique de l’autorité de certification :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl verify -CAfile /etc/ssl/CertificateAuthority/cacert.pem /etc/ssl/CertificateAuthority/admin-linux.crt
|
|||
|
|
/etc/ssl/CertificateAuthority/admin-linux.crt: OK
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>ou le répertoire des hash de certificat :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl verify -CApath /etc/ssl/CertificateAuthority/certs /etc/ssl/CertificateAuthority/admin-linux.crt
|
|||
|
|
/etc/ssl/CertificateAuthority/admin-linux.crt: OK
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<h3 id="comment-tester-un-certificat-">Comment tester un certificat ?</h3>
|
|||
|
|
|
|||
|
|
<p>Vous pouvez tester le certificat depuis généré et signé depuis un navigateur web avec l’option « s_server » d’OpenSSL :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>sudo -s
|
|||
|
|
cd /etc/ssl/CertificateAuthority/
|
|||
|
|
cat admin-linux.crt > admin-linux.pem
|
|||
|
|
cat admin-linux.key >> admin-linux.pem
|
|||
|
|
# lancement serveur
|
|||
|
|
openssl s_server -cert admin-linux.pem
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>puis, depuis un navigateur internet, rendez vous sur https://localhost:4433. Vous pouvez alors examiner le certificat qui vous est proposé via votre browser.</p>
|
|||
|
|
|
|||
|
|
<h3 id="comment-sinformer-sur-un-certificat-">Comment s’informer sur un certificat ?</h3>
|
|||
|
|
|
|||
|
|
<p>Les différentes informations concernant un certificat peuvent être retrouvées via ses champs x509. Nous retrouvons ainsi :</p>
|
|||
|
|
|
|||
|
|
<p>ses dates de validité :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl x509 -noout -dates -in /etc/ssl/CertificateAuthority/admin-linux.pem
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>notBefore=Jul 3 15:01:37 2019 GMT
|
|||
|
|
notAfter=Jul 2 15:01:37 2020 GMT
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>son DN (ou sujet) :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl x509 -noout -subject -in /etc/ssl/CertificateAuthority/admin-linux.pem
|
|||
|
|
subject=C = FR, ST = Pays-De-Loire, L = SMM, O = yan, OU = Dom, CN = Yannick M, emailAddress = yannick@cinay.xyz
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>l’autorité de certification l’ayant signé :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl x509 -noout -issuer -in /etc/ssl/CertificateAuthority/admin-linux.pem
|
|||
|
|
issuer=C = FR, ST = Pays-De-Loire, O = yan, OU = dom, CN = YM, emailAddress = admin@cinay.xyz
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<h3 id="comment-télécharger-un-certificat-">Comment télécharger un certificat ?</h3>
|
|||
|
|
|
|||
|
|
<p>Un certificat peut être récupéré via l’option « s_client » d’OpenSSL (comme dans cet exemple sur le webmail de Yahoo) :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>echo | openssl s_client -connect login.yahoo.com:443 2> /dev/null
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>CONNECTED(00000003)
|
|||
|
|
---
|
|||
|
|
Certificate chain
|
|||
|
|
0 s:C = US, ST = California, L = Sunnyvale, O = Oath Inc, CN = *.login.yahoo.com
|
|||
|
|
i:C = US, O = DigiCert Inc, OU = www.digicert.com, CN = DigiCert SHA2 High Assurance Server CA
|
|||
|
|
1 s:C = US, O = DigiCert Inc, OU = www.digicert.com, CN = DigiCert SHA2 High Assurance Server CA
|
|||
|
|
i:C = US, O = DigiCert Inc, OU = www.digicert.com, CN = DigiCert High Assurance EV Root CA
|
|||
|
|
---
|
|||
|
|
Server certificate
|
|||
|
|
-----BEGIN CERTIFICATE-----
|
|||
|
|
ThrsYuChLcs9s3Hc3WpJyeo/ldVl/wgvv9+z44zzCMsaqP45VAphRJfiSY968uwe
|
|||
|
|
akegwmtcSPhrgijsHtGF1xQZFgMLJlTVM+ngbEsIoSg9HbPr7CEuW4EuPmyGedla
|
|||
|
|
n7x5LU5rlsZ0gKwCpj29gZwcWpZLZQfiX3iSG1ua51uEpoVViLwsjqY4xnNDvNxZ
|
|||
|
|
wg==
|
|||
|
|
-----END CERTIFICATE-----
|
|||
|
|
subject=C = US, ST = California, L = Sunnyvale, O = Oath Inc, CN = *.login.yahoo.com
|
|||
|
|
|
|||
|
|
issuer=C = US, O = DigiCert Inc, OU = www.digicert.com, CN = DigiCert SHA2 High Assurance Server CA
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
No client certificate CA names sent
|
|||
|
|
Peer signing digest: SHA512
|
|||
|
|
Peer signature type: RSA
|
|||
|
|
Server Temp Key: ECDH, P-256, 256 bits
|
|||
|
|
---
|
|||
|
|
SSL handshake has read 4507 bytes and written 443 bytes
|
|||
|
|
Verification: OK
|
|||
|
|
---
|
|||
|
|
New, TLSv1.2, Cipher is ECDHE-RSA-AES128-GCM-SHA256
|
|||
|
|
Server public key is 2048 bit
|
|||
|
|
Secure Renegotiation IS supported
|
|||
|
|
Compression: NONE
|
|||
|
|
Expansion: NONE
|
|||
|
|
No ALPN negotiated
|
|||
|
|
SSL-Session:
|
|||
|
|
Protocol : TLSv1.2
|
|||
|
|
Cipher : ECDHE-RSA-AES128-GCM-SHA256
|
|||
|
|
Session-ID: D773AED34239C252885A2BD79BC9898020F8E9CF9BBB9874E3F8A5A9711563E5
|
|||
|
|
Session-ID-ctx:
|
|||
|
|
Master-Key: 6D1DFFA3BF1FA5B4E841AB5971EEB49F938670DB238726B536CC7CEE25C11442F36FCF0B7957A42CF9293026B89701CE
|
|||
|
|
PSK identity: None
|
|||
|
|
PSK identity hint: None
|
|||
|
|
SRP username: None
|
|||
|
|
TLS session ticket lifetime hint: 7200 (seconds)
|
|||
|
|
TLS session ticket:
|
|||
|
|
0000 - 5c e5 c3 c1 05 75 42 25-be c4 83 c0 f5 c7 ae 33 \....uB%.......3
|
|||
|
|
0010 - 69 ef 28 d3 cc 15 56 ab-63 27 82 74 21 f5 ad e5 i.(...V.c'.t!...
|
|||
|
|
0020 - 42 f3 7b 3e 55 7f 2f 90-ca 9b aa 32 16 28 0b 9d B.{>U./....2.(..
|
|||
|
|
0030 - 0f ba 06 95 41 1b 77 52-d9 c8 86 08 46 11 7c db ....A.wR....F.|.
|
|||
|
|
0040 - 5c c5 14 c3 5f 8c b0 98-3b 03 b3 ea 47 af 94 31 \..._...;...G..1
|
|||
|
|
0050 - b3 02 91 a7 09 72 7e 0d-a3 18 65 76 17 ca 30 d9 .....r~...ev..0.
|
|||
|
|
0060 - e8 c6 69 aa 90 d1 08 25-be 41 97 15 84 9c b2 d4 ..i....%.A......
|
|||
|
|
0070 - fd 19 2f 27 f0 b0 6d 30-37 71 9e 1b 0d 74 07 95 ../'..m07q...t..
|
|||
|
|
0080 - 2b 22 cf 84 58 19 d7 1c-e4 7d 41 6c c0 5e 30 95 +"..X....}Al.^0.
|
|||
|
|
0090 - 50 2c 9e e5 34 eb 6a 28-83 4c 64 4c ee 09 13 6d P,..4.j(.LdL...m
|
|||
|
|
00a0 - d5 17 fe 95 43 a3 01 57-eb a7 2a 3c 62 86 a6 f7 ....C..W..*<b...
|
|||
|
|
00b0 - f8 c8 9f ef 8f 73 23 98-bc d2 0a 6f 55 3a 16 8b .....s#....oU:..
|
|||
|
|
00c0 - 88 1c 0c 95 5a cb 7a 96-7a 13 b3 b5 bb cf 44 69 ....Z.z.z.....Di
|
|||
|
|
|
|||
|
|
Start Time: 1562167944
|
|||
|
|
Timeout : 7200 (sec)
|
|||
|
|
Verify return code: 0 (ok)
|
|||
|
|
Extended master secret: no
|
|||
|
|
---
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>ou, juste pour obtenir le certificat :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>echo | openssl s_client -connect login.yahoo.com:443 2> /dev/null |sed -ne '/-BEGIN CERTIFICATE-/,/-END CERTIFICATE-/p' > login.yahoo.com.crt
|
|||
|
|
openssl x509 -noout -dates -in login.yahoo.com.crt
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>notBefore=Apr 25 00:00:00 2019 GMT
|
|||
|
|
notAfter=Oct 22 12:00:00 2019 GMT
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<h3 id="comment-révoquer-un-certificat-">Comment révoquer un certificat ?</h3>
|
|||
|
|
|
|||
|
|
<p>Dans la configuration par défaut, openssl conservera des copies de tous les certificats signés dans <strong>/etc/ssl/CertificateAuthority/newcerts</strong>, nommés par leur numéro d’index. Donc visualiser le fichier <strong>/etc/ssl/CertificateAuthority/index.txt</strong> pour obtenir le numéro de série de la clé à révoquer</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>cat /etc/ssl/CertificateAuthority/index.txt
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>V 210316172023Z 6630E893DDE59EF7314A76C8E9BD19BA2CC3F610 unknown /C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=CA_UN
|
|||
|
|
V 210316172558Z 6630E893DDE59EF7314A76C8E9BD19BA2CC3F611 unknown /C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=CA_DEUX
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>par exemple F610, puis exécuter la commande suivante :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl ca -revoke /etc/ssl/CertificateAuthority/newcerts/6630E893DDE59EF7314A76C8E9BD19BA2CC3F610.pem
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>Using configuration from /usr/lib/ssl/openssl.cnf
|
|||
|
|
Enter pass phrase for /etc/ssl/CertificateAuthority/private/cakey.pem: # Mot de passe à saisir
|
|||
|
|
Revoking Certificate 6630E893DDE59EF7314A76C8E9BD19BA2CC3F610.
|
|||
|
|
Data Base Updated
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Dans le fichier <strong>/etc/ssl/CertificateAuthority/index.txt</strong> , la ligne débute par un R (revoked)</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>R 210316172023Z 6630E893DDE59EF7314A76C8E9BD19BA2CC3F610 unknown /C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=CA_UN
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<blockquote>
|
|||
|
|
<p>Les fichiers -keyfile et -cert mentionnés dans la <a href="https://stackoverflow.com/a/9517132/321973">réponse de Nilesh</a> ne sont requis que si cela diffère de vos paramètres openssl.cnf.</p>
|
|||
|
|
</blockquote>
|
|||
|
|
|
|||
|
|
<h1 id="authentification-par-certificat-client">Authentification par certificat client</h1>
|
|||
|
|
|
|||
|
|
<h3 id="quest-ce-quun-certificat-client">Qu’est-ce qu’un certificat client?</h3>
|
|||
|
|
|
|||
|
|
<p>Un certificat côté client est un mécanisme d’authentification de la couche de transport. il peut être utilisé pour vérifier un utilisateur avant la couche d’application. En termes d’application Web, cela se produit au niveau du «S» de «HTTPS»: le client est authentifié lors de l’établissement de la négociation TLS, et non au niveau de la couche HTTP tunnelée via la connexion sécurisée.</p>
|
|||
|
|
|
|||
|
|
<p>L’ article de <a href="https://en.wikipedia.org/wiki/Transport_Layer_Security#Client-authenticated_TLS_handshake">Wikipedia sur TLS</a> l’ explique mieux que jamais. Mais la chose importante à comprendre est que, si elle est correctement effectuée, votre application peut supposer que les informations qu’elle reçoit proviennent d’une personne déjà authentifiée. Dans mon cas, l’application ne s’intéresse pas à cela: nous l’utilisons simplement pour nous assurer que seuls les périphériques que j’autorise peuvent accéder à l’application.</p>
|
|||
|
|
|
|||
|
|
<p>Pour cette raison, cet article ne couvre que la partie «l’appareil peut accéder à l’application ou site»; L’utilisation de cette méthode pour effectuer une authentification complète peut être traitée dans un article ultérieur.</p>
|
|||
|
|
|
|||
|
|
<h2 id="opérations-à-réaliser-sur-un-serveur-linux">Opérations à réaliser sur un serveur linux</h2>
|
|||
|
|
|
|||
|
|
<h3 id="création-de-lautorité-de-certification">Création de l’autorité de certification</h3>
|
|||
|
|
|
|||
|
|
<p>Tout d’abord, vous devez créer une clé pour votre autorité de certification (CA); cette clé sera utilisée pour créer le certificat côté serveur et signera toutes les demandes de certificat client. C’est-à-dire: c’est le «mot de passe» principal pour tout le système. Générez-en un et protégez-le.</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl genrsa -des3 -out ca.key 4096
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Vous serez invité à chiffrer la clé avec une phrase secrète. N’oubliez pas de le noter, car on vous le demandera chaque fois que vous créez un nouveau certificat ou signez une demande de certificat client.</p>
|
|||
|
|
|
|||
|
|
<h3 id="créer-un-certificat-de-ca">Créer un certificat de CA</h3>
|
|||
|
|
|
|||
|
|
<p>Créez ensuite un certificat de CA. c’est le certificat côté serveur qui sera envoyé via le serveur TLS au client. Notez que ce certificat est spécifique aux certificats côté client et ne remplace pas votre certificat typique nécessaire à l’authentification HTTPS. nous y reviendrons plus tard.</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code># sign a certificate for 365 days; replace that number with whatever's
|
|||
|
|
# suitable for your application
|
|||
|
|
openssl req -new -x509 -days 365 -key ca.key -out ca.crt
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>On vous posera un certain nombre de questions. voici ce que j’ai trouvé:</p>
|
|||
|
|
|
|||
|
|
<ul>
|
|||
|
|
<li>Notez ce que vous avez entré pour Pays, État, Localité et Organisation; vous souhaiterez que ces éléments correspondent ultérieurement lorsque vous renouvelez le certificat.</li>
|
|||
|
|
<li>N’entrez pas de nom commun (CN) pour le certificat; Je ne sais pas pourquoi, mais j’ai eu des problèmes quand je suis entré dans un.</li>
|
|||
|
|
<li>Le courrier électronique peut être omis.</li>
|
|||
|
|
</ul>
|
|||
|
|
|
|||
|
|
<p>Le renouvellement d’un certificat nécessite simplement d’exécuter la même commande. générer un nouveau certificat. Si vous avez besoin de voir ce que vous avez entré dans l’ancien certificat, vous pouvez exécuter:</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl x509 -in ca.crt -noout -text
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Ceci listera toutes les informations sur le certificat, y compris les valeurs mentionnées ci-dessus.</p>
|
|||
|
|
|
|||
|
|
<h3 id="création-dun-certificat-client">Création d’un certificat client</h3>
|
|||
|
|
|
|||
|
|
<p>Ensuite, un certificat client sera créé. c’est à vous de décider comment vous souhaitez les gérer, mais souvenez-vous qu’il s’agit en réalité d’un mot de passe. Si vous souhaitez le «modifier», vous devez révoquer le certificat. Alors, réfléchissez à la manière dont vous souhaitez gérer votre authentification: par utilisateur, par périphérique?</p>
|
|||
|
|
|
|||
|
|
<p>Vous voudrez d’abord une clé client; ceci est généré de la même manière que la clé de certificat; vous pouvez même utiliser celui-là (mais pas). En règle générale, si vous avez plusieurs utilisateurs, les deux étapes suivantes sont celles que vous leur demandez de faire: créer une demande de signature de certificat pour vous signer.</p>
|
|||
|
|
|
|||
|
|
<h3 id="utilisateurs-créer-une-clé-et-une-demande-de-signature-de-certificat">Utilisateurs: créer une clé et une demande de signature de certificat</h3>
|
|||
|
|
|
|||
|
|
<p>Créez une clé RSA, si vous n’en avez pas déjà une:</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl genrsa -des3 -out user.key 4096
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Ensuite, créez une demande de signature de certificat (CSR)</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl req -new -key user.key -out user.csr
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Un certain nombre de questions seront posées. répondez à chacune d’elles, y compris le nom usuel et l’adresse électronique. Le CSR créé sera envoyé à l’autorité de certification (un administrateur, mais dans ce cas probablement aussi vous-même) pour signature.</p>
|
|||
|
|
|
|||
|
|
<h3 id="signer-un-csr">Signer un CSR</h3>
|
|||
|
|
|
|||
|
|
<p>Un CSR doit maintenant être signé par le CA; c’est ce que dit le CA: “Je connais cette personne ou cet appareil: ils sont ce qu’ils prétendent être.”</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code># sign the csr to a certificate valid for 365 days
|
|||
|
|
openssl x509 -req -days 365 -in user.csr -CA ca.crt -CAkey ca.key -set_serial 01 -out user.crt
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Vous voudrez généralement incrémenter le numéro de série à chaque signature. Une fois le certificat expiré, il n’est pas nécessaire de recréer un nouveau CSR. le même peut être signé, ce qui créera un nouveau certificat lié à cette clé publique.</p>
|
|||
|
|
|
|||
|
|
<p>Le certificat signé serait renvoyé à l’utilisateur avec le certificat de l’autorité de certification (pas la clé privée!), Pour installation sur leur appareil.</p>
|
|||
|
|
|
|||
|
|
<h3 id="création-dun-pkcs-12-pfx">Création d’un PKCS #12 (PFX)</h3>
|
|||
|
|
|
|||
|
|
<p>Maintenant, le certificat signé doit pouvoir être installé sur un périphérique de manière à regrouper les clés client et le certificat. L’archive résultante est en réalité un mot de passe, elle doit donc être gardée aussi sûre que les autres clés privées.</p>
|
|||
|
|
|
|||
|
|
<p>Pour créer le pfx:</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>openssl pkcs12 -export -out user.pfx -inkey user.key -in user.crt -certfile ca.crt
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Il vous sera demandé de fournir un «mot de passe d’exportation». Il est fortement recommandé de le définir, car vous devrez souvent transférer l’archive PFX sur un périphérique tel que votre téléphone. vous ne voulez pas que cette séance dans votre email sans un mot de passe.</p>
|
|||
|
|
|
|||
|
|
<p>L’archive PFX peut maintenant être importée dans votre navigateur Web. C’est plutôt chouette! Vous pouvez voir comment un processus comme celui-ci peut être utilisé pour prouver l’identité et créer un accès valide pour un utilisateur, sans que l’administrateur (CA) ou l’utilisateur ne révèle sa clé privée à un autre.</p>
|
|||
|
|
|
|||
|
|
<p>Voyons maintenant comment configurer nginx pour l’authentification de certificat, avec un proxy inverse pour notre application non authentifiée.</p>
|
|||
|
|
|
|||
|
|
<h2 id="nginx---accès-par-certificat-client">nginx - accès par certificat client</h2>
|
|||
|
|
|
|||
|
|
<p><a href="https://geekeries.org/2019/06/authentification-par-certificat-client-sur-nginx/">Authentification par certificat client sur nginx</a></p>
|
|||
|
|
|
|||
|
|
<h3 id="limiter-laccès-par-certificat-à-certains-utilisateurs">Limiter l’accès par certificat à certains utilisateurs</h3>
|
|||
|
|
|
|||
|
|
<p>Un nginx.conf minimal pour accès par certificat client</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>user www-data;
|
|||
|
|
worker_processes auto;
|
|||
|
|
pid /run/nginx.pid;
|
|||
|
|
include /etc/nginx/modules-enabled/*.conf;
|
|||
|
|
|
|||
|
|
events {
|
|||
|
|
worker_connections 768;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
http {
|
|||
|
|
server_names_hash_bucket_size 64;
|
|||
|
|
|
|||
|
|
##
|
|||
|
|
# Basic Settings
|
|||
|
|
##
|
|||
|
|
|
|||
|
|
sendfile on;
|
|||
|
|
tcp_nopush on;
|
|||
|
|
tcp_nodelay on;
|
|||
|
|
keepalive_timeout 65;
|
|||
|
|
types_hash_max_size 2048;
|
|||
|
|
# server_tokens off;
|
|||
|
|
|
|||
|
|
include /etc/nginx/mime.types;
|
|||
|
|
default_type application/octet-stream;
|
|||
|
|
|
|||
|
|
|
|||
|
|
##
|
|||
|
|
# Logging Settings
|
|||
|
|
##
|
|||
|
|
|
|||
|
|
access_log /var/log/nginx/access.log;
|
|||
|
|
error_log /var/log/nginx/error.log;
|
|||
|
|
|
|||
|
|
##
|
|||
|
|
# Gzip Settings
|
|||
|
|
##
|
|||
|
|
|
|||
|
|
gzip on;
|
|||
|
|
gzip_disable "msie6";
|
|||
|
|
|
|||
|
|
##
|
|||
|
|
# Authentification par certificat client
|
|||
|
|
# limité à certains utilisateurs
|
|||
|
|
##
|
|||
|
|
|
|||
|
|
map $ssl_client_s_dn $ssl_access {
|
|||
|
|
default 0;
|
|||
|
|
"~CN=Utilisateur A" 1;
|
|||
|
|
"~CN=Utilisateur B" 1;
|
|||
|
|
"~CN=Jean Dupondt Stagiaire" 1;
|
|||
|
|
# etc.
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
##
|
|||
|
|
# Virtual Host Configs
|
|||
|
|
##
|
|||
|
|
|
|||
|
|
include /etc/nginx/conf.d/*.conf;
|
|||
|
|
}
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Ajouter dans les fichiers de configuration des “Virtual Hosts” concernés</p>
|
|||
|
|
|
|||
|
|
<p>Modifier le chemin du fichier de l’autorité de certification <code class="language-plaintext highlighter-rouge">ssl_client_certificate /etc/ssl/CertificateAuthority/cacert.pem;</code> si besoin</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code># Certificat client
|
|||
|
|
ssl_client_certificate /etc/ssl/CertificateAuthority/cacert.pem;
|
|||
|
|
# rendre la vérification optionnelle
|
|||
|
|
# afin de pouvoir afficher un message 403
|
|||
|
|
# à ceux qui échouent à l'authentification
|
|||
|
|
ssl_verify_client optional;
|
|||
|
|
if ( $ssl_access = 0 ) {
|
|||
|
|
return 403 "<h2>Zone Interdite, absence de certificat client !!!</h2>" ; # => forbidden
|
|||
|
|
}
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Désormais, lorsque vous visiterez le serveur nginx, votre navigateur sera invité à fournir son certificat client. sélectionnez le certificat que vous avez installé et vous devriez être mandaté par le serveur en amont. Si vous visitez un navigateur sans certificat client installé, vous devriez voir un 403 sans aucune sorte d’invite.</p>
|
|||
|
|
|
|||
|
|
<h3 id="gérer-des-accès-par-zones">Gérer des accès par zones</h3>
|
|||
|
|
|
|||
|
|
<p>Dans la solution au dessus, on a un mode on/off. Mais dans le cas ou l’on souhaite gérer des accès sur plusieurs zones, cette solution est limité. Une bonne option trouvée sur StackOverFlow de gérer des accès par zone par certificat :</p>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>map $ssl_client_s_dn $ssl_access {
|
|||
|
|
default "";
|
|||
|
|
"~CN=Paul BISMUTH Entreprise" -a-b-c-;
|
|||
|
|
"~CN=Jean Dupondt Stagiaire" -b-e-;
|
|||
|
|
# etc.
|
|||
|
|
}
|
|||
|
|
server {
|
|||
|
|
[...]
|
|||
|
|
location /admin/ {
|
|||
|
|
if ($ssl_access !~ -a-) {
|
|||
|
|
return 403;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
[...]
|
|||
|
|
location /interns {
|
|||
|
|
if ($ssl_access !~ -b-) {
|
|||
|
|
return 403;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
[...]
|
|||
|
|
}
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
<p>Dans l’exemple, la zone « a » du site est accessible par les admins, la zone b par les stagiaires et les admins.</p>
|
|||
|
|
|
|||
|
|
<h2 id="création-certificat-client-procédure-complète">Création certificat client (procédure complète)</h2>
|
|||
|
|
|
|||
|
|
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>sudo -s
|
|||
|
|
cd /etc/ssl/CertificateAuthority/
|
|||
|
|
openssl ecparam -out yannick.key -name prime256v1 -genkey
|
|||
|
|
openssl req -new -key yannick.key -out yannick.csr -sha256 # Renseigner Common Name obligatoirement
|
|||
|
|
openssl req -x509 -in yannick.csr -key yannick.key > admin-linux.crt
|
|||
|
|
openssl ca -policy policy_anything -out yannick.crt -infiles yannick.csr # signature , mp cakey.pem
|
|||
|
|
openssl pkcs12 -export -out yannick.pfx -inkey yannick.key -in yannick.crt -certfile cacert.pem # mp yannick
|
|||
|
|
cp yannick.pfx /srv/nfs/
|
|||
|
|
chmod 775 /srv/nfs/yannick.pfx
|
|||
|
|
</code></pre></div></div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<div class="d-print-none">
|
|||
|
|
<footer class="article__footer"><meta itemprop="dateModified" content="2019-07-10T00:00:00+02:00">
|
|||
|
|
<!-- start custom article footer snippet -->
|
|||
|
|
|
|||
|
|
<!-- end custom article footer snippet -->
|
|||
|
|
<!--
|
|||
|
|
<div align="right"><a type="application/rss+xml" href="/feed.xml" title="S'abonner"><i class="fa fa-rss fa-2x"></i></a>
|
|||
|
|
|
|||
|
|
 </div>
|
|||
|
|
-->
|
|||
|
|
</footer>
|
|||
|
|
<div class="article__section-navigator clearfix">
|
|||
|
|
<div class="previous">
|
|||
|
|
<span>PRÉCÉDENT</span><a href="/2019/07/06/QGIS-logiciel-SIG(SystemeInformationGeographique).html">QGIS sur Archlinux</a>
|
|||
|
|
</div>
|
|||
|
|
<div class="next">
|
|||
|
|
<span>SUIVANT</span><a href="/2019/07/10/OVH-vps626865-SSD1-KVM-OpenStack(yanspm.com).html">OVH VPS SSD 1 KVM OpenStack (1 vCore/2GoRam/20GoSSD) domaine yanspm.com</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<script>(function() {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
$(function() {
|
|||
|
|
var $this ,$scroll;
|
|||
|
|
var $articleContent = $('.js-article-content');
|
|||
|
|
var hasSidebar = $('.js-page-root').hasClass('layout--page--sidebar');
|
|||
|
|
var scroll = hasSidebar ? '.js-page-main' : 'html, body';
|
|||
|
|
$scroll = $(scroll);
|
|||
|
|
|
|||
|
|
$articleContent.find('.highlight').each(function() {
|
|||
|
|
$this = $(this);
|
|||
|
|
$this.attr('data-lang', $this.find('code').attr('data-lang'));
|
|||
|
|
});
|
|||
|
|
$articleContent.find('h1[id], h2[id], h3[id], h4[id], h5[id], h6[id]').each(function() {
|
|||
|
|
$this = $(this);
|
|||
|
|
$this.append($('<a class="anchor d-print-none" aria-hidden="true"></a>').html('<i class="fas fa-anchor"></i>'));
|
|||
|
|
});
|
|||
|
|
$articleContent.on('click', '.anchor', function() {
|
|||
|
|
$scroll.scrollToAnchor('#' + $(this).parent().attr('id'), 400);
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<section class="page__comments d-print-none"></section></article><!-- start custom main bottom snippet -->
|
|||
|
|
<!-- end custom main bottom snippet -->
|
|||
|
|
</div>
|
|||
|
|
</div></div></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<script>(function() {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
var $body = $('body'), $window = $(window);
|
|||
|
|
var $pageRoot = $('.js-page-root'), $pageMain = $('.js-page-main');
|
|||
|
|
var activeCount = 0;
|
|||
|
|
function modal(options) {
|
|||
|
|
var $root = this, visible, onChange, hideWhenWindowScroll = false;
|
|||
|
|
var scrollTop;
|
|||
|
|
function setOptions(options) {
|
|||
|
|
var _options = options || {};
|
|||
|
|
visible = _options.initialVisible === undefined ? false : show;
|
|||
|
|
onChange = _options.onChange;
|
|||
|
|
hideWhenWindowScroll = _options.hideWhenWindowScroll;
|
|||
|
|
}
|
|||
|
|
function init() {
|
|||
|
|
setState(visible);
|
|||
|
|
}
|
|||
|
|
function setState(isShow) {
|
|||
|
|
if (isShow === visible) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
visible = isShow;
|
|||
|
|
if (visible) {
|
|||
|
|
activeCount++;
|
|||
|
|
scrollTop = $(window).scrollTop() || $pageMain.scrollTop();
|
|||
|
|
$root.addClass('modal--show');
|
|||
|
|
$pageMain.scrollTop(scrollTop);
|
|||
|
|
activeCount === 1 && ($pageRoot.addClass('show-modal'), $body.addClass('of-hidden'));
|
|||
|
|
hideWhenWindowScroll && window.hasEvent('touchstart') && $window.on('scroll', hide);
|
|||
|
|
$window.on('keyup', handleKeyup);
|
|||
|
|
} else {
|
|||
|
|
activeCount > 0 && activeCount--;
|
|||
|
|
$root.removeClass('modal--show');
|
|||
|
|
$window.scrollTop(scrollTop);
|
|||
|
|
activeCount === 0 && ($pageRoot.removeClass('show-modal'), $body.removeClass('of-hidden'));
|
|||
|
|
hideWhenWindowScroll && window.hasEvent('touchstart') && $window.off('scroll', hide);
|
|||
|
|
$window.off('keyup', handleKeyup);
|
|||
|
|
}
|
|||
|
|
onChange && onChange(visible);
|
|||
|
|
}
|
|||
|
|
function show() {
|
|||
|
|
setState(true);
|
|||
|
|
}
|
|||
|
|
function hide() {
|
|||
|
|
setState(false);
|
|||
|
|
}
|
|||
|
|
function handleKeyup(e) {
|
|||
|
|
// Char Code: 27 ESC
|
|||
|
|
if (e.which === 27) {
|
|||
|
|
hide();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
setOptions(options);
|
|||
|
|
init();
|
|||
|
|
return {
|
|||
|
|
show: show,
|
|||
|
|
hide: hide,
|
|||
|
|
$el: $root
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
$.fn.modal = modal;
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
</script><div class="modal modal--overflow page__search-modal d-print-none js-page-search-modal">
|
|||
|
|
<script>
|
|||
|
|
(function () {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
// search panel
|
|||
|
|
var search = (window.search || (window.search = {}));
|
|||
|
|
var useDefaultSearchBox = window.useDefaultSearchBox === undefined ?
|
|||
|
|
true : window.useDefaultSearchBox ;
|
|||
|
|
|
|||
|
|
var $searchModal = $('.js-page-search-modal');
|
|||
|
|
var $searchToggle = $('.js-search-toggle');
|
|||
|
|
var searchModal = $searchModal.modal({ onChange: handleModalChange, hideWhenWindowScroll: true });
|
|||
|
|
var modalVisible = false;
|
|||
|
|
search.searchModal = searchModal;
|
|||
|
|
|
|||
|
|
var $searchBox = null;
|
|||
|
|
var $searchInput = null;
|
|||
|
|
var $searchClear = null;
|
|||
|
|
|
|||
|
|
function getModalVisible() {
|
|||
|
|
return modalVisible;
|
|||
|
|
}
|
|||
|
|
search.getModalVisible = getModalVisible;
|
|||
|
|
|
|||
|
|
function handleModalChange(visible) {
|
|||
|
|
modalVisible = visible;
|
|||
|
|
if (visible) {
|
|||
|
|
search.onShow && search.onShow();
|
|||
|
|
useDefaultSearchBox && $searchInput[0] && $searchInput[0].focus();
|
|||
|
|
} else {
|
|||
|
|
search.onShow && search.onHide();
|
|||
|
|
useDefaultSearchBox && $searchInput[0] && $searchInput[0].blur();
|
|||
|
|
setTimeout(function() {
|
|||
|
|
useDefaultSearchBox && ($searchInput.val(''), $searchBox.removeClass('not-empty'));
|
|||
|
|
search.clear && search.clear();
|
|||
|
|
window.pageAsideAffix && window.pageAsideAffix.refresh();
|
|||
|
|
}, 400);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
$searchToggle.on('click', function() {
|
|||
|
|
modalVisible ? searchModal.hide() : searchModal.show();
|
|||
|
|
});
|
|||
|
|
// Char Code: 83 S, 191 /
|
|||
|
|
$(window).on('keyup', function(e) {
|
|||
|
|
if (!modalVisible && !window.isFormElement(e.target || e.srcElement) && (e.which === 83 || e.which === 191)) {
|
|||
|
|
modalVisible || searchModal.show();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
if (useDefaultSearchBox) {
|
|||
|
|
$searchBox = $('.js-search-box');
|
|||
|
|
$searchInput = $searchBox.children('input');
|
|||
|
|
$searchClear = $searchBox.children('.js-icon-clear');
|
|||
|
|
search.getSearchInput = function() {
|
|||
|
|
return $searchInput.get(0);
|
|||
|
|
};
|
|||
|
|
search.getVal = function() {
|
|||
|
|
return $searchInput.val();
|
|||
|
|
};
|
|||
|
|
search.setVal = function(val) {
|
|||
|
|
$searchInput.val(val);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$searchInput.on('focus', function() {
|
|||
|
|
$(this).addClass('focus');
|
|||
|
|
});
|
|||
|
|
$searchInput.on('blur', function() {
|
|||
|
|
$(this).removeClass('focus');
|
|||
|
|
});
|
|||
|
|
$searchInput.on('input', window.throttle(function() {
|
|||
|
|
var val = $(this).val();
|
|||
|
|
if (val === '' || typeof val !== 'string') {
|
|||
|
|
search.clear && search.clear();
|
|||
|
|
} else {
|
|||
|
|
$searchBox.addClass('not-empty');
|
|||
|
|
search.onInputNotEmpty && search.onInputNotEmpty(val);
|
|||
|
|
}
|
|||
|
|
}, 400));
|
|||
|
|
$searchClear.on('click', function() {
|
|||
|
|
$searchInput.val(''); $searchBox.removeClass('not-empty');
|
|||
|
|
search.clear && search.clear();
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
</script><div class="search search--dark">
|
|||
|
|
<div class="main">
|
|||
|
|
<div class="search__header">Recherche</div>
|
|||
|
|
<div class="search-bar">
|
|||
|
|
<div class="search-box js-search-box">
|
|||
|
|
<div class="search-box__icon-search"><i class="fas fa-search"></i></div>
|
|||
|
|
<input id="search-input" type="text">
|
|||
|
|
<div class="search-box__icon-clear js-icon-clear">
|
|||
|
|
<a><i class="fas fa-times"></i></a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<button class="button button--theme-dark button--pill search__cancel js-search-toggle">
|
|||
|
|
Annuler</button>
|
|||
|
|
</div>
|
|||
|
|
<div id="results-container" class="search-result js-search-result"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- Script pointing to search-script.js -->
|
|||
|
|
<script>/*!
|
|||
|
|
* Simple-Jekyll-Search
|
|||
|
|
* Copyright 2015-2020, Christian Fei
|
|||
|
|
* Licensed under the MIT License.
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
(function(){
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$Templater_7 = {
|
|||
|
|
compile: compile,
|
|||
|
|
setOptions: setOptions
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const options = {}
|
|||
|
|
options.pattern = /\{(.*?)\}/g
|
|||
|
|
options.template = ''
|
|||
|
|
options.middleware = function () {}
|
|||
|
|
|
|||
|
|
function setOptions (_options) {
|
|||
|
|
options.pattern = _options.pattern || options.pattern
|
|||
|
|
options.template = _options.template || options.template
|
|||
|
|
if (typeof _options.middleware === 'function') {
|
|||
|
|
options.middleware = _options.middleware
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function compile (data) {
|
|||
|
|
return options.template.replace(options.pattern, function (match, prop) {
|
|||
|
|
const value = options.middleware(prop, data[prop], options.template)
|
|||
|
|
if (typeof value !== 'undefined') {
|
|||
|
|
return value
|
|||
|
|
}
|
|||
|
|
return data[prop] || match
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict';
|
|||
|
|
|
|||
|
|
function fuzzysearch (needle, haystack) {
|
|||
|
|
var tlen = haystack.length;
|
|||
|
|
var qlen = needle.length;
|
|||
|
|
if (qlen > tlen) {
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
if (qlen === tlen) {
|
|||
|
|
return needle === haystack;
|
|||
|
|
}
|
|||
|
|
outer: for (var i = 0, j = 0; i < qlen; i++) {
|
|||
|
|
var nch = needle.charCodeAt(i);
|
|||
|
|
while (j < tlen) {
|
|||
|
|
if (haystack.charCodeAt(j++) === nch) {
|
|||
|
|
continue outer;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
return true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var _$fuzzysearch_1 = fuzzysearch;
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
/* removed: const _$fuzzysearch_1 = require('fuzzysearch') */;
|
|||
|
|
|
|||
|
|
var _$FuzzySearchStrategy_5 = new FuzzySearchStrategy()
|
|||
|
|
|
|||
|
|
function FuzzySearchStrategy () {
|
|||
|
|
this.matches = function (string, crit) {
|
|||
|
|
return _$fuzzysearch_1(crit.toLowerCase(), string.toLowerCase())
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$LiteralSearchStrategy_6 = new LiteralSearchStrategy()
|
|||
|
|
|
|||
|
|
function LiteralSearchStrategy () {
|
|||
|
|
this.matches = function (str, crit) {
|
|||
|
|
if (!str) return false
|
|||
|
|
|
|||
|
|
str = str.trim().toLowerCase()
|
|||
|
|
crit = crit.trim().toLowerCase()
|
|||
|
|
|
|||
|
|
return crit.split(' ').filter(function (word) {
|
|||
|
|
return str.indexOf(word) >= 0
|
|||
|
|
}).length === crit.split(' ').length
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$Repository_4 = {
|
|||
|
|
put: put,
|
|||
|
|
clear: clear,
|
|||
|
|
search: search,
|
|||
|
|
setOptions: __setOptions_4
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* removed: const _$FuzzySearchStrategy_5 = require('./SearchStrategies/FuzzySearchStrategy') */;
|
|||
|
|
/* removed: const _$LiteralSearchStrategy_6 = require('./SearchStrategies/LiteralSearchStrategy') */;
|
|||
|
|
|
|||
|
|
function NoSort () {
|
|||
|
|
return 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const data = []
|
|||
|
|
let opt = {}
|
|||
|
|
|
|||
|
|
opt.fuzzy = false
|
|||
|
|
opt.limit = 10
|
|||
|
|
opt.searchStrategy = opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6
|
|||
|
|
opt.sort = NoSort
|
|||
|
|
opt.exclude = []
|
|||
|
|
|
|||
|
|
function put (data) {
|
|||
|
|
if (isObject(data)) {
|
|||
|
|
return addObject(data)
|
|||
|
|
}
|
|||
|
|
if (isArray(data)) {
|
|||
|
|
return addArray(data)
|
|||
|
|
}
|
|||
|
|
return undefined
|
|||
|
|
}
|
|||
|
|
function clear () {
|
|||
|
|
data.length = 0
|
|||
|
|
return data
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isObject (obj) {
|
|||
|
|
return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Object]'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isArray (obj) {
|
|||
|
|
return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Array]'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function addObject (_data) {
|
|||
|
|
data.push(_data)
|
|||
|
|
return data
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function addArray (_data) {
|
|||
|
|
const added = []
|
|||
|
|
clear()
|
|||
|
|
for (let i = 0, len = _data.length; i < len; i++) {
|
|||
|
|
if (isObject(_data[i])) {
|
|||
|
|
added.push(addObject(_data[i]))
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return added
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function search (crit) {
|
|||
|
|
if (!crit) {
|
|||
|
|
return []
|
|||
|
|
}
|
|||
|
|
return findMatches(data, crit, opt.searchStrategy, opt).sort(opt.sort)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function __setOptions_4 (_opt) {
|
|||
|
|
opt = _opt || {}
|
|||
|
|
|
|||
|
|
opt.fuzzy = _opt.fuzzy || false
|
|||
|
|
opt.limit = _opt.limit || 10
|
|||
|
|
opt.searchStrategy = _opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6
|
|||
|
|
opt.sort = _opt.sort || NoSort
|
|||
|
|
opt.exclude = _opt.exclude || []
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function findMatches (data, crit, strategy, opt) {
|
|||
|
|
const matches = []
|
|||
|
|
for (let i = 0; i < data.length && matches.length < opt.limit; i++) {
|
|||
|
|
const match = findMatchesInObject(data[i], crit, strategy, opt)
|
|||
|
|
if (match) {
|
|||
|
|
matches.push(match)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return matches
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function findMatchesInObject (obj, crit, strategy, opt) {
|
|||
|
|
for (const key in obj) {
|
|||
|
|
if (!isExcluded(obj[key], opt.exclude) && strategy.matches(obj[key], crit)) {
|
|||
|
|
return obj
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isExcluded (term, excludedTerms) {
|
|||
|
|
for (let i = 0, len = excludedTerms.length; i < len; i++) {
|
|||
|
|
const excludedTerm = excludedTerms[i]
|
|||
|
|
if (new RegExp(excludedTerm).test(term)) {
|
|||
|
|
return true
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* globals ActiveXObject:false */
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$JSONLoader_2 = {
|
|||
|
|
load: load
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function load (location, callback) {
|
|||
|
|
const xhr = getXHR()
|
|||
|
|
xhr.open('GET', location, true)
|
|||
|
|
xhr.onreadystatechange = createStateChangeListener(xhr, callback)
|
|||
|
|
xhr.send()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function createStateChangeListener (xhr, callback) {
|
|||
|
|
return function () {
|
|||
|
|
if (xhr.readyState === 4 && xhr.status === 200) {
|
|||
|
|
try {
|
|||
|
|
callback(null, JSON.parse(xhr.responseText))
|
|||
|
|
} catch (err) {
|
|||
|
|
callback(err, null)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getXHR () {
|
|||
|
|
return window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$OptionsValidator_3 = function OptionsValidator (params) {
|
|||
|
|
if (!validateParams(params)) {
|
|||
|
|
throw new Error('-- OptionsValidator: required options missing')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (!(this instanceof OptionsValidator)) {
|
|||
|
|
return new OptionsValidator(params)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const requiredOptions = params.required
|
|||
|
|
|
|||
|
|
this.getRequiredOptions = function () {
|
|||
|
|
return requiredOptions
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.validate = function (parameters) {
|
|||
|
|
const errors = []
|
|||
|
|
requiredOptions.forEach(function (requiredOptionName) {
|
|||
|
|
if (typeof parameters[requiredOptionName] === 'undefined') {
|
|||
|
|
errors.push(requiredOptionName)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
return errors
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function validateParams (params) {
|
|||
|
|
if (!params) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
return typeof params.required !== 'undefined' && params.required instanceof Array
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
var _$utils_9 = {
|
|||
|
|
merge: merge,
|
|||
|
|
isJSON: isJSON
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function merge (defaultParams, mergeParams) {
|
|||
|
|
const mergedOptions = {}
|
|||
|
|
for (const option in defaultParams) {
|
|||
|
|
mergedOptions[option] = defaultParams[option]
|
|||
|
|
if (typeof mergeParams[option] !== 'undefined') {
|
|||
|
|
mergedOptions[option] = mergeParams[option]
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return mergedOptions
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isJSON (json) {
|
|||
|
|
try {
|
|||
|
|
if (json instanceof Object && JSON.parse(JSON.stringify(json))) {
|
|||
|
|
return true
|
|||
|
|
}
|
|||
|
|
return false
|
|||
|
|
} catch (err) {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var _$src_8 = {};
|
|||
|
|
(function (window) {
|
|||
|
|
'use strict'
|
|||
|
|
|
|||
|
|
let options = {
|
|||
|
|
searchInput: null,
|
|||
|
|
resultsContainer: null,
|
|||
|
|
json: [],
|
|||
|
|
success: Function.prototype,
|
|||
|
|
searchResultTemplate: '<li><a href="{url}" title="{desc}">{title}</a></li>',
|
|||
|
|
templateMiddleware: Function.prototype,
|
|||
|
|
sortMiddleware: function () {
|
|||
|
|
return 0
|
|||
|
|
},
|
|||
|
|
noResultsText: 'No results found',
|
|||
|
|
limit: 10,
|
|||
|
|
fuzzy: false,
|
|||
|
|
debounceTime: null,
|
|||
|
|
exclude: []
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let debounceTimerHandle
|
|||
|
|
const debounce = function (func, delayMillis) {
|
|||
|
|
if (delayMillis) {
|
|||
|
|
clearTimeout(debounceTimerHandle)
|
|||
|
|
debounceTimerHandle = setTimeout(func, delayMillis)
|
|||
|
|
} else {
|
|||
|
|
func.call()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const requiredOptions = ['searchInput', 'resultsContainer', 'json']
|
|||
|
|
|
|||
|
|
/* removed: const _$Templater_7 = require('./Templater') */;
|
|||
|
|
/* removed: const _$Repository_4 = require('./Repository') */;
|
|||
|
|
/* removed: const _$JSONLoader_2 = require('./JSONLoader') */;
|
|||
|
|
const optionsValidator = _$OptionsValidator_3({
|
|||
|
|
required: requiredOptions
|
|||
|
|
})
|
|||
|
|
/* removed: const _$utils_9 = require('./utils') */;
|
|||
|
|
|
|||
|
|
window.SimpleJekyllSearch = function (_options) {
|
|||
|
|
const errors = optionsValidator.validate(_options)
|
|||
|
|
if (errors.length > 0) {
|
|||
|
|
throwError('You must specify the following required options: ' + requiredOptions)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
options = _$utils_9.merge(options, _options)
|
|||
|
|
|
|||
|
|
_$Templater_7.setOptions({
|
|||
|
|
template: options.searchResultTemplate,
|
|||
|
|
middleware: options.templateMiddleware
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
_$Repository_4.setOptions({
|
|||
|
|
fuzzy: options.fuzzy,
|
|||
|
|
limit: options.limit,
|
|||
|
|
sort: options.sortMiddleware,
|
|||
|
|
exclude: options.exclude
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
if (_$utils_9.isJSON(options.json)) {
|
|||
|
|
initWithJSON(options.json)
|
|||
|
|
} else {
|
|||
|
|
initWithURL(options.json)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const rv = {
|
|||
|
|
search: search
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
typeof options.success === 'function' && options.success.call(rv)
|
|||
|
|
return rv
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initWithJSON (json) {
|
|||
|
|
_$Repository_4.put(json)
|
|||
|
|
registerInput()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initWithURL (url) {
|
|||
|
|
_$JSONLoader_2.load(url, function (err, json) {
|
|||
|
|
if (err) {
|
|||
|
|
throwError('failed to get JSON (' + url + ')')
|
|||
|
|
}
|
|||
|
|
initWithJSON(json)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function emptyResultsContainer () {
|
|||
|
|
options.resultsContainer.innerHTML = ''
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function appendToResultsContainer (text) {
|
|||
|
|
options.resultsContainer.innerHTML += text
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function registerInput () {
|
|||
|
|
options.searchInput.addEventListener('input', function (e) {
|
|||
|
|
if (isWhitelistedKey(e.which)) {
|
|||
|
|
emptyResultsContainer()
|
|||
|
|
debounce(function () { search(e.target.value) }, options.debounceTime)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function search (query) {
|
|||
|
|
if (isValidQuery(query)) {
|
|||
|
|
emptyResultsContainer()
|
|||
|
|
render(_$Repository_4.search(query), query)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function render (results, query) {
|
|||
|
|
const len = results.length
|
|||
|
|
if (len === 0) {
|
|||
|
|
return appendToResultsContainer(options.noResultsText)
|
|||
|
|
}
|
|||
|
|
for (let i = 0; i < len; i++) {
|
|||
|
|
results[i].query = query
|
|||
|
|
appendToResultsContainer(_$Templater_7.compile(results[i]))
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isValidQuery (query) {
|
|||
|
|
return query && query.length > 0
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isWhitelistedKey (key) {
|
|||
|
|
return [13, 16, 20, 37, 38, 39, 40, 91].indexOf(key) === -1
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function throwError (message) {
|
|||
|
|
throw new Error('SimpleJekyllSearch --- ' + message)
|
|||
|
|
}
|
|||
|
|
})(window)
|
|||
|
|
|
|||
|
|
}());
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<!-- Configuration -->
|
|||
|
|
<script>
|
|||
|
|
SimpleJekyllSearch({
|
|||
|
|
searchInput: document.getElementById('search-input'),
|
|||
|
|
resultsContainer: document.getElementById('results-container'),
|
|||
|
|
noResultsText: '<p>Aucun résultat!</p>',
|
|||
|
|
json: '/search.json',
|
|||
|
|
searchResultTemplate: '<li><a href="{url}">{date} {title}</a> (Création {create})</li>'
|
|||
|
|
})
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<script>(function() {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
function scrollToAnchor(anchor, duration, callback) {
|
|||
|
|
var $root = this;
|
|||
|
|
$root.animate({ scrollTop: $(anchor).position().top }, duration, function() {
|
|||
|
|
window.history.replaceState(null, '', window.location.href.split('#')[0] + anchor);
|
|||
|
|
callback && callback();
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
$.fn.scrollToAnchor = scrollToAnchor;
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
(function() {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
function affix(options) {
|
|||
|
|
var $root = this, $window = $(window), $scrollTarget, $scroll,
|
|||
|
|
offsetBottom = 0, scrollTarget = window, scroll = window.document, disabled = false, isOverallScroller = true,
|
|||
|
|
rootTop, rootLeft, rootHeight, scrollBottom, rootBottomTop,
|
|||
|
|
hasInit = false, curState;
|
|||
|
|
|
|||
|
|
function setOptions(options) {
|
|||
|
|
var _options = options || {};
|
|||
|
|
_options.offsetBottom && (offsetBottom = _options.offsetBottom);
|
|||
|
|
_options.scrollTarget && (scrollTarget = _options.scrollTarget);
|
|||
|
|
_options.scroll && (scroll = _options.scroll);
|
|||
|
|
_options.disabled !== undefined && (disabled = _options.disabled);
|
|||
|
|
$scrollTarget = $(scrollTarget);
|
|||
|
|
isOverallScroller = window.isOverallScroller($scrollTarget[0]);
|
|||
|
|
$scroll = $(scroll);
|
|||
|
|
}
|
|||
|
|
function preCalc() {
|
|||
|
|
top();
|
|||
|
|
rootHeight = $root.outerHeight();
|
|||
|
|
rootTop = $root.offset().top + (isOverallScroller ? 0 : $scrollTarget.scrollTop());
|
|||
|
|
rootLeft = $root.offset().left;
|
|||
|
|
}
|
|||
|
|
function calc(needPreCalc) {
|
|||
|
|
needPreCalc && preCalc();
|
|||
|
|
scrollBottom = $scroll.outerHeight() - offsetBottom - rootHeight;
|
|||
|
|
rootBottomTop = scrollBottom - rootTop;
|
|||
|
|
}
|
|||
|
|
function top() {
|
|||
|
|
if (curState !== 'top') {
|
|||
|
|
$root.removeClass('fixed').css({
|
|||
|
|
left: 0,
|
|||
|
|
top: 0
|
|||
|
|
});
|
|||
|
|
curState = 'top';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function fixed() {
|
|||
|
|
if (curState !== 'fixed') {
|
|||
|
|
$root.addClass('fixed').css({
|
|||
|
|
left: rootLeft + 'px',
|
|||
|
|
top: 0
|
|||
|
|
});
|
|||
|
|
curState = 'fixed';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function bottom() {
|
|||
|
|
if (curState !== 'bottom') {
|
|||
|
|
$root.removeClass('fixed').css({
|
|||
|
|
left: 0,
|
|||
|
|
top: rootBottomTop + 'px'
|
|||
|
|
});
|
|||
|
|
curState = 'bottom';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function setState() {
|
|||
|
|
var scrollTop = $scrollTarget.scrollTop();
|
|||
|
|
if (scrollTop >= rootTop && scrollTop <= scrollBottom) {
|
|||
|
|
fixed();
|
|||
|
|
} else if (scrollTop < rootTop) {
|
|||
|
|
top();
|
|||
|
|
} else {
|
|||
|
|
bottom();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function init() {
|
|||
|
|
if(!hasInit) {
|
|||
|
|
var interval, timeout;
|
|||
|
|
calc(true); setState();
|
|||
|
|
// run calc every 100 millisecond
|
|||
|
|
interval = setInterval(function() {
|
|||
|
|
calc();
|
|||
|
|
}, 100);
|
|||
|
|
timeout = setTimeout(function() {
|
|||
|
|
clearInterval(interval);
|
|||
|
|
}, 45000);
|
|||
|
|
window.pageLoad.then(function() {
|
|||
|
|
setTimeout(function() {
|
|||
|
|
clearInterval(interval);
|
|||
|
|
clearTimeout(timeout);
|
|||
|
|
}, 3000);
|
|||
|
|
});
|
|||
|
|
$scrollTarget.on('scroll', function() {
|
|||
|
|
disabled || setState();
|
|||
|
|
});
|
|||
|
|
$window.on('resize', function() {
|
|||
|
|
disabled || (calc(true), setState());
|
|||
|
|
});
|
|||
|
|
hasInit = true;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
setOptions(options);
|
|||
|
|
if (!disabled) {
|
|||
|
|
init();
|
|||
|
|
}
|
|||
|
|
$window.on('resize', window.throttle(function() {
|
|||
|
|
init();
|
|||
|
|
}, 200));
|
|||
|
|
return {
|
|||
|
|
setOptions: setOptions,
|
|||
|
|
refresh: function() {
|
|||
|
|
calc(true, { animation: false }); setState();
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
$.fn.affix = affix;
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
(function() {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
function toc(options) {
|
|||
|
|
var $root = this, $window = $(window), $scrollTarget, $scroller, $tocUl = $('<ul class="toc toc--ellipsis"></ul>'), $tocLi, $headings, $activeLast, $activeCur,
|
|||
|
|
selectors = 'h1,h2,h3', container = 'body', scrollTarget = window, scroller = 'html, body', disabled = false,
|
|||
|
|
headingsPos, scrolling = false, hasRendered = false, hasInit = false;
|
|||
|
|
|
|||
|
|
function setOptions(options) {
|
|||
|
|
var _options = options || {};
|
|||
|
|
_options.selectors && (selectors = _options.selectors);
|
|||
|
|
_options.container && (container = _options.container);
|
|||
|
|
_options.scrollTarget && (scrollTarget = _options.scrollTarget);
|
|||
|
|
_options.scroller && (scroller = _options.scroller);
|
|||
|
|
_options.disabled !== undefined && (disabled = _options.disabled);
|
|||
|
|
$headings = $(container).find(selectors).filter('[id]');
|
|||
|
|
$scrollTarget = $(scrollTarget);
|
|||
|
|
$scroller = $(scroller);
|
|||
|
|
}
|
|||
|
|
function calc() {
|
|||
|
|
headingsPos = [];
|
|||
|
|
$headings.each(function() {
|
|||
|
|
headingsPos.push(Math.floor($(this).position().top));
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
function setState(element, disabled) {
|
|||
|
|
var scrollTop = $scrollTarget.scrollTop(), i;
|
|||
|
|
if (disabled || !headingsPos || headingsPos.length < 1) { return; }
|
|||
|
|
if (element) {
|
|||
|
|
$activeCur = element;
|
|||
|
|
} else {
|
|||
|
|
for (i = 0; i < headingsPos.length; i++) {
|
|||
|
|
if (scrollTop >= headingsPos[i]) {
|
|||
|
|
$activeCur = $tocLi.eq(i);
|
|||
|
|
} else {
|
|||
|
|
$activeCur || ($activeCur = $tocLi.eq(i));
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
$activeLast && $activeLast.removeClass('active');
|
|||
|
|
($activeLast = $activeCur).addClass('active');
|
|||
|
|
}
|
|||
|
|
function render() {
|
|||
|
|
if(!hasRendered) {
|
|||
|
|
$root.append($tocUl);
|
|||
|
|
$headings.each(function() {
|
|||
|
|
var $this = $(this);
|
|||
|
|
$tocUl.append($('<li></li>').addClass('toc-' + $this.prop('tagName').toLowerCase())
|
|||
|
|
.append($('<a></a>').text($this.text()).attr('href', '#' + $this.prop('id'))));
|
|||
|
|
});
|
|||
|
|
$tocLi = $tocUl.children('li');
|
|||
|
|
$tocUl.on('click', 'a', function(e) {
|
|||
|
|
e.preventDefault();
|
|||
|
|
var $this = $(this);
|
|||
|
|
scrolling = true;
|
|||
|
|
setState($this.parent());
|
|||
|
|
$scroller.scrollToAnchor($this.attr('href'), 400, function() {
|
|||
|
|
scrolling = false;
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
hasRendered = true;
|
|||
|
|
}
|
|||
|
|
function init() {
|
|||
|
|
var interval, timeout;
|
|||
|
|
if(!hasInit) {
|
|||
|
|
render(); calc(); setState(null, scrolling);
|
|||
|
|
// run calc every 100 millisecond
|
|||
|
|
interval = setInterval(function() {
|
|||
|
|
calc();
|
|||
|
|
}, 100);
|
|||
|
|
timeout = setTimeout(function() {
|
|||
|
|
clearInterval(interval);
|
|||
|
|
}, 45000);
|
|||
|
|
window.pageLoad.then(function() {
|
|||
|
|
setTimeout(function() {
|
|||
|
|
clearInterval(interval);
|
|||
|
|
clearTimeout(timeout);
|
|||
|
|
}, 3000);
|
|||
|
|
});
|
|||
|
|
$scrollTarget.on('scroll', function() {
|
|||
|
|
disabled || setState(null, scrolling);
|
|||
|
|
});
|
|||
|
|
$window.on('resize', window.throttle(function() {
|
|||
|
|
if (!disabled) {
|
|||
|
|
render(); calc(); setState(null, scrolling);
|
|||
|
|
}
|
|||
|
|
}, 100));
|
|||
|
|
}
|
|||
|
|
hasInit = true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
setOptions(options);
|
|||
|
|
if (!disabled) {
|
|||
|
|
init();
|
|||
|
|
}
|
|||
|
|
$window.on('resize', window.throttle(function() {
|
|||
|
|
init();
|
|||
|
|
}, 200));
|
|||
|
|
return {
|
|||
|
|
setOptions: setOptions
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
$.fn.toc = toc;
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
/*(function () {
|
|||
|
|
|
|||
|
|
})();*/
|
|||
|
|
</script><script>
|
|||
|
|
/* toc must before affix, since affix need to konw toc' height. */(function() {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
var TOC_SELECTOR = window.TEXT_VARIABLES.site.toc.selectors;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
var $window = $(window);
|
|||
|
|
var $articleContent = $('.js-article-content');
|
|||
|
|
var $tocRoot = $('.js-toc-root'), $col2 = $('.js-col-aside');
|
|||
|
|
var toc;
|
|||
|
|
var tocDisabled = false;
|
|||
|
|
var hasSidebar = $('.js-page-root').hasClass('layout--page--sidebar');
|
|||
|
|
var hasToc = $articleContent.find(TOC_SELECTOR).length > 0;
|
|||
|
|
|
|||
|
|
function disabled() {
|
|||
|
|
return $col2.css('display') === 'none' || !hasToc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
tocDisabled = disabled();
|
|||
|
|
|
|||
|
|
toc = $tocRoot.toc({
|
|||
|
|
selectors: TOC_SELECTOR,
|
|||
|
|
container: $articleContent,
|
|||
|
|
scrollTarget: hasSidebar ? '.js-page-main' : null,
|
|||
|
|
scroller: hasSidebar ? '.js-page-main' : null,
|
|||
|
|
disabled: tocDisabled
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
$window.on('resize', window.throttle(function() {
|
|||
|
|
tocDisabled = disabled();
|
|||
|
|
toc && toc.setOptions({
|
|||
|
|
disabled: tocDisabled
|
|||
|
|
});
|
|||
|
|
}, 100));
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
(function() {
|
|||
|
|
var SOURCES = window.TEXT_VARIABLES.sources;
|
|||
|
|
window.Lazyload.js(SOURCES.jquery, function() {
|
|||
|
|
var $window = $(window), $pageFooter = $('.js-page-footer');
|
|||
|
|
var $pageAside = $('.js-page-aside');
|
|||
|
|
var affix;
|
|||
|
|
var tocDisabled = false;
|
|||
|
|
var hasSidebar = $('.js-page-root').hasClass('layout--page--sidebar');
|
|||
|
|
|
|||
|
|
affix = $pageAside.affix({
|
|||
|
|
offsetBottom: $pageFooter.outerHeight(),
|
|||
|
|
scrollTarget: hasSidebar ? '.js-page-main' : null,
|
|||
|
|
scroller: hasSidebar ? '.js-page-main' : null,
|
|||
|
|
scroll: hasSidebar ? $('.js-page-main').children() : null,
|
|||
|
|
disabled: tocDisabled
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
$window.on('resize', window.throttle(function() {
|
|||
|
|
affix && affix.setOptions({
|
|||
|
|
disabled: tocDisabled
|
|||
|
|
});
|
|||
|
|
}, 100));
|
|||
|
|
|
|||
|
|
window.pageAsideAffix = affix;
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
</script><!---->
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<script>(function () {
|
|||
|
|
var $root = document.getElementsByClassName('root')[0];
|
|||
|
|
if (window.hasEvent('touchstart')) {
|
|||
|
|
$root.dataset.isTouch = true;
|
|||
|
|
document.addEventListener('touchstart', function(){}, false);
|
|||
|
|
}
|
|||
|
|
})();
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|
|||
|
|
|