Mystery Inc. CRM Demo

Genesys Cloud Integrations Embeddable Framework
1

I am trying to setup the Mystery Inc. CRM Demo and I cannot get it to work with the Embeddable Framework. Can someone let me know what the settings in the CRM application should be to get the integration to function please? Here is what I have:

Deployment Env: Private Embeddable Framework
Framework Name: What should go here?
Everything else is not selected.
Purecloud ENV: mypurecloud.com

I have installed the Private PureCloud Embeddable Framework application in my PureCloud Organization.

I have uploaded the framework.js file from the Mystery Inc. public folder to the integration and activated the organization.

What am I missing?

2

If you review the framework.js file, you'll see that it is pulling a lot of information from the parent application. Following the steps in the readme, you'll need to complete the name, clientID, etc.; these are all defined parameters that the framework.js file attempts to gather from the parent application:

Configure the application.
a. Click the gear icon.
b. Edit the following required fields:

  • Deployment Environment : Select the correct PureCloud Embeddable Framework deployment environment for your integration.
  • Framework Name : Add a unique name for your integration.
  • PureCloud Environment : Indicate the region where your PureCloud organization is located.
    For a list of values, see property names under clientIds (Developer Center).
  • PureCloud Client ID : Add the Client ID from the OAuth client that you created in PureCloud.
    For more information about the OAuth client, see Prerequisites.

c. (Optional) Edit the other fields. For more information about these fields, see the PureCloud Embeddable Framework documentation in the Developer Center.
d. To save your changes, click the disk icon.

3

Thanks! Yes, I did take a look at the readme and framework files in the Mystery Inc project. And, I did look at the framework.js file in the PureCloud Embeddable Framework example.

Deployment Environment: Because I am running the Mystery Inc. CRM on my desktop, I selected Private Embeddable Framework.

Framework Name: MysteryTest

ClientId for Private Embeddable Framework: Checked

Purecloud ENV: mypurecloud.com

Purecloud ClientId: Copied Client ID from OAuth Client (Token Implicit Grant (Browser)), Authorized redirect URI: http://localhost:4200/

I left all the other options unchecked. I clicked the save icon.

When I click on the Phone Icon, a blank window pop up appears and then nothing happens - it stays blank. No spinner, no login prompt, just blank.

I even completely stopped/exited ember and then restarted it to confirm that my changes were saved. But still no luck.

4

if you're only running from your local machine, then the deployment environment needs to be set to "local".

If you want to test out a private deployment, you'll need to install the Private Embeddable Framework integration, then upload the framework.js file from the public folder to the integration, then enable the integration. Once this is done, set the Deployment Environment in the Mystery CRM to "Private", save the settings, then refresh your page.

5

Okay, so I decided to take a step back and just try and see if I could get the "Generic" Embeddable Framework Example up and running (https://github.com/trcawthorn2/PureCloudEmbeddableFrameworkExample).

The first thing I did was remove all of the OAuth clients and integrations from our PureCloud Org. Following the documentation, I set everything up as documented: Setup OAuth Client, modified the framework.js file in the Example to add my OAuth Client ID, added the PC Framework integration to our Org, and uploaded the framework.js file.

And... the example didn't work either.

After much digging around the projects and documentation, I found that the documentation regarding the Framework on help.mypurecloud.com is not correct for creating the OAuth client. Specifically, it tells you to use http://mypurecloud.com/crm/index.html as the redirect URI. Once I changed the URI to https://apps.mypurecloud.com/crm/index.html (adding the s to http and apps in the URL) the Framework Example worked. I notified the team about the URL.

When I restarted the Mystery Inc. CRM demo and clicked the phone icon, much to my surprise, I was logged into PureCloud and everything was functioning BUT I didn't set any of the configuration settings in the application (all settings were blank/default) AND I did not upload the framework.js file for the Mystery Inc. CRM to my PureCloud Organization.

Now, my question is how and why is this working?

One thing that I noticed is that the cti-services.js file sets the environment to the Private Embeddable Framework by default:

else return https://apps.${region}/crm/embeddableFramework.html?parentDomain=${domain};

So, maybe, the Mystery Inc. CRM is re-using the Integration and the framework.js file that I uploaded to get the Framework Demo to work? Sorry, just trying to understand fully how this should and can be used. I appreciate everyone's assistance.

6

I think you're overthinking this.

The Mystery CRM example is meant to be a "from scratch" implementation. You're meant to read the readme file as the definitive list of things that you need to do in order to get the project up and running.

The Mystery CRM project is designed to provide all the settings that you need to get up and running; the client ID is a parameter that is stored in the Mystery CRM, then mirrored by way of parameterization into the necessary places.

The cti-services.js file operates in a similar manner. It is checking the configuration in the Mystery CRM to determine what iFrame Source URL should be used; that's all contained in the code block immediately above the line you quoted:

if(env.key == 'local'){
return https://apps.${region}/crm/index.html?crm=framework-local-secure&parentDomain=${domain};
}else if(env.key == 'pef'){
let partnerName = this.get('ctiSettingsService.settings.frameworkName');
return https://apps.${region}/crm/${partnerName}/index.html?parentDomain=${domain};
}else{
return https://apps.${region}/crm/embeddableFramework.html?parentDomain=${domain};

I would highly recommend starting with a local deployment, which uses the framework.js file already stored within the project in the /public directory. Once you've explored that a little bit, you can copy that framework file into a Private Embeddable Framework integration to get an understanding of how that deployment method works.

7

Ok, I added/created a new PC Embedded Integration and uploaded the framework.js file from the Mystery CRM Public folder - I did not make any changes to this file. Then I cleared and shut down everything.

I launched the CRM application and clicked on the phone icon. I was prompted to login and had access to the embedded client. As before, I did not change any of the configuration settings and when I view the source of the iframe it is the private embeddable link because as you and I both can see that if env.key is not set (which it is not when you load up the CRM for the first time) the last else statement sets the iframe source - which is the private embeddable framework.

I do know for sure that it was the Mystery CRM framework because the color scheme is different (matches the CRM).

Next, I switched it to Local and it doesn't work. I see the spinner in the pop-up and it never resolves. If I switch it to Private, it works.

Is the code in the application for the URL for the local framework correct? It resolves to:
https://apps.mypurecloud.com/crm/index.html?crm=framework-local-secure&parentDomain=http://localhost:4200

8

The initial setting of the app sets the env.key to local when it first starts up. This will pull the local version of the framework.js that's included in the repo.

I would recommend doing the following, in this order:
deactivate the Private Embeddable Framework Integration (all of them if there are multiples)
log out of the embedded client
set the environment in Mystery CRM to private
log back in to the embedded client
Observe the error "You do not have access to any Embedded Frameworks."
Set the environment in Mystery CRM to local
Observe that the client loads as expected, pulling settings from the Mystery CRM.

9

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.