Merge remote-tracking branch 'origin/main' into oso

* origin/main: (71 commits)
  Update 2021-01-13-developers-cheatsheet-csharp-9.md (#530)
  update secure-web-apps-websockets-nodejs (#764)
  Update .NET Token Auth to use CLI for setup (#678)
  update build-a-graphql-nodejs-api (#763)
  Update Spring Boot Social Login post to use CLI (#765)
  Update Angular PWA post to use Angular 11 use CLI for setup (#759)
  Update Java SSO post for new Admin Console (#710)
  Update Schematics posts to use CLI (#707)
  Update Java GraphQL post to use CLI (#708)
  Update Gatsby React post to use CLI for setup (#671)
  update graphql-apollo-react-update (#761)
  Deprecate Angular Authentication with OIDC (#760)
  Update Ant Design + React to use CLI for setup (#706)
  Update Spring Boot SAML post to use CLI for setup (#705)
  Update Android Authentication post to use CLI for setup (#669)
  Update Serverless Java post to use CLI for setup (#668)
  Update Node.js Login post to use CLI for setup (#664)
  Update Spring Boot + Vue post to use CLI for setup (#703)
  Update Heroku Docker React post to use CLI for setup (#663)
  Update Spring Cloud Gateway Patterns to use CLI for setup (#658)
  ...

.gitignore

@@ -1,3 +1,4 @@
+*.env
 .idea
 *.iml
 *.ipr

Gemfile

@@ -3,7 +3,7 @@ source 'https://rubygems.org'
 gem 'jekyll-assets', '2.3.2'
 gem 'jekyll-redirect-from'
 gem 'jekyll-include-cache'
-gem 'html-proofer', '3.18.8'
+gem 'html-proofer', '3.19.0'
 gem 'tzinfo-data'
 gem 'kramdown-parser-gfm'
 

Gemfile.lock

@@ -9,15 +9,15 @@ GEM
     em-websocket (0.5.2)
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0.6.0)
-    ethon (0.12.0)
-      ffi (>= 1.3.0)
+    ethon (0.13.0)
+      ffi (>= 1.15.0)
     eventmachine (1.2.7)
     extras (0.3.0)
       forwardable-extended (~> 2.5)
     fastimage (2.2.1)
     ffi (1.15.0)
     forwardable-extended (2.6.0)
-    html-proofer (3.18.8)
+    html-proofer (3.19.0)
       addressable (~> 2.3)
       mercenary (~> 0.3)
       nokogumbo (~> 2.0)
@@ -73,7 +73,7 @@ GEM
       rb-inotify (~> 0.9, >= 0.9.10)
     mercenary (0.3.6)
     mini_portile2 (2.5.0)
-    nokogiri (1.11.2)
+    nokogiri (1.11.3)
       mini_portile2 (~> 2.5.0)
       racc (~> 1.4)
     nokogumbo (2.0.5)
@@ -112,7 +112,7 @@ PLATFORMS
   ruby
 
 DEPENDENCIES
-  html-proofer (= 3.18.8)
+  html-proofer (= 3.19.0)
   jekyll-asciidoc
   jekyll-assets (= 2.3.2)
   jekyll-include-cache

README.md

@@ -129,7 +129,7 @@ What this command does is:
 - `okta-blog` - This is telling Docker to run the `okta-blog` image you created earlier using that `docker build` command. The `-t` option you specified earlier when running `docker build` assigned a name tag to the image so you could easily reference it.
 - `npm start` - This is the actual command you're telling Docker to run to launch the blog sofware. Docker will start the container up and then run this command inside the container to launch the Jekyll blog.
 
-After that, all you have to do is open your browser and visit http://localhost:4000 to visit the site!
+After that, all you have to do is open your browser and visit `http://localhost:4000` to visit the site!
 
 ## Markdown Standards
 
@@ -151,7 +151,7 @@ The basic syntax for using the Okta CLI to set up an app is:
 {% include setup/cli.md type="spa" loginRedirectUri="http://localhost:8080/callback" %}
 ```
 
-Supported values for `type`: spa, web, native, service, and jhipster
+Supported values for `type`: spa, web, native, service, token, and jhipster
 
 Other parameters you can pass in:
 
@@ -162,7 +162,7 @@ Other parameters you can pass in:
 |`logoutRedirectUri`|Prints whatever you set, or defaults if not set|
 |`signup`|`false` reduces opening paragraph to one sentence|
 |`note`|Prints whatever you set. See .NET example below|
-|`adoc`|`true` required for posts written in `AsciiDoc`|
+|`install`|`false` removes 'Install the Okta CLI' sentence|
 
 See [How to Create an OIDC App on Okta](https://developer.okta.com/blog/setup) for this feature's documentation.
 
@@ -251,9 +251,10 @@ Finds the latest blog post and updates the post date to the date specified. **Da
 
 ```bash
 npm run dev
+npm start
 ```
 
-This command removes all posts from the local development environment except those dated within the last two weeks.
+This command removes all posts from the local development environment except those dated within the last two weeks. If you pass in a file name (or comma-separated list of filenames), it'll keep those too.
 
 ### Restoring Deleted Posts Before Pushing to GitHub
 

_source/_assets/css/asciidoctor.css

@@ -1,6 +1,6 @@
 /* Asciidoctor default stylesheet | MIT License | http://asciidoctor.org */
 @import "https://fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,600,600italic%7CNoto+Serif:400,400italic,700,700italic%7CDroid+Sans+Mono:400";
-article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}
+article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}
 audio,canvas,video{display:inline-block}
 audio:not([controls]){display:none;height:0}
 [hidden],template{display:none}
@@ -362,7 +362,7 @@ body.book #toc,body.book #preamble,body.book h1.sect0,body.book .sect1>h2{page-b
 .show-for-print{display:inherit!important}}
 
 /* New rules added by mraible */
-.paragraph > p, .sectionbody .ulist, .admonitionblock, .quoteblock blockquote p:last-child, .olist, .ulist, details > summary.title {
+.paragraph > p, .sectionbody .ulist, .admonitionblock, .quoteblock blockquote p:last-child, .olist, .ulist, details, details > summary.title {
     margin-bottom: 1.25rem;
 }
 

_source/_assets/css/okta/_/components/layout/_normalize.scss

@@ -58,8 +58,7 @@ hgroup,
 main,
 menu,
 nav,
-section,
-summary {
+section {
 	display: block;
 }
 
@@ -166,10 +165,10 @@ h1 {
 //-----------------------------------------------------------------------
 mark {
 	// scss-lint:disable ColorVariable
-	
+
 	background: #ff0;
 	color: #000;
-	
+
 	// scss-lint:enable ColorVariable
 }
 

_source/_assets/css/okta/components/_BlogPost.scss

@@ -274,6 +274,14 @@
 			margin-bottom: 20px;
 		}
 
+		/* Fix links to anchors in blog posts */
+		#changelog::before, h2::before, h3::before, h4::before {
+			content: "";
+			display: block;
+			height: 80px;
+			margin: -80px 0 0;
+		}
+
 		/* -------------------------- PYGMENTS */
 
 		.highlight pre { color: $eclipse-2; } /* Base Style */
@@ -382,6 +390,9 @@
 			max-width: 100%;
 			overflow: auto;
 		}
+
+		// fix cursor for summary
+		summary { cursor: pointer }
 	}
 
 	&-more {

_source/_assets/css/okta/components/_navigation.scss

@@ -112,6 +112,11 @@
       width: 20px;
       height: 20px;
 
+      svg {
+        width: 20px;
+        height: 20px;
+      }
+
       svg path {
         fill: get-color('white');
       }

_source/_includes/footer.html

@@ -1,6 +1,6 @@
 <footer class="footer">
     <div class="row first-row">
-        <p><i>Need support?</i> Contact <a href="mailto:developers@okta.com" target="_blank" rel="noopener noreferrer"><u><b>developers@okta.com</b></u></a> or ask on the <a href="https://devforum.okta.com/" class="anchor-highlight">forum.</a></p>
+        <p><i>Need support?</i> Ask on the <a href="https://devforum.okta.com/" class="anchor-highlight">forum.</a></p>
     </div>
     <div class="row flex-justify">
         <div class="column social-links">
@@ -27,10 +27,10 @@ <h4 class="column-header">Social</h4>
         <div class="column contact-links">
             <h4 class="column-header">Contact & Legal</h4>
             <ul class="footer-links">
-                <li><a class="footer-link" href="https://developer.okta.com/contact/">Contact our team</a></li>
-                <li><a class="footer-link" href="https://developer.okta.com/contact-sales-enterprise/">Contact sales</a></li>
+                <li><a class="footer-link" href="https://www.okta.com/contact/">Contact our team</a></li>
+                <li><a class="footer-link" href="https://www.okta.com/contact-sales/">Contact sales</a></li>
                 <li><a class="footer-link" href="https://developer.okta.com/terms/">Terms & conditions</a></li>
-                <li><a class="footer-link" href="https://developer.okta.com/privacy/">Privacy policy</a></li>
+                <li><a class="footer-link" href="https://www.okta.com/privacy-policy/">Privacy policy</a></li>
             </ul>
         </div>
 
@@ -84,3 +84,5 @@ <h4 class="column-header">More Info</h4>
     {% if layout.js %}
       {% js '{{layout.js}}' %}
     {% endif %}
+    <!-- Fix <details> for IE/Edge -->
+    <script src="//cdn.jsdelivr.net/npm/details-polyfill@1/index.min.js" async></script>

_source/_includes/partials/icons.html

@@ -22,7 +22,7 @@
 {% endif %}
 
 {% if include.icon == "search" %}
-    <svg class="search-icon {{ include.class }}" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <svg class="search-icon {{ include.class }}" width="15" height="15" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
         <path fill-rule="evenodd" clip-rule="evenodd" d="M7.47328 8.65339C6.81369 9.09025 6.02272 9.34466 5.17233 9.34466C2.86802 9.34466 1 7.47665 1 5.17233C1 2.86802 2.86802 1 5.17233 1C7.47665 1 9.34466 2.86802 9.34466 5.17233C9.34466 6.02272 9.09025 6.81369 8.65339 7.47328L10.7556 9.57548C11.0815 9.90136 11.0815 10.4297 10.7556 10.7556C10.4297 11.0815 9.90136 11.0815 9.57548 10.7556L7.47328 8.65339ZM7.67573 5.17233C7.67573 6.55492 6.55492 7.67573 5.17233 7.67573C3.78974 7.67573 2.66893 6.55492 2.66893 5.17233C2.66893 3.78974 3.78974 2.66893 5.17233 2.66893C6.55492 2.66893 7.67573 3.78974 7.67573 5.17233Z" fill="#14222A" stroke="white" stroke-width="0.25"/>
     </svg>
 {% endif %}

_source/_includes/setup/cli.md

@@ -1,13 +1,14 @@
+{%- if page.path contains '.adoc' -%}{% assign adoc = true %}{%- endif -%}
 {%- capture cliLink %}
-{%- if include.adoc -%}https://cli.okta.com[Okta CLI]
-{%- else -%}[Okta CLI](https://cli.okta.com)
-{%- endif -%}
+  {%- if adoc -%}https://cli.okta.com[Okta CLI]
+  {%- else -%}[Okta CLI](https://cli.okta.com)
+  {%- endif -%}
 {%- endcapture -%}
 
-{% if include.signup == "false" %}
-Install the {{ cliLink }} and run `okta login`.
-{% else %}
-Before you begin, you'll need a free Okta developer account. Install the {{ cliLink }} and run `okta register` to sign up for a new account. If you already have an account, run `okta login`.
+{% if include.install != "false" %}
+  {%- if include.signup == "false" -%}Install the {{ cliLink }} and run `okta login`.
+  {%- else -%}Before you begin, you'll need a free Okta developer account. Install the {{ cliLink }} and run `okta register` to sign up for a new account. If you already have an account, run `okta login`.
+  {%- endif -%}
 {% endif %}
 
 {%- if include.type == "spa" -%}
@@ -22,51 +23,55 @@ Before you begin, you'll need a free Okta developer account. Install the {{ cliL
 
 {% if include.type == "jhipster" %}
 Then, run `okta apps create jhipster`. Select the default app name, or change it as you see fit. Accept the default Redirect URI values provided for you.
-{% elsif include.type != "token" %}
-Then, run `okta apps create{% if (include.type == "service") %} service{% endif %}`. Select the default app name, or change it as you see fit. Choose **
-{%- if include.type == "spa" -%}
-Single-Page App
-{%- else -%}
-{{ include.type | capitalize }}
-{%- endif -%}
-** and press **Enter**. 
+{% elsif include.type == "token" %}
+Next, create an API token. Run `okta login` and open the resulting URL in your browser. Log in and go to **Security** > **API** > **Tokens**. Create a new token and store the value somewhere safe. Make sure you don't check it into GitHub!
+{% else %}
+{% if include.install == "false" %}Run {% else %}Then, run{% endif %} `okta apps create{% if include.type == "service" %} service{% endif %}`. Select the default app name, or change it as you see fit.
+{% if include.type != "service" %}Choose **
+  {%- if include.type == "spa" -%}Single-Page App
+  {%- else -%}{{ include.type | capitalize }}
+  {%- endif -%}
+** and press **Enter**.
+{% endif %}
   {% if include.type == "spa" %}
-Change the Redirect URI to `{{ include.loginRedirectUri }}` and accept the default Logout Redirect URI of `{% if include.logoutRedirectUri %}{{ include.logoutRedirectUri }}{% else %}{{ baseUrl }}{% endif %}`.
+Use `{% if adoc %}\{% endif %}{{ include.loginRedirectUri }}` for the Redirect URI and {% if include.logoutRedirectUri %}set the Logout Redirect URI to `{% if adoc %}\{% endif %}{{ include.logoutRedirectUri }}`{% else %}accept the default Logout Redirect URI of `{% if adoc %}\{% endif %}{{ baseUrl }}`{% endif %}.
   {% elsif include.type == "web" %}
 Select **
     {%- if include.framework -%}{{ include.framework }}
     {%- else -%}Other
     {%- endif -%}**. 
-    {% if include.loginRedirectUri and include.logoutRedirectUri %}Then, change the Redirect URI to `{{ include.loginRedirectUri }}` and use `{{ include.logoutRedirectUri }}` for the Logout Redirect URI.
-    {% elsif include.loginRedirectUri %}Then, change the Redirect URI to `{{ include.loginRedirectUri }}` and accept the default Logout Redirect URI of `{{ baseUrl }}`.
-    {% else %}Accept the default Redirect URI values provided for you.{% if include.framework contains "Spring Boot" %} That is, a Login Redirect of `{% if include.adoc %}\{% endif %}http://localhost:8080/login/oauth2/code/okta` and a Logout Redirect of `{% if include.adoc %}\{% endif %}http://localhost:8080`.{% endif %}
+    {% if include.loginRedirectUri and include.logoutRedirectUri %}Then, change the Redirect URI to `{% if adoc %}\{% endif %}{{ include.loginRedirectUri }}` and use `{% if adoc %}\{% endif %}{{ include.logoutRedirectUri }}` for the Logout Redirect URI.
+    {% elsif include.loginRedirectUri %}Then, change the Redirect URI to `{% if adoc %}\{% endif %}{{ include.loginRedirectUri }}` and accept the default Logout Redirect URI of `{% if adoc %}\{% endif %}{{ baseUrl }}`.
+    {% else %}Accept the default Redirect URI values provided for you.{% if include.framework contains "Spring Boot" %} That is, a Login Redirect of `{% if adoc %}\{% endif %}http://localhost:8080/login/oauth2/code/okta` and a Logout Redirect of `{% if adoc %}\{% endif %}http://localhost:8080`.{% endif %}
     {% endif %}
   {% elsif include.type == "native" %}
     {% if include.loginRedirectUri == include.logoutRedirectUri %}
 Use `{{ include.loginRedirectUri }}` for the Redirect URI and the Logout Redirect URI 
-      {% else %}
-Use `{{ include.loginRedirectUri }}` for the Redirect URI and set the Logout Redirect URI to `{{ include.logoutRedirectUri }}`
-    {%- endif -%}
-{%- if include.loginRedirectUri contains 'com.okta.' -%}
-(where `{{ include.loginRedirectUri | remove: 'com.okta.' | remove: ':/callback' | remove: '[http://localhost:8100/callback,' | remove: ']' }}.okta.com` is your Okta domain name). {% endif %}Your domain name is reversed to provide a unique scheme to open your app on a device.
+    {% else %}
+Use `{{ include.loginRedirectUri }}` for the Redirect URI and set the Logout Redirect URI to `{{ include.logoutRedirectUri }}` 
+    {% endif %}
+    {%- if include.loginRedirectUri contains 'com.okta.' -%}
+(where `{{ include.loginRedirectUri | remove: 'com.okta.' | remove: ':/callback' | remove: '[http://localhost:8100/callback,' | remove: ']' }}.okta.com` is your Okta domain name). Your domain name is reversed to provide a unique scheme to open your app on a device.
+    {% else %}.{% endif %}
   {% endif %}
 {% endif %}
 
 {% if include.note %}
 {{ note }}
 {% endif %}
 
+{% capture details %}
 {%- if include.type == "jhipster" -%}
 The Okta CLI streamlines configuring a JHipster app and does several things for you:
 
 1. Creates an OIDC app with the correct redirect URIs: 
-  - login: `{% if include.adoc %}\{% endif %}http://localhost:8080/login/oauth2/code/oidc` and `{% if include.adoc %}\{% endif %}http://localhost:8761/login/oauth2/code/oidc`
-  - logout: `{% if include.adoc %}\{% endif %}http://localhost:8080` and `{% if include.adoc %}\{% endif %}http://localhost:8761`
+  - login: `http://localhost:8080/login/oauth2/code/oidc` and `http://localhost:8761/login/oauth2/code/oidc`
+  - logout: `http://localhost:8080` and `http://localhost:8761`
 2. Creates `ROLE_ADMIN` and `ROLE_USER` groups that JHipster expects
 3. Adds your current user to the `ROLE_ADMIN` and `ROLE_USER` groups
 4. Creates a `groups` claim in your default authorization server and adds the user's groups to it
 
-{% if include.adoc %}NOTE{% else %}**NOTE**{% endif %}: The `{% if include.adoc %}\{% endif %}http://localhost:8761*` redirect URIs are for the JHipster Registry, which is often used when creating microservices with JHipster. The Okta CLI adds these by default. 
+**NOTE**: The `http://localhost:8761*` redirect URIs are for the JHipster Registry, which is often used when creating microservices with JHipster. The Okta CLI adds these by default. 
 
 You will see output like the following when it's finished:
 {%- elsif include.type != "token" -%}
@@ -108,7 +113,7 @@ okta.oauth2.client-secret=NEVER-SHOW-SECRETS
   {% elsif include.type != "token" %}
 Run `cat .okta.env` (or `type .okta.env` on Windows) to see the issuer and credentials for your app.{% if include.type == "jhipster" %} It will look like this (except the placeholder values will be populated):{% endif %}
 
-    {% if include.type == "web" %}
+    {% if include.type == "web" or "service" %}
 ```shell
 export OKTA_OAUTH2_ISSUER="https://dev-133337.okta.com/oauth2/default"
 export OKTA_OAUTH2_CLIENT_ID="0oab8eb55Kb9jdMIr5d6"
@@ -162,13 +167,23 @@ https://developer.okta.com/docs/guides/sign-into-
 {%- endcapture -%}
 
 {%- capture docsLink %}
-{%- if (include.type == "jhipster") -%}{{ jhipsterDocs }}
+{%- if include.type == "jhipster" -%}{{ jhipsterDocs }}
 {%- else -%}{{ oktaDocs }}
 {%- endif -%}
 {%- endcapture -%}
 
+**NOTE**: You can also use the Okta Admin Console to create your {% if include.type == "token" %}token{% else %}app{% endif %}. See [Create a{% if (include.framework == "Angular" or include.type == "token") %}n{% endif %} {{ oktaAppType }}{% if (include.type == "jhipster") %} on Okta{% endif %}]({{ docsLink }}) for more information.
+{% endcapture %}
+
 {% if include.type == "token" %}
-Next, create an API token. Run `okta login` and open the resulting URL in your browser. Log in and go to **Security** > **API** > **Tokens**. Create a new token and store the value somewhere safe. Make sure you don't check it into GitHub!
+{% if adoc %}++++{% endif %}
+{{ details | markdownify }}
+{% if adoc %}++++{% endif %}
+{% else %}
+{% if adoc %}++++{% endif %}
+<details>
+  <summary>What does the Okta CLI do?</summary>
+{{ details | markdownify }}
+</details>
+{% if adoc %}++++{% endif %}
 {% endif %}
-
-{% if include.adoc %}TIP{% else %}**NOTE**{% endif %}: You can also use the Okta Admin Console to create your app. See {% if include.adoc %}{{ docsLink }}{% endif %}[Create a{% if (include.framework == "Angular" or include.type == "token") %}n{% endif %} {{ oktaAppType }}{% if (include.type == "jhipster") %} on Okta{% endif %}]{% unless include.adoc %}({{ docsLink }}){% endunless %} for more information.

_source/_includes/setup/maven.md

@@ -1,10 +1,10 @@
-Run the [Okta Maven Plugin](https://github.com/oktadeveloper/okta-maven-plugin) to register a new account:
+Run the [Okta Maven Plugin](https://github.com/oktadeveloper/okta-maven-plugin) from your app's folder:
 
 ```shell
 ./mvnw com.okta:okta-maven-plugin:register
 ```
 
-If you already have an Okta account registered, use `login` instead of `register`.
+Answer a few questions (name, email, and company), and it will generate a new Okta developer account for you. If you already have an Okta account registered, use `login` instead of `register`.
 
 Then, configure your Spring Boot application to use Okta for authentication:
 

_source/_includes/setup/oidcdebugger.md

@@ -1,5 +1,5 @@
-An easy way to get an access token is to generate one using [OpenID Connect Debugger](https://oidcdebugger.com/). First, you must configure your application on Okta to use OpenID Connect's implicit flow.
+An easy way to get an access token is to generate one using [OpenID Connect Debugger](https://oidcdebugger.com/). {% if include.responseType != "code" %}First, you must configure your application on Okta to use OpenID Connect's implicit flow.
 
 Run `okta login` and open the resulting URL in your browser. Go to the **Applications** section and select the application you just created. Edit its General Settings and add **Implicit (Hybrid)** as an allowed grant type, with access token enabled. Then, add `https://oidcdebugger.com/debug` to the **Login redirect URIs**. Click **Save** and copy the client ID for the next step.
 
-Now, navigate to the [OpenID Connect debugger](https://oidcdebugger.com/) website. Fill in your client ID, and use `https://{yourOktaDomain}/oauth2/default/v1/authorize` for the Authorize URI. The `state` field must be filled but can contain any characters. Select **{{ include.responseType | default: 'token' }}** for the response type.
+Now, navigate to the [OpenID Connect debugger](https://oidcdebugger.com/) website.{% else %}Open the site in a new window or tab.{% endif %} Fill in your client ID, and use `https://{yourOktaDomain}/oauth2/default/v1/authorize` for the Authorize URI. The `state` field must be filled but can contain any characters. Select **{{ include.responseType | default: 'token' }}** for the response type.