doc/auth/userauth.svg

<svg id="mermaidChart4" width="100%" xmlns="http://www.w3.org/2000/svg" height="100%" style="max-width:850px;" viewBox="-50 -10 850 988"><style>
  /* Flowchart variables */
/* Sequence Diagram variables */
/* Gantt chart variables */
.mermaid .label {
  font-family: 'trebuchet ms', verdana, arial;
  color: #333;
}
.node rect,
.node circle,
.node ellipse,
.node polygon {
  fill: #cde498;
  stroke: #13540c;
  stroke-width: 1px;
}
.arrowheadPath {
  fill: green;
}
.edgePath .path {
  stroke: green;
  stroke-width: 1.5px;
}
.edgeLabel {
  background-color: #e8e8e8;
}
.cluster rect {
  fill: #cdffb2 !important;
  rx: 4 !important;
  stroke: #6eaa49 !important;
  stroke-width: 1px !important;
}
.cluster text {
  fill: #333;
}
.actor {
  stroke: #13540c;
  fill: #cde498;
}
text.actor {
  fill: black;
  stroke: none;
}
.actor-line {
  stroke: grey;
}
.messageLine0 {
  stroke-width: 1.5;
  stroke-dasharray: "2 2";
  marker-end: "url(#arrowhead)";
  stroke: #333;
}
.messageLine1 {
  stroke-width: 1.5;
  stroke-dasharray: "2 2";
  stroke: #333;
}
#arrowhead {
  fill: #333;
}
#crosshead path {
  fill: #333 !important;
  stroke: #333 !important;
}
.messageText {
  fill: #333;
  stroke: none;
}
.labelBox {
  stroke: #326932;
  fill: #cde498;
}
.labelText {
  fill: black;
  stroke: none;
}
.loopText {
  fill: black;
  stroke: none;
}
.loopLine {
  stroke-width: 2;
  stroke-dasharray: "2 2";
  marker-end: "url(#arrowhead)";
  stroke: #326932;
}
.note {
  stroke: #6eaa49;
  fill: #fff5ad;
}
.noteText {
  fill: black;
  stroke: none;
  font-family: 'trebuchet ms', verdana, arial;
  font-size: 14px;
}
/** Section styling */
.section {
  stroke: none;
  opacity: 0.2;
}
.section0 {
  fill: #6eaa49;
}
.section2 {
  fill: #6eaa49;
}
.section1,
.section3 {
  fill: white;
  opacity: 0.2;
}
.sectionTitle0 {
  fill: #333;
}
.sectionTitle1 {
  fill: #333;
}
.sectionTitle2 {
  fill: #333;
}
.sectionTitle3 {
  fill: #333;
}
.sectionTitle {
  text-anchor: start;
  font-size: 11px;
  text-height: 14px;
}
/* Grid and axis */
.grid .tick {
  stroke: lightgrey;
  opacity: 0.3;
  shape-rendering: crispEdges;
}
.grid path {
  stroke-width: 0;
}
/* Today line */
.today {
  fill: none;
  stroke: red;
  stroke-width: 2px;
}
/* Task styling */
/* Default task */
.task {
  stroke-width: 2;
}
.taskText {
  text-anchor: middle;
  font-size: 11px;
}
.taskTextOutsideRight {
  fill: black;
  text-anchor: start;
  font-size: 11px;
}
.taskTextOutsideLeft {
  fill: black;
  text-anchor: end;
  font-size: 11px;
}
/* Specific task settings for the sections*/
.taskText0,
.taskText1,
.taskText2,
.taskText3 {
  fill: white;
}
.task0,
.task1,
.task2,
.task3 {
  fill: #487e3a;
  stroke: #13540c;
}
.taskTextOutside0,
.taskTextOutside2 {
  fill: black;
}
.taskTextOutside1,
.taskTextOutside3 {
  fill: black;
}
/* Active task */
.active0,
.active1,
.active2,
.active3 {
  fill: #cde498;
  stroke: #13540c;
}
.activeText0,
.activeText1,
.activeText2,
.activeText3 {
  fill: black !important;
}
/* Completed task */
.done0,
.done1,
.done2,
.done3 {
  stroke: grey;
  fill: lightgrey;
  stroke-width: 2;
}
.doneText0,
.doneText1,
.doneText2,
.doneText3 {
  fill: black !important;
}
/* Tasks on the critical line */
.crit0,
.crit1,
.crit2,
.crit3 {
  stroke: #ff8888;
  fill: red;
  stroke-width: 2;
}
.activeCrit0,
.activeCrit1,
.activeCrit2,
.activeCrit3 {
  stroke: #ff8888;
  fill: #cde498;
  stroke-width: 2;
}
.doneCrit0,
.doneCrit1,
.doneCrit2,
.doneCrit3 {
  stroke: #ff8888;
  fill: lightgrey;
  stroke-width: 2;
  cursor: pointer;
  shape-rendering: crispEdges;
}
.doneCritText0,
.doneCritText1,
.doneCritText2,
.doneCritText3 {
  fill: black !important;
}
.activeCritText0,
.activeCritText1,
.activeCritText2,
.activeCritText3 {
  fill: black !important;
}
.titleText {
  text-anchor: middle;
  font-size: 18px;
  fill: black;
}
g.classGroup text {
  fill: #13540c;
  stroke: none;
  font-family: 'trebuchet ms', verdana, arial;
  font-size: 10px;
}
g.classGroup rect {
  fill: #cde498;
  stroke: #13540c;
}
g.classGroup line {
  stroke: #13540c;
  stroke-width: 1;
}
svg .classLabel .box {
  stroke: none;
  stroke-width: 0;
  fill: #cde498;
  opacity: 0.5;
}
svg .classLabel .label {
  fill: #13540c;
  font-size: 10px;
}
.relation {
  stroke: #13540c;
  stroke-width: 1;
  fill: none;
}
.composition {
  fill: #13540c;
  stroke: #13540c;
  stroke-width: 1;
}
#compositionStart {
  fill: #13540c;
  stroke: #13540c;
  stroke-width: 1;
}
#compositionEnd {
  fill: #13540c;
  stroke: #13540c;
  stroke-width: 1;
}
.aggregation {
  fill: #cde498;
  stroke: #13540c;
  stroke-width: 1;
}
#aggregationStart {
  fill: #cde498;
  stroke: #13540c;
  stroke-width: 1;
}
#aggregationEnd {
  fill: #cde498;
  stroke: #13540c;
  stroke-width: 1;
}
#dependencyStart {
  fill: #13540c;
  stroke: #13540c;
  stroke-width: 1;
}
#dependencyEnd {
  fill: #13540c;
  stroke: #13540c;
  stroke-width: 1;
}
#extensionStart {
  fill: #13540c;
  stroke: #13540c;
  stroke-width: 1;
}
#extensionEnd {
  fill: #13540c;
  stroke: #13540c;
  stroke-width: 1;
}
.node text {
  font-family: 'trebuchet ms', verdana, arial;
  font-size: 14px;
}
div.mermaidTooltip {
  position: absolute;
  text-align: center;
  max-width: 200px;
  padding: 2px;
  font-family: 'trebuchet ms', verdana, arial;
  font-size: 12px;
  background: #cdffb2;
  border: 1px solid #6eaa49;
  border-radius: 2px;
  pointer-events: none;
  z-index: 100;
}

svg {
  color: rgba(0, 0, 0, 0.65);
  font: normal normal normal normal 12px / 18px "Helvetica Neue For Number", -apple-system, system-ui, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
  </style><g></g><g><line id="actor14" x1="75" y1="5" x2="75" y2="977" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="0" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="75" dy="0">user</tspan></text></g><g><line id="actor15" x1="275" y1="5" x2="275" y2="977" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="200" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="275" dy="0">server</tspan></text></g><g><line id="actor16" x1="475" y1="5" x2="475" y2="977" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="400" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="475" dy="0">weshin</tspan></text></g><g><line id="actor17" x1="675" y1="5" x2="675" y2="977" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="600" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="675" dy="0">wechat</tspan></text></g><defs><marker id="arrowhead" refX="5" refY="2" markerWidth="6" markerHeight="4" orient="auto"><path d="M 0,0 V 4 L6,2 Z"></path></marker></defs><defs><marker id="crosshead" markerWidth="15" markerHeight="8" orient="auto" refX="16" refY="4"><path fill="black" stroke="#000000" stroke-width="1px" d="M 9,2 V 6 L16,4 Z" style="stroke-dasharray: 0, 0;"></path><path fill="none" stroke="#000000" stroke-width="1px" d="M 0,1 L 6,7 M 6,1 L 0,7" style="stroke-dasharray: 0, 0;"></path></marker></defs><g><text x="175" y="93" class="messageText" style="text-anchor: middle;">用户访问公众号页面</text><line x1="75" y1="100" x2="275" y2="100" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="275" y="128" class="messageText" style="text-anchor: middle;">查询用户信息</text><path d="M 275,135 C 335,125 335,165 275,155" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></path></g><g><text x="175" y="218" class="messageText" style="text-anchor: middle;">web服务</text><line x1="275" y1="225" x2="75" y2="225" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><line x1="65" y1="175" x2="285" y2="175" class="loopLine"></line><line x1="285" y1="175" x2="285" y2="235" class="loopLine"></line><line x1="65" y1="235" x2="285" y2="235" class="loopLine"></line><line x1="65" y1="175" x2="65" y2="235" class="loopLine"></line><polygon points="65,175 115,175 115,188 106.6,195 65,195" class="labelBox"></polygon><text x="72.5" y="190" fill="black" class="labelText"><tspan x="72.5" fill="black">opt</tspan></text><text x="175" y="190" fill="black" class="loopText" style="text-anchor: middle;"><tspan x="175" fill="black">[ 已有用户信息 ]</tspan></text></g><g><text x="375" y="263" class="messageText" style="text-anchor: middle;">发起网页授权</text><line x1="275" y1="270" x2="475" y2="270" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="375" y="298" class="messageText" style="text-anchor: middle;">授权跳转链接(jumpUrl)</text><line x1="475" y1="305" x2="275" y2="305" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="175" y="333" class="messageText" style="text-anchor: middle;">引导页面跳转</text><line x1="275" y1="340" x2="75" y2="340" class="messageLine1" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="stroke-dasharray: 3, 3; fill: none;"></line></g><g><text x="375" y="368" class="messageText" style="text-anchor: middle;">跳转授权页面</text><line x1="75" y1="375" x2="675" y2="375" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="600" y="385" fill="#EDF2AE" stroke="#666" width="150" height="34" rx="0" ry="0" class="note"></rect><text x="616" y="410" fill="black" class="noteText"><tspan x="616" fill="black">用户授权</tspan></text></g><g><text x="375" y="447" class="messageText" style="text-anchor: middle;">跳转回调页面</text><line x1="675" y1="454" x2="75" y2="454" class="messageLine1" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="stroke-dasharray: 3, 3; fill: none;"></line></g><g><text x="175" y="482" class="messageText" style="text-anchor: middle;">跳转 redirect_uri(code)</text><line x1="75" y1="489" x2="275" y2="489" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="375" y="517" class="messageText" style="text-anchor: middle;">请求用户信息(code)</text><line x1="275" y1="524" x2="475" y2="524" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="575" y="552" class="messageText" style="text-anchor: middle;">请求token (code|appID|secret)</text><line x1="475" y1="559" x2="675" y2="559" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="575" y="587" class="messageText" style="text-anchor: middle;">access_token|refresh_token</text><line x1="675" y1="594" x2="475" y2="594" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="400" y="629" fill="#EDF2AE" stroke="#666" width="150" height="34" rx="0" ry="0" class="note"></rect><text x="416" y="654" fill="black" class="noteText"><tspan x="416" fill="black">存储 token</tspan></text></g><g><line x1="390" y1="604" x2="560" y2="604" class="loopLine"></line><line x1="560" y1="604" x2="560" y2="673" class="loopLine"></line><line x1="390" y1="673" x2="560" y2="673" class="loopLine"></line><line x1="390" y1="604" x2="390" y2="673" class="loopLine"></line><polygon points="390,604 440,604 440,617 431.6,624 390,624" class="labelBox"></polygon><text x="397.5" y="619" fill="black" class="labelText"><tspan x="397.5" fill="black">opt</tspan></text><text x="475" y="619" fill="black" class="loopText" style="text-anchor: middle;"><tspan x="475" fill="black">[ optional ]</tspan></text></g><g><text x="575" y="701" class="messageText" style="text-anchor: middle;">请求用户信息(access_token)</text><line x1="475" y1="708" x2="675" y2="708" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="575" y="736" class="messageText" style="text-anchor: middle;">用户信息</text><line x1="675" y1="743" x2="475" y2="743" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="400" y="778" fill="#EDF2AE" stroke="#666" width="150" height="34" rx="0" ry="0" class="note"></rect><text x="416" y="803" fill="black" class="noteText"><tspan x="416" fill="black">存储用户信息</tspan></text></g><g><line x1="390" y1="753" x2="560" y2="753" class="loopLine"></line><line x1="560" y1="753" x2="560" y2="822" class="loopLine"></line><line x1="390" y1="822" x2="560" y2="822" class="loopLine"></line><line x1="390" y1="753" x2="390" y2="822" class="loopLine"></line><polygon points="390,753 440,753 440,766 431.6,773 390,773" class="labelBox"></polygon><text x="397.5" y="768" fill="black" class="labelText"><tspan x="397.5" fill="black">opt</tspan></text><text x="475" y="768" fill="black" class="loopText" style="text-anchor: middle;"><tspan x="475" fill="black">[ optional ]</tspan></text></g><g><text x="375" y="850" class="messageText" style="text-anchor: middle;">用户信息</text><line x1="475" y1="857" x2="275" y2="857" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="175" y="885" class="messageText" style="text-anchor: middle;">web服务</text><line x1="275" y1="892" x2="75" y2="892" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="0" y="912" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="944.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="75" dy="0">user</tspan></text></g><g><rect x="200" y="912" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="944.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="275" dy="0">server</tspan></text></g><g><rect x="400" y="912" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="944.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="475" dy="0">weshin</tspan></text></g><g><rect x="600" y="912" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="944.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle;"><tspan x="675" dy="0">wechat</tspan></text></g></svg>