Category: OrderCloud

Setup Sitecore OrderCloud headstart with Angular in Ubuntu system the docker way

Working on Linux system after been worked on Windows for 2 decades is always fun.

This blog post is to setup the Sitecore OrderCloud Headstart on Ubuntu the Docker way. As all the images used for the Headstart is are Linux based, this I didn’t find major difference how this is been setup in Windows system apart from few changes while installing Storage Explorer and few other erros which I have noted in this blog post.

Note – use sudo for each command or “sudo i”to run as root.

Ensure node js is installed

This might be required for your local build.

sudo apt update

sudo apt install nodejs

Ensure npm is installed

sudo apt install npm

Ensure docker and docker -compose is installed

See this blog post Install Docker on Linux

sudo snap install docker

sudo apt install docker-compose

Docker Compose

Lets start composing and solve errros that might come ourr way-

sudo docker-compose up -d

npm needs TLS1.2

npm notice Beginning October 4, 2021, all connections to the npm registry – including for package installation – must use TLS 1.2 or higher. You are currently using plaintext http to connect. Please visit the GitHub blog for more information: https://github.blog/2021-08-23-npm-registry-deprecating-tls-1-0-tls-1-1/
npm WARN @ordercloud/headstart-sdk@0.0.0 No repository field.

https://stackoverflow.com/questions/69044064/npm-notice-beginning-october-4-2021-all-connections-to-the-npm-registry-incl

npm cache clear --force

npm set registry=https://registry.npmjs.org/

npm install -g https://tls-test.npmjs.com/tls-test-1.0.0.tgz

Install .Net SDK

Middleware runs on .Net. So this neds to be installed.

https://learn.microsoft.com/en-us/dotnet/core/install/linux-ubuntu

https://devblogs.microsoft.com/dotnet/dotnet-6-is-now-in-ubuntu-2204/

sudo apt-get update && \
sudo apt-get install -y dotnet-sdk-6.0
sudo apt-get update && \
sudo apt-get install -y aspnetcore-runtime-6.0
sudo apt install dotnet6

I found difficulties installing .Net on Ubuntu. You may have todo few restarts.

 docker compose up -d

This should start all the containers. Note- cosmos container takes time to start till then middleware waits and starts when comos is ready.

Comos should be available now –

Install Azure Storage- Explorer

Install Storage explorer in Ubuntu-

snapd should be already installed if you are using Ubuntu 16.04 LTS or later, you may have to update.

sudo apt update
sudo apt install snapd

Install Storage Explorer

sudo snap install storage-explorer

Open Azure Storage Explorer and follow the steps here –

Execute the command-

snap connect storage-explorer:password-manager-service :password-manager-service

Azure Storage Explorer should be able to open with above command.

Apply the same settings mentioned in this blog

Once you have followed and applied the settings mentioned in the blog, should be able to see the translation files in local storage and able to access the file.

We also have to set CQRS for blob container – lets do this later.

Middleware exited with errors-

Error –

See the resolution to this issue here – section – Unable to start Middleware container due to erros

Error – Connection refused (127.0.0.1:8081)

System.AggregateException: One or more errors occurred. (Connection refused (127.0.0.1:8081))
       ---> System.Net.Http.HttpRequestException: Connection refused (127.0.0.1:8081)

See the resolution to this issue here – section – Connection to Comos DB is failing

Error- Unsupported platform

0 18.52 npm ERR! code EBADPLATFORM
#0 18.53 npm ERR! notsup Unsupported platform for fsevents@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
#0 18.53 npm ERR! notsup Valid OS:    darwin
#0 18.53 npm ERR! notsup Valid Arch:  any
#0 18.53 npm ERR! notsup Actual OS:   linux
#0 18.53 npm ERR! notsup Actual Arch: x64

Changed the node version- see the blog here

Also changed the nginx version – see Error 4 here

 => ERROR [headstart-seller:local-linux production 4/8] RUN apk add --update nodejs nodejs-npm && npm install -g json                                                                                 1.0s

see Error 4 here

Change from this  -
RUN apk add --update nodejs nodejs-npm && npm install -g json

to-
RUN apk add --update nodejs npm && npm install -g json
#0 51.97 npm ERR! npm ERR! Cannot read properties of null (reading 'pickAlgorithm')

See the resolution to this error here

Now you should have all containers up and running with

sudo docker compose up -d

If you see this error-

Check for Configure CORS to Blob Containers in this blog post

And here I have Seller, buyer and middleware working on Ubuntu system-

This has really opened the horizon to develop, deploy and maintain OrderCloud solution on a technology agnostic platform.

Loading

Setup Sitecore OrderCloud headstart the docker way

There is quite a lot todo to setup, lets start-

Clone OrderCloud repository for Headstart

Clone the repository for HeadStart from here – https://github.com/ordercloud-api/headstart

Setup/Install Docker

Install Docker Desktop from here – https://docs.docker.com/desktop/

Switch to Linux containers

Stop IIS

Ensure you dont’ have Azurite insalled and listening to 10000, 10001 and 10002 ports

Ensure you dont have Azure Cosmos DB Emulator running on the machine as this will use 8081 port which will also be exposed by cosmos container.

Copy .env.template and save as .env (Will fill in the required details in .env file one by one)

Add the following records to your Hosts file

127.0.0.1 buyer.headstart.localhost

127.0.0.1 seller.headstart.localhost

127.0.0.1 api.headstart.localhost

As this is set in .env file (you may change as per your requirement)

There will be quite a few issues coming our way and will try to note it here one by one and the solution for same-

Execute docker compose

Navigate to the working directory and execute following command-

 docker compose up -d

Following images and containers will be created as part of the headstart setup-

Cosmos DB

Storage (Azurite)

Middleware

Seller App

Buyer App

Error 1- Uncompatible node version

0 2.885 Node.js version v12.20.0 detected.

0 2.885 The Angular CLI requires a minimum Node.js version of either v14.15, or v16.10.

See here how I resolved this error- Uncompatible node version

Error 2- Package installation must use TLS 1.2 or higher and Cannot read properties of null (reading ‘pickAlgorithm’)

0 47.60 npm notice Beginning October 4, 2021, all connections to the npm registry - including for package installation - must use TLS 1.2 or higher. You are currently using plaintext http to connect. Please visit the GitHub blog for more information: https://github.blog/2021-08-23-npm-registry-deprecating-tls-1-0-tls-1-1/

0 114.7 npm ERR! Cannot read properties of null (reading 'pickAlgorithm')

See here how I resolved this error- Package installation must use TLS 1.2 or higher

Errror 3-

#0 2.885 Node.js version v12.20.0 detected.
#0 2.885 The Angular CLI requires a minimum Node.js version of either v14.15, or v16.10.


 > [headstart-buyer:local-linux builder 9/9] RUN cd /build/APP && npm run build --prod:
#0 0.954 npm WARN config production Use `--omit=dev` instead.
#0 0.983
#0 0.983 > headstart@0.0.0 build
#0 0.983 > ng build --configuration=deploy && node scripts/hash-css-files && node scripts/move-release-scripts && node scripts/copy-main-js && node scripts/copy-index-html
#0 0.983
#0 11.70 - Generating browser application bundles (phase: setup)...
#0 16.88 Processing legacy "View Engine" libraries:
#0 17.75 - @ngx-translate/http-loader [es2015/esm2015] (git+https://github.com/ngx-translate/http-loader.git)
#0 18.98 - ngx-forms-typed [es2015/esm2015] (https://github.com/gparlakov/forms-typed)
#0 21.65 Encourage the library authors to publish an Ivy distribution.
#0 109.2 Killed
------
failed to solve: executor failed running [/bin/sh -c cd /build/APP && npm run build --prod]: exit code: 137

Not sure why this error but I ran following command instead-

docker-compose build --no-cache

Error 4 –

cannot write C:\Users\sande\AppData\Local\Temp\tmppxl_v0jp because server did not provide an image ID
ERROR: Service 'buyer' failed to build : Build failed

Solution-

Set the latest nginx alpine base image in the Dockerfile as nginx:1.23.3-alpine. See the latest availabel bae image here – https://hub.docker.com/_/nginx

Change Dockerfile in this location headstart\docker\build\UI

Update nodejs-npm to just npm in the Dockerfile

Dockerfile should look like this-

Sometimes you may have to restart Docker Desktop

Error 5-

Error response from daemon: Ports are not available: exposing port TCP 0.0.0.0:80 -> 0.0.0.0:0: listen tcp 0.0.0.0:80: bind: An attempt was made to access a socket in a way forbidden by its 

The said port might be in use. This is mostly when IIS is running. Stop IIS.

Once you get thhrough these errors, should have following images downloaded and containers created-

Here you can see the warnings compalining few env variable values not set. This is next we are going to setup.

Unable to start Middleware container due to erros-

Also the middleware container has errors- (docker log <<middleware container>>

Unhandled exception. System.Exception: Required app settings are missing: StorageAccountSettings:ConnectionString or StorageAccountSettings:BlobPrimaryEndpoint
2023-03-17 16:28:21    at OrderCloud.Integrations.EnvironmentSeed.Extensions.ServiceCollectionExtensions.AddDefaultTranslationsProvider(IServiceCollection services, StorageAccountSettings storageAccountSettings) in /src/Middleware/integrations/OrderCloud.Integrations.EnvironmentSeed/Extensions/ServiceCollectionExtensions.cs:line 16

Check the Cosmos DB if its working on http://127.0.0.1:8081/_explorer/index.html

Error 6- Check the COMOS DB evaluation period-

Stop and delete the COSMOS DB container and delete the image

Compose the containers again and should pull the image and start the COSMOS DB container again.

Error 7-

This is a timezone issue. Check this form ore detials-

https://askubuntu.com/questions/1096930/sudo-apt-update-error-release-file-is-not-yet-valid

Error 8-

failed to solve: process "/bin/sh -c apk add --update nodejs nodejs-npm && npm install -g json" did not complete successfully: exit code: 1

Update docker to use this command instead-

RUN apk add --update nodejs npm && npm install -g json

Install and Setup Account in Microsoft Azure Storage Explorer

See blof here – How to setup Storage Explorer for Sitecore OrderCloud Headstart Docker

Update the .env file-

Update StorageAccountSettings_ConnectionString to –

change storage to 127.0.0.1 in the connections tring

DefaultEndpointsProtocol=http;AccountName=devstoreaccount1;AccountKey=Eby8vdM02xNOcqFlqUwJPLlmEtlCDXJ1OUzFT50uSRZ6IFsuFq2UVErCz4I6tq/K1SZFPTOtr/KBHBeksoGMGw==;BlobEndpoint=http://127.0.0.1:10000/devstoreaccount1;QueueEndpoint=http://127.0.0.1:10001/devstoreaccount1;

Update StorageAccountSettings_HostUrl to –

http://127.0.0.1:10000/devstoreaccount1

Ensure the StorageAccountSettings_Key is correct –

Eby8vdM02xNOcqFlqUwJPLlmEtlCDXJ1OUzFT50uSRZ6IFsuFq2UVErCz4I6tq/K1SZFPTOtr/KBHBeksoGMGw==

For any environment changes use “docker compose down” and then “docker compose up -d”

Compile/Build the Headstart.sln

In the ServiceCollectionExtensions.cs file in OrderCloud.Integrations.EnvironmentSeed project

remove the condition for checking the BlobPrimaryEndpoint as it is not used and hence not required.

Same way if you are not using ExchangeRates, Tax Provider, payment Provider etc remove the values from .env file to avoid such errors. Following I have removed, you can add this later as and when required. Make the values for this variables empty


EnvironmentSettings_AddressValidationProvider=""
EnvironmentSettings_CurrencyConversionProvider=""
EnvironmentSettings_EmailServiceProvider=""
EnvironmentSettings_PaymentProvider=""
EnvironmentSettings_ShippingProvider=""
EnvironmentSettings_TaxProvider=""
EnvironmentSettings_OMSProvider=""

Recreate the middleware and container again. Delete the middleware image as the code is changes. We dont have the volume mounted hence for setup this way 🙂

docker rmi <<middleware image id>>

docker compose up -d

More errors-

Connection to Comos DB is failing-

2023-03-17 18:16:43 Application startup exception: System.AggregateException: One or more errors occurred. (Connection refused (127.0.0.1:8081))
2023-03-17 18:16:43  ---> System.Net.Http.HttpRequestException: Connection refused (127.0.0.1:8081)
2023-03-17 18:16:43  ---> System.Net.Sockets.SocketException (111): Connection refused

Change CosmosSettings_EndpointUri in .env from “http://127.0.0.1:8081” to use localhost i.e.- change to –

CosmosSettings_EndpointUri="http://localhost:8081"

Address not available (localhost:8081) – Cosmos DB address not available

2023-03-17 18:22:34 Application startup exception: System.AggregateException: One or more errors occurred. (Address not available (localhost:8081))
2023-03-17 18:22:34  ---> System.Net.Http.HttpRequestException: Address not available (localhost:8081)
2023-03-17 18:22:34  ---> System.Net.Sockets.SocketException (99): Address not available

Solution-

Change following in entrypoing.sh file located at – headstart\docker\build\middleware

i.e. instead of using $CosmosSettings_EndpointUri use $CosmosEndpointURI

this varaible contains the IP address of the comos db hosted. This can change everytime the container is created.

Change this - 
-e "this['CosmosSettings:EndpointUri']='$CosmosSettings_EndpointUri'" 
to 
-e "this['CosmosSettings:EndpointUri']='$CosmosEndpointURI'"

Recreate the middleware image.

Now all the containers should be up and running

Middleware API is accessible at – http://api.headstart.localhost/index.html

Seed the OrderCloud Marketplace-

Create a Marketplace in OrderCloud portal-

Send post request to – http://api.headstart.localhost/seed

Request body should be, also see the template here –

https://github.com/ordercloud-api/headstart/blob/development/assets/templates/SeedTemplate.json

{
  "Portal": {
    "Username": "your-portal-email@address.com",
    "Password": "XXXXXXXXX"
  },
  "Marketplace": {
    "Environment": "sandbox",
    "Region": "Us-West",
    "ID": "ocdockerway",
    "Name": "ocdockerway",
    "InitialAdmin": {
      "Username": "demoadminuser",
      "Password": "XXXXXXXXX"
    },
    "EnableAnonymousShopping": true,
    "MiddlewareBaseUrl": "http://api.headstart.localhost",
    "WebhookHashKey": "hashkey"
  }
}

Error- “Message”: “Could not find a part of the path ‘/app/wwwroot\\i18n’.”,

Tried to debug this and seems some how the path is not correctly formed to upload the translations from /app/wwwroot\\i18n folder in container. Changed this to /app/wwwroot/i18n and the files are now uploaded to storage.

"Message": "Connection refused (127.0.0.1:10000)",

Should now see the API Client created in OrderCloud-

Configure .env post seed

TRANSLATE_BLOB_URL="http://127.0.0.1:10000/devstoreaccount1/ngx-translate/i18n/"
BLOB_STORAGE_URL="http://127.0.0.1:10000/devstoreaccount1"
SELLER_CLIENT_ID="Enter the Default Headstart Admin UI Client ID"
BUYER_CLIENT_ID="Enter the Default Buyer Storefront Client ID"

OrderCloudSettings_MiddlewareClientID="Enter Middleware Integrations ClientID"
OrderCloudSettings_MiddlewareClientSecret="Enter Middleware Integrations secret"
OrderCloudSettings_ClientIDsWithAPIAccess="SELLER_CLIENT_ID, BUYER_CLIENT_ID"
OrderCloudSettings_MarketplaceID="Enter Marketplace ID" // ocdockerway
OrderCloudSettings_MarketplaceName="Enter Marketplace Name"

After setting the .env variables lets spin up the containers again-

docker compose up -d

Lets try to access http://seller.headstart.localhost/

Error-

In Buyer.sh and Seller.sh – -test.json update the supported language. This is a array but assigned as a string-

Change from this -
-e "this.supportedLanguages='$SUPPORTED_LANGUAGES'"

to

-e "this.supportedLanguages=$SUPPORTED_LANGUAGES" //Remove single quotes

Recreate Image and container for Seller and Buyer.

Now its loading Seller and Buyer app but wiht errors-

Configure CORS to Blob Containers

Following values in –

Allowed Origins- http://api.headstart.localhost

Also add this for the Seller and Buyer app url’s

Allowed Headers – x-ms-meta-data,x-ms-meta-target,x-ms-meta-abc

Exposed Headers – x-ms-meta-*

Following is the CORS added to Blob Containers-

Finally we have Seller and Buyer app loading without any errors-

Next start populating Catalog, Products etc.

Hope this blog is useful for setting the OrderCloud Headstart setup the dockerway

Loading

OrderCloud Headstart Docker Setup – Install and Setup Account in Microsoft Azure Storage Explorer

Ensure Storage container is running we should be able to access the storage on certian ports and configure the CORS etc.

Install the Storage Explorer from here – https://azure.microsoft.com/en-us/products/storage/storage-explorer/

Connect to Local storage emulator

Connect to Azure Storage (local storage)

Once connected it should show in Emulator-

Create a Blob Container – ngx-translate and create new Virtual Directory i18n

Blob Container and folder name can be any other name. You need to configure this correctly in UI config. See this in later steps

Upload the translation file(optional)

Translation file should be created by Headstart Api while seeding the marketplace further in this blog. This is a test to check if the resource is available. I have attached en.json file here.

Copy URL of the file and check if this is accessible-

Looks like cannot access.

To resolve this error set public access level on Blob container “ngx-translate”

Select Public read access for container and blobs-

Now the resource should be accessible.

Similarly upload resources for fr and jp language.

The resource file should be available in following location – headstart\src\Middleware\src\Headstart.API\wwwroot\i18n

Loading

OrderCloud Headstart Docker Setup Error – uncompatible node version

0 2.885 Node.js version v12.20.0 detected.

0 2.885 The Angular CLI requires a minimum Node.js version of either v14.15, or v16.10.

It looks like in docker compose file for buyer and seller node version configured are old.

Update the following in docker-compose.yml. At the time of writing this blog the node version is 18.13.0. See here for latest- https://hub.docker.com/_/node

This should resolve the error.

Loading

Index and Search OrderCloud Extended Properties

This article explains usage of extended properties in OrderCloud-

https://ordercloud.io/knowledge-base/extended-properties

But it doesn’t tell about how to index the extended properties to get the search results.

This blog post helps to setup the XP Indices feature already available with the OrderCloud and search such properties.

This example shows extended properties for Categories for which first Catalog needs to setup

1. Create Catalog from Portal (Assume Marketplace is already created)-

Navigate to Product Catalogs => Catalog => Select an operation “Create a new catalog”

Use below JSON or fill in form to create catalog

{
  "ID": "0001",
  "Active": true,
  "Name": "HabitatMaster",
  "Description": "HabitatMaster"
}

Catalog will be created with 201 status

2. Create Catagories from Portal with reference to Catalog Id created previously-

Navigate to Product Catalogs => Categories=> Select an operation “Create a new category”

Use below JSON to create catqagory for Catalog “0001” with the extended property “DisplayType” as “Text”

{
  "ID": "0001-CategoryDisplayText",
  "Active": true,
  "Name": "CategoryDisplayText",
  "Description": "CategoryDisplayText",
  "xp": {
    "DisplayType": "Text"
  }
}

Likewise create another catagory with DisplayType Image as per below JSON-

{
  "ID": "0001-CategoryDisplayImage",
  "Active": true,
  "Name": "CategoryDisplayImage",
  "Description": "CategoryDisplayImage",
  "xp": {
    "DisplayType": "Image"
  }
}

3. Search Category with newly created extended property i.e. DisplayType

First search all categories with Catalog Id “0001”. Following results will be shown-

Now lets try and search with extended properties i.e. Catalog Id “0001” and DisplayType as Text. For this use “Add Filter” option and key as “xp.DisplayType” and Filter Value as “Text”.

This request wont show any results and hence Xp Indices needs to created for Category

4. Create XP Indices

Navigate to Seller => Xp Indices

Indexable resources Catagory “Add Index” => “xp.DisplayType” and Save Changes

Now search the Catagories same as in Step 3 with Filter option and this time you should be able to see the results-

Setup Sitecore OrderCloud Headstart Buyer UI App – Part 4

Part 1 using offline Azure resource and Part 1 using online Azure resources gives a walkthrough on setting Sitecore Ordercloud Headstart pre-requisites. While Part 2 helps setup middleware.

Part 3 helps setup Seller UI App

In this blog will setup Buyer UI

Step 1- Setup the Buyer UI project

If you have followed earlier steps to setup Seller UI App you must have already installed node js.

Open the BuyerUI project in Visual Studio Code (prefered) from /src/UI/Buyer folder

Step 2 – Change configuration defaultbuyer-test.json

Navigate to \src\UI\Buyer\src\assets\appConfigs\defaultbuyer-test.json

Update the clientID to your Marketplace Buyer UI client ID

Update baseUrl e.g.:- http://localhost:4300

Update middlewareUrl. If you are in local update this to – https://localhost:5001

Update translateBlobUrl e.g.:- http://127.0.0.1:10000/devstoreaccount1/ngx-translate/i18n/

Step 3 – Change configuration environment.local.ts

Update the useLocalMiddleware to true if this is locally setup

Update localMiddlewareURL to https://localhost:5001

Update localBuyerApiClient, same as in the previous step

Step 4 – Run the Buyer UI application

RUN – from the visual studio terminal or powershell

npm install
np run start

This should compile successfully and ;listen to 4300 port

Headstart Buyer application- http://localhost:4300

Setup Sitecore OrderCloud Headstart Seller UI – Part 3

Part 1 using offline Azure resource and Part 1 using online Azure resources gives a walkthrough on setting Sitecore Ordercloud Headstart pre-requisites. While Part 2 helps setup middleware.

In this blog we are setting the Sitecore Ordercloud Headstart UI for Seller

Step 1- Setup the UI project

Install node js – https://nodejs.org/en/download/

Open the Seller UI project in Visual Studio Code (prefered) from /src/UI/Seller folder

Step 2 – Change configuration defaultadmin-test.json

Navigate to – \src\UI\Seller\src\assets\appConfigs\defaultadmin-test.json

Change the highlighted values-

Change Client ID

This is a Seller Client ID. In Part 1 response to the seed also provided Seller Client ID.Use the same clinet id here

OR

Goto the marketplace you have created earlier and API Client to copy the Default HeadStart Admin UI ID

Copy the ID in clientID below-

{
  "hostedApp": true,
  "marketplaceID": "ocdockertest",
  "marketplaceName": "Default Admin",
  "appname": "Default Admin",
  "clientID": "your-seller-client-id",
  "middlewareUrl": "https://localhost:5001",
  "translateBlobUrl": "http://127.0.0.1:10000/devstoreaccount1/ngx-translate/i18n/",
  "supportedLanguages": ["en", "fr", "jp"],
  "defaultLanguage": "en",
  "blobStorageUrl": "http://127.0.0.1:10000/devstoreaccount1",
  "orderCloudApiUrl": "https://sandboxapi.ordercloud.io"
}

Change the storage account created in Step 1

Keep everything else as is or you may change as per your configuration.

Step 3 – Change/Check the configuration environment.local.json

Navigate to \src\UI\Seller\src\environments\environment.local.ts

Change/Check useLocalMiddleware=true if not already set.

Change/Check localMiddlewareURL = ‘https://localhost:5001’

Step 4 – Setup the App Configuration either using appSettings or Azure App Configuration

Setup a App Configuration using appSettings.json

Use/Download the template here provided by Sitecore to setup the configuration

Create a json file on your local machine by copying the content in the template. In my case I have created OCHeadstartConfig.json. The template looks as below- Highlighted values are the minimum configuration required for Headstart project. Few of the configuration will come from the Seed step explained in Part-2Step 4 – Populate Ordercloud Markeplace with the seed request

Following configuration(highlighted) needs to be updated minimum to get the Headstart project working-

OrderCloudSettings:MiddlewareClientID

OrderCloudSettings:MiddlewareClientSecret

OrderCloudSettings:MarketplaceID

OrderCloudSettings:MarketplaceName

{
"ApplicationInsightsSettings:InstrumentationKey": "",
"AvalaraSettings:AccountID": "0",
"AvalaraSettings:BaseApiUrl": "https://sandbox-rest.avatax.com/api/v2",
"AvalaraSettings:CompanyCode": "",
"AvalaraSettings:CompanyID": "0",
"AvalaraSettings:LicenseKey": "",
"CardConnectSettings:Authorization": "",
"CardConnectSettings:AuthorizationCad": "",
"CardConnectSettings:BaseUrl": "cardconnect.com",
"CardConnectSettings:CadMerchantID": "",
"CardConnectSettings:Site": "fts-uat",
"CardConnectSettings:UsdMerchantID": "",
"CosmosSettings:DatabaseName": "",
"CosmosSettings:EnableTcpConnectionEndpointRediscovery": "false",
"CosmosSettings:EndpointUri": "",
"CosmosSettings:PrimaryKey": "",
"CosmosSettings:RequestTimeoutInSeconds": "15",
"EasyPostSettings:APIKey": "",
"EasyPostSettings:FreeShippingTransitDays": "3",
"EasyPostSettings:NoRatesFallbackCost": "20",
"EasyPostSettings:NoRatesFallbackTransitDays": "3",
"EnvironmentSettings:AppTimeoutInSeconds": "30",
"EnvironmentSettings:BuildNumber": "",
"EnvironmentSettings:Commit": "",
"EnvironmentSettings:Environment": "Test",
"EnvironmentSettings:MiddlewareBaseUrl": "",
"EnvironmentSettings:TaxProvider": "Avalara",
"FlurlSettings:TimeoutInSeconds": "40",
"OrderCloudSettings:ApiUrl": "https://sandboxapi.ordercloud.io",
"OrderCloudSettings:IncrementorPrefix": "DB_TEST",
"OrderCloudSettings:MarketplaceID": "<<market place id >>",
"OrderCloudSettings:MarketplaceName": "<<market place name>>",
"OrderCloudSettings:MiddlewareClientID": "<<Middleware ClientId>>",
"OrderCloudSettings:MiddlewareClientSecret": "<<middleware client secret>>",
"OrderCloudSettings:WebhookHashKey": "<<webhook key>>",
"OrderCloudSettings:ClientIDsWithAPIAccess": "<<Enter the Seller or Buyer ClientID's sperated with comma>>"
"SendGridSettings:ApiKey": "",
"SendgridSettings:BillingEmail": "",
"SendgridSettings:CriticalSupportEmails": "",
"SendgridSettings:CriticalSupportTemplateID": "",
"SendgridSettings:FromEmail": "",
"SendgridSettings:LineItemStatusChangeTemplateID": "",
"SendgridSettings:NewUserTemplateID": "",
"SendgridSettings:OrderSubmitTemplateID": "",
"SendgridSettings:PasswordResetTemplateID": "",
"SendgridSettings:ProductInformationRequestTemplateID": "",
"SendgridSettings:QuoteOrderSubmitTemplateID": "",
"SendgridSettings:SupportCaseEmail": "",
"SmartyStreetSettings:AuthID": "",
"SmartyStreetSettings:AuthToken": "",
"SmartyStreetSettings:RefererHost": "",
"SmartyStreetSettings:WebsiteKey": "",
"StorageAccountSettings:BlobContainerNameCache": "cache",
"StorageAccountSettings:BlobContainerNameExchangeRates": "currency",
"StorageAccountSettings:BlobContainerNameQueue": "queue",
"StorageAccountSettings:BlobContainerNameTranslations": "ngx-translate",
"StorageAccountSettings:BlobPrimaryEndpoint": "http://127.0.0.1:10000/devstoreaccount1",
"StorageAccountSettings:ConnectionString": "<<copy Connectionstring from Storage explorer >>",
"UI:BaseAdminUrl": "",
"ZohoSettings:AccessToken": "",
"ZohoSettings:ClientId": "",
"ZohoSettings:ClientSecret": "",
"ZohoSettings:OrgID": "",
"ZohoSettings:PerformOrderSubmitTasks": "false"
}

Get the StorageAccount.Settings.ConnectionString from Storage Explorer-

Create appSettings.json file and copy the above configuration in the file.

appSettings.json file should be in Headstart.API project-

IMP – Check if the middleware applicaiton is running and listening to localhsot 5001 port. If not you should run the Headstart.Api before running UI application.

Setup a App Configuration using Azure App Configuration

Get the configuration connection string

Goto the Access Keys – Read-only keys tab and copy the connection string

Add a new Environment Variable named – APP_CONFIG_CONNECTION and copy the connection string in the Value.

Run the middleware application with the Demo profile.

IMP – If you see compiler error’s whilst running the application. See this blog for the resolution.

Step 5 – Run the Seller UI application

Now that we have all the required configuration checked and changed, time to run the Seller UI application

RUN – from the visual studio terminal or powershell

npm install
npm run start

Now we have Seller application runing on localhost:4200 port

Provide Admin Username and Password as noted in Part -1 of the blog Step 3- Prepare Seed Request

After successful login-

Also we can see the Seller Admin-

Hope you enjoyed setting Sitecore Ordercloud Headstart 🙂

Setup Sitecore OrderCloud Headstart Project – Part 2

This blog will walkthrough step by step to setup OrderCloud Headstart Solution on your development machine.

You may want to first see Part 1 with Azurite or through Azure resources

Headstart project and instructions are here

In this blog we are setting the Sitecore Ordercloud Headstart middleware

Step 1- Create a Sitecore OrderCloud Marketplace

See this blog to setup the OrderCloud Marketplace

Create a new maketplace e.g.- OrderCloudHeadstart in Us-West region

IMP– At the time this blog was written looks like only Us-West region is supported when a seed request is sent. This may change in future but connect to OrderCloud team is you want this to be in region other than Us-West

Note the newly created Marketplace ID – in my case it is – OrderCloudHeadstart

If you havent provided the Marketplace ID whilst creating the OrederCloud will create once for you. You can find the same in the Marketplace.

Navigate to API Console and Get the Admin User, as you see there are no Admin users. You may also check other endpoints.

Step 2 – Setup Middleware

Clone headstart repository – https://github.com/ordercloud-api/headstart.git

Open Headstart.sln in src/Middleware. I am using Visual Studio 2019.

Open Headstart.API project proerties

Create a new Debug Profile for Headstart.Api project. Set this as Start project.

Run the Headstart.Api project and should listen to localhost 5000 and 5001 port

Step 3- Prepare Seed Request

Open postman and create a new Post request to – https://localhost:5001/seed

Use the below request body –

{
  "Portal": {
    "Username": "username@company.com",
    "Password": "XXXXXXXXXXXXXXXX"
  },
  "Marketplace": {
    "Environment": "sandbox",
    "Region": "Us-West",
    "ID": "your-marketplace-id",
    "Name": "your-marketplace-name",
    "InitialAdmin": {
      "Username": "adminuser",
      "Password": "XXXXXXXXXX"
    },
    "EnableAnonymousShopping": true,
    "MiddlewareBaseUrl": "http://localhost:5000",
    "WebhookHashKey": "hashkey"
  }
}

PortalUsername – enter the portal username you used to create a marketplace

PortalPassword – enter the portal password you used to create a marketplace

InitialAdminUsername – this request will create a admin user. Enter the admin username you wish to create

InitialAdminPassword – enter the admin password you want to set

MiddlewareBaseUrl – this is not required for local build

MarketplaceID – Enter the Marketplace ID you created in Step 1

Marketplace.Region– enter this to be sandbox in this case. For the other environments you might want to user different values for Staging and Production

WebhookHashKey – Set the webhook haskey to secure your webhook request.

Postman request should look like this –

STEP 4 – Setup a App Configuration using appSettings.json

Use/Download the template here provided by Sitecore to setup the configuration

Create a json file on your local machine by copying the content in the template. In my case I have created OCHeadstartConfig.json. The template looks as below- Highlighted values are the minimum configuration required for Headstart project.

Following configuration(highlighted) needs to be updated minimum to send the seed request working-

StorageAccountSettings:ConnectionString

StorageAccountSettings:HostUrl

StorageAccountSettings:Key

{
 "StorageAccountSettings:ConnectionString": "DefaultEndpointsProtocol=http;AccountName=devstoreaccount1;AccountKey=Eby8vdM02xNOcqFlqUwJPLlmEtlCDXJ1OUzFT50uSRZ6IFsuFq2UVErCz4I6tq/K1SZFPTOtr/KBHBeksoGMGw==;BlobEndpoint=http://127.0.0.1:10000/devstoreaccount1;QueueEndpoint=http://127.0.0.1:10001/devstoreaccount1;",
  "StorageAccountSettings:ContainerNameCache": "cache",
  "StorageAccountSettings:ContainerNameExchangeRates": "",
  "StorageAccountSettings:ContainerNameTranslations": "ngx-translate",
  "StorageAccountSettings:ContainerNameQueue": "queue",
  "StorageAccountSettings:HostUrl": "http://127.0.0.1:10000/devstoreaccount1",
  "StorageAccountSettings:Key": "Eby8vdM02xNOcqFlqUwJPLlmEtlCDXJ1OUzFT50uSRZ6IFsuFq2UVErCz4I6tq/K1SZFPTOtr/KBHBeksoGMGw=="
}

Get the StorageAccount.Settings.ConnectionString from Storage Explorer-

Create appSettings.json file and copy the above configuration in the file.

appSettings.json file should be in Headstart.API project-

IMP – Check if the middleware applicaiton is running and listening to localhsot 5001 port. If not you should run the Headstart.Api before running UI application.

Step 5 – Send the seed request to Ordercloud Markeplace

Ensure the Headstart Api is running and listening to 5001 port as mentioned in Step 2

Send the seed request

You can see the same in application that is listening to 5001 port the request was sent to-

If you have set the request correctly you should receive the success response-

IMP – Note the below response and the request that was sent specifically Admin Username and Password as this will be required later when configuring the UI application

{
    "Comments": "Success! Your environment is now seeded. The following clientIDs & secrets should be used to finalize the configuration of your application. The initial admin username and password can be used to sign into your admin application",
    "MarketplaceName": "ocdockertest",
    "MarketplaceID": "ocdockertest",
    "OrderCloudEnvironment": "Sandbox",
    "ApiClients": {
        "Middleware": {
            "ClientID": "1141E496-8517-4953-809B-XXXXXXXXX",
            "ClientSecret": "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
        },
        "Seller": {
            "ClientID": "6E98D7A1-35E9-4156-B60B-XXXXXXXXXX"
        },
        "Buyer": {
            "ClientID": "E1EBE13C-CC74-4021-B4A9-XXXXXXXXXX"
        }
    },
    "Success": true,
    "Exception": null
}

Comments – seed response comments

MarketplaceName – gets the Marketplace name that was configured in Step 1

MarketplaceID – UniqueId that was sent as part of request and the data seeded in this Marketplace

OrderCloudEnvironment – Environment where the request was sent

ApiClients.Middleware.ClientID – Note down Middleware ClientID

ApiClients.Middleware. ClientSecret – Note down Middleware ClientSecret

ApiClients.Seller.ClientID – Note down the Seller ClientID

ApiClients.Buyer.ClientID – Note down the Buyer ClientID

Step 5- Check the Marketplace for the data been puplated

In Step 1- we saw there was not admin user created. After the seed request you can see the Admin User is created with the name mentioned in request.

Admin User

InitialAdminUser with the username provided in request is created

Also the MiddlewareIntegrationsUser is created

Buyer User

Buyer User is created-

Api Clients

Api clients created and the same was sent as response. This is used so each client have a different Id’s that helps any application to connect.

Errors-

Ensure the StorageAccountSettings:HostUrl and ConnectionString is configured correctly.

Thats it in this blog. Hope you are enjoying setting your Ordercloud Headstart project.

Loading

Setup Sitecore OrderCloud Headstart project using Azure Resources – Part 1

Follow below steps to configure Sitecore Ordercloud Headstart middleware using Azure Resources

Step 1 – Setup a Azure App Configuration

Since we will be now setup a backend application (i.e. admin etc) the Client IDs and Client Secret that was create in Step 5 needs to be secured. This can be condifured in Azure App Configuration. See the link on how to setup this.

Use/Download the template here provided by Sitecore to setup the configuration

Create a json file on your local machine by copying the content in the template. In my case I have created OCHeadstartConfig.json. The template looks as below-

{
    "ApplicationInsightsSettings:InstrumentationKey": "",
    "AvalaraSettings:AccountID": 0,
    "AvalaraSettings:CompanyCode": "",
    "AvalaraSettings:CompanyID": 0,
    "AvalaraSettings:LicenseKey": "",
    "AvalaraSettings:BaseApiUrl": "https://sandbox-rest.avatax.com/api/v2",
    "StorageAccountSettings:ConnectionString": "",
    "StorageAccountSettings:BlobPrimaryEndpoint": "",
    "StorageAccountSettings:BlobContainerNameQueue": "queue",
    "StorageAccountSettings:BlobContainerNameCache": "cache",
    "StorageAccountSettings:BlobContainerNameExchangeRates": "currency",
    "StorageAccountSettings:BlobContainerNameTranslations": "ngx-translate",
    "CardConnectSettings:Authorization": "",
    "CardConnectSettings:AuthorizationCad": "",
    "CardConnectSettings:BaseUrl": "cardconnect.com",
    "CardConnectSettings:CadMerchantID": "",
    "CardConnectSettings:Site": "fts-uat",
    "CardConnectSettings:UsdMerchantID": "",
    "CosmosSettings:DatabaseName": "",
    "CosmosSettings:EnableTcpConnectionEndpointRediscovery": "false",
    "CosmosSettings:EndpointUri": "",
    "CosmosSettings:PrimaryKey": "",
    "CosmosSettings:RequestTimeoutInSeconds": "15",
    "EasyPostSettings:APIKey": "",
    "EasyPostSettings:FreeShippingTransitDays": "3",
    "EasyPostSettings:NoRatesFallbackCost": "20",
    "EasyPostSettings:NoRatesFallbackTransitDays": "3",
    "EnvironmentSettings:AppTimeoutInSeconds": "30",
    "EnvironmentSettings:MiddlewareBaseUrl": "",
    "EnvironmentSettings:BuildNumber": "",
    "EnvironmentSettings:Commit": "",
    "EnvironmentSettings:Environment": "Test",
    "EnvironmentSettings:TaxProvider": "Avalara",
    "FlurlSettings:TimeoutInSeconds": "40",
    "OrderCloudSettings:ApiUrl": "https://sandboxapi.ordercloud.io",
    "OrderCloudSettings:MiddlewareClientID": "",
    "OrderCloudSettings:MiddlewareClientSecret": "",
    "OrderCloudSettings:IncrementorPrefix": "DB_TEST",
    "OrderCloudSettings:WebhookHashKey": "",
    "OrderCloudSettings:MarketplaceID": "",
    "OrderCloudSettings:MarketplaceName": "",
    "SendGridSettings:ApiKey": "",
    "SendgridSettings:FromEmail": "",
    "SendgridSettings:CriticalSupportEmails": "",
    "SendgridSettings:SupportCaseEmail": "",
    "SendgridSettings:BillingEmail": "",
    "SendgridSettings:OrderSubmitTemplateID": "",
    "SendgridSettings:OrderApprovalTemplateID": "",
    "SendgridSettings:LineItemStatusChangeTemplateID": "",
    "SendgridSettings:QuoteOrderSubmitTemplateID": "",
    "SendgridSettings:NewUserTemplateID": "",
    "SendgridSettings:ProductInformationRequestTemplateID": "",
    "SendgridSettings:PasswordResetTemplateID": "",
    "SendgridSettings:CriticalSupportTemplateID": "",
    "SmartyStreetSettings:AuthID": "",
    "SmartyStreetSettings:AuthToken": "",
    "SmartyStreetSettings:RefererHost": "",
    "SmartyStreetSettings:WebsiteKey": "",
    "UI:BaseAdminUrl": "",
    "ZohoSettings:AccessToken": "",
    "ZohoSettings:ClientId": "",
    "ZohoSettings:ClientSecret": "",
    "ZohoSettings:OrgID": "",
    "ZohoSettings:PerformOrderSubmitTasks": "false"
  }

Select the subscription and Resource group

Provide the Resource name in this case I have used OrderCloudHeadStartConfig

Select Location and Pricing tier.

Once the resource is created in the Import/Export option select –

Source service – Configuration file

For language – Other

File type- Json

Source file – *.json (auto selected)

Select the folder icon in Source file option and click Apply to import the configuration.

After the config file is imported navigate to “Configuration Explorer”. There are 63 config key values are imported but in template there are 64.

“SendgridSettings:OrderApprovalTemplateID”: “”, is not imported for due to some reason. Create a new manually if required. For the Demo this is not required.

Click on the values to see the values of the key that was imported-

Set the following values by Right clicking the keys. Copy this from Step 4 where the response was received from seed request-

OrderCloudSettings:MiddlewareClientID

OrderCloudSettings:MiddlewareClientSecret

OrderCloudSettings:MarketplaceID

OrderCloudSettings:MarketplaceName

Continue updating config in next section for Storage Account.

Step 2- Create a Azure Storage Account (if you already don’t have)

Create a Azure Storage Account

Follow the steps and set the configuration as per your requirements

Copy the storage account name and Storage connection string

Set StorageAccountSettings:BlobPrimaryEndpoint – https://yourstorageaccount.blob.core.windows.net/occontainer

Set StorageAccountSettings:ConnectionString

Thats in in this blog. In next blog will cover setting up the UI project.

Hope you are enjoying setting your Ordercloud Headstart project.