Implementation
Here, you will find the basic documentation pertaining the iframe integration. This includes specifications about the parameters of the URL, details about the output and the input, and the communication methods so you can store this data.
Customize your iframe
You can activate or deactivate features of the iframe and customise its appearance by appending parameters to the base URL. Below is a detailed explanation of each parameter and a link to our iframe generator for visual previews and URL generation.
Iframe generator
Utilize our interactive iframe generator below to customize and preview your iframe. Adjust the settings as needed, and use the generated URL for embedding.
Ensure to replace the default company
identifier with your specific company identifier to ensure functionality in a production environment.
Parameters description
The iframe URL supports several parameters to tailor its functionality and design:
company
: Your unique company identifier provided by Legit.Health.companyCallbackUrl
: Overrides the default callback URL to which the diagnostic report will be sent.extraData
: A string that includes additional data for the report, such as patient identifiers, which remain hidden from users.primary
andsecondary
: Hexadecimal color codes to customize the interface colors.fontFamily
: Specifies the font family used within the iframe. Supported options:Roboto
,Montserrat
.enableResult
: Toggles the display of diagnostic results to the user.isForPatient
: Simplifies the text in the questionnaires so that inexperienced users can understand.locale
: Sets the application's language. Available options:en
(English),es
(Spanish).showQuestionnairesHeader
: Controls the visibility of the questionnaire title, defaulting to visible (1
).enableAnamnesis
: Shows or hides the anamnesis form, hidden by default (0
).- You can also adjust camera access settings:
enableAlternativeCameraModule
: Activates the alternative camera module, which is off by default (0
).enableAlternativeCameraModuleandroid
: Activates the alternative camera module on Android devices, also off by default (0
).enableExtendedInstructions
: Activates the extended instructions for taking photos, which are off by default (0
).macroscopicMedia
: Sets the requirement level for uploading a context or macroscopic image, disabled by default (disabled
).
How to obtain a company identifier
To generate a company-specific application key with an expiration date, access the following endpoint from our Deep Link API:
Detailed description of parameters
Patient use
When the primary users of the iframe are patients, you can utilize the isForPatient=1
parameter within the URL. Activating this option will modify the text within the questionnaires to make them more understandable. This may be a good idea because some clinical questionnaire use language that is too technical.
For instance, instead of displaying the basic label Itchiness
for the itchiness
question, the text will be transformed into a more straightforward query: How would you describe how itchy you feel?
. This enhancement aims to improve the questionnaire's accessibility and ease of completion for patients.
Visibility of the results
The results can be shown or hidden to users depending on the param enableResult
. The default behaviour is showing the results to the user after he or she has uploaded the photo, but you can pass enableResult=0
to show only a message.
Colors and font family
Primary and secondary colours can be customized using the params primary
and secondary
in the URL.
You can also select which font family you want to use. Currently, we support Roboto
and Montserrat
. Feel free to request aditional fonts and we will do our best to include them in the iframe.
Language
The language of the iframe can be customized using the param locale
and providing the values es
or en
. If you require another language, please reach out to us and we will arrange it.
Extra data
Given that you have available the extraData
field that accepts any string, you can pass any additional value you need to be attached to the report. For example, if you need to pass patient and insurance provider information, you would do it as follows:
const data = toBase64(
JSON.stringify({ patient: "XXX", insuranceProvider: "YYY" })
);
Anamnesis questionnaire
The parameter enableAnamnesis
allows to show or hide the anamnesis form. The default value is 0
so you need to pass enableAnamnesis=1
to show the anamnesis form.
Questionnaires
The parameter showQuestionnaireTitle
allows to show or hide the title above the questionnaires. You can identify these questionnaire under the title "Medical questionnaire".
Enable alternative camera module
Frameworks like Ionic play a crucial role in developing cross-platform mobile and web applications. However, they often limit hardware access, particularly to the camera, when using iframe
. This restriction is notably problematic in applications that require immediate camera access, as Ionic and similar frameworks typically block camera usage through a file
type input element within an iframe
.
Our findings indicate that this issue mainly affects Android devices running Ionic-developed applications displaying our solution in an iframe
. You may need to enable the enableAlternativeCameraModuleAndroid
parameter specifically for these devices.
To overcome these restrictions, we have developed a bespoke module that allows camera access directly within the iframe
. Activate this feature by appending the following parameters to your URL:
enableAlternativeCameraModule=1
: This parameter enables this alternative module within theiframe
. It is set to off by default (enableAlternativeCameraModule=0
), as a standard "file" type input is adequate for most use cases.enableAlternativeCameraModuleAndroid=1
: This parameter is specifically designed for Android devices, activating the alternative camera module where it is otherwise disabled by default (enableAlternativeCameraModuleAndroid=0
).
Implementing these parameters ensures our solution is adaptable and meets the diverse needs of different devices and operating systems, effectively bypassing the typical iframe
limitations in platforms like Ionic.
Enable extended instructions
By default, the iFrame shows minimal instructions for guiding users through the photo-taking process. To provide more comprehensive guidance, enable the parameter enableExtendedInstructions=1
. This will activate a complete set of instructions, including best practices for taking photos.
Macroscopic or context image
The macroscopicMedia parameter controls if users need to upload images as part of the diagnostic process. It has three possible settings:
disabled
: No image upload required and the field is not shown. This is the default value.optional
: Users can upload a macroscopic image, but it’s not mandatory.required
: Users must upload a macroscopic to proceed.
This parameter helps tailor the workflow depending on whether visual data is essential, optional, or not needed. It’s particularly useful for adjusting the user experience in medical assessments where visual context may be valuable or critical.
Input
In most cases, users interacting with the iframe are required to submit only two pieces of information: the specific body area affected and the images of the lesion. Optionally, an anamnesis questionnaire can be included, to gather more detailed patient history.
If our artificial intelligence identifies a condition with high probability, the iframe will automatically display a clinical questionnaire related to that condition. For instance, if there is a 98% probability that a lesion is psoriasis, the patient will be prompted to complete the PASI questionnaire. Completing this questionnaire provides additional details necessary for assessing the severity of the condition.
Anamnesis
Generic questions
The anamnesis questionnaire is a set of questions that are asked to the patient to gather information about the patient's medical history:
- What is the reason for the consultation? How did the problem start? Describe the origin.
- Do you have any allergies, especially to medications? If yes, list allergies.
- Are you taking any medication or treatment? If yes, explain what treatment you are taking.
- Do you have any major illness? Have you had anything operated on?
- Is there a history of any major illness in your family?
Condition-specific questions
The condition-specific questions can be found in the section Advanced > Scoring systems. Indeed, the questions that are specific of a condition are actually those that each scoring system considers.
Images
In the iframe, the user uploads the images of their lesion. They achieve this by clicking on a text that reads Click here to add an image
. This allows them to open the camera from their device, or to upload an image from their files.
Multiple images
It is worth mentioning that users can upload multiple images of the same lestion, like this:
When this happens, all images will belong to the same DiagnosticReport
and constitute a single call to the device.
Image quality
As you may know, the device has a technology called DIQA that measures the visual quality of the image. In the iframe, if the image quality is below 60%, the iframe will ask users to re-upload the image by making some corrections.
The value of image quality can be found in the message posted by the iframe.
"originalMedia": {
"type": "Image",
"modality": "Clinical",
"diqaScore": 74, // 👈
// ...
},
Please read the Output section of the Instructions For Use for more info.
Output (callbacks)
For a complete understanding of the output of our artificial intelligence, you can visit the sections of our documentation where we explain the values we compute depending on the use case: diagnostic support or severity measurement.
Please read the Output section of the Instructions For Use for more info.
Depending whether or not you add the key knownConditionForThisImage
, the output from the device will be different, following this logic:
Callback URL
Upon the successful processing of each uploaded image, our server dispatches a JSON payload containing detailed information about the diagnostic process to the configured endpoint. This JSON payload encapsulates multiple layers of diagnostic data and metrics. Here's an example of what you can expect:
{
"id": "0189bafa-0610-7349-a0ab-eb53695b27fd",
"url": "https://iframe.legit.health?companyId=XXXX&diagnosticReportId=signedId",
"pdf": "https://back-{pre}.legit.health/s2s-api/v2/anonymous-diagnostic-reports/encryptedId?format=pdf",
"extraData": "some extra data",
"visitIdentifier": "visit identifier",
"anamnesisQuestions": [
{
"question": "What is the reason for the consultation? How did the problem start? Describe the origin.",
"answer": "I have acne on my face and neck. It started 2 months ago."
},
{
"question": "Do you have any allergies, especially to medications? If yes, list allergies."
"answer": "No"
},
{
"question": "Are you taking any medication or treatment? If yes, explain what treatment you are taking.",
"answer": "No"
},{
"question": "Do you have any major illness? Have you had anything operated on?",
"answer": "No"
},
{
"question": "Is there a history of any major illness in your family?",
"answer": "No"
}
],
"pathology": {
"name": "Acne",
"code": "Acne"
},
"bodySite": {
"code": "HEAD_FRONT",
"name": "Face and neck"
},
"createdAt": "2023-08-03T12:38:10+02:00",
"result": {
"id": "0189bafa-0610-7349-a0ab-eb536a2185f6",
"metrics": {
"sensitivity": 83.31,
"specificity": 99.53
},
"preliminaryFindings": {
"hasConditionSuspicion": 100,
"isPreMalignantSuspicion": 0.02,
"isMalignantSuspicion": 0,
"needsBiopsySuspicion": 0,
"needsSpecialistsAttention": 100
},
"iaSeconds": 0.88273024559021,
"observations": [
{
"originalMedia": {
"type": "Image",
"modality": "Clinical",
"diqaScore": 86,
"url": "https://legit-dev.s3.eu-west-3.amazonaws.com/diagnostic-report-medias/bbb.png"
},
"explainabilityMedia": {
"url": "https://legit-dev.s3.eu-west-3.amazonaws.com/diagnostic-report-medias/ccc.png"
}
},
{
"originalMedia": {
"type": "Image",
"modality": "Clinical",
"diqaScore": 86,
"url": "https://legit-dev.s3.eu-west-3.amazonaws.com/diagnostic-report-medias/bbb.png"
},
"explainabilityMedia": null
}
],
"conclusions": [
{
"probability": 99.65,
"pathology": {
"name": "Acne",
"code": "Acne"
}
},
{
"probability": 0.06,
"pathology": {
"name": "Varicella",
"code": "Varicella"
}
},
{
"probability": 0.05,
"pathology": {
"name": "Impetigo",
"code": "Impetigo"
}
},
{
"probability": 0.03,
"pathology": {
"name": "Rosacea",
"code": "Rosacea"
}
},
{
"probability": 0.02,
"pathology": {
"name": "Dermatitis",
"code": "Dermatitis"
}
}
],
"scoringSystems": [
{
"scoringSystem": {
"name": "Acne lesion estimation grading index",
"code": "ALEGI"
},
"score": 8,
"scoreCategorySeverity": 1,
"scoreCategories": [
{
"code": "None",
"category": "None",
"min": 0.0,
"max": 0.0,
"severity": 1,
"severityAsString": "low"
},
{
"code": "Grade 1",
"category": "Grade 1",
"min": 0.0,
"max": 10.0,
"severity": 1,
"severityAsString": "low"
},
{
"code": "Grade 2",
"category": "Grade 2",
"min": 10.0,
"max": 20.0,
"severity": 1,
"severityAsString": "low"
},
{
"code": "Grade 3",
"category": "Grade 3",
"min": 20.0,
"max": 30.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 4",
"category": "Grade 4",
"min": 30.0,
"max": 40.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 4",
"category": "Grade 4",
"min": 40.0,
"max": 50.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 5",
"category": "Grade 5",
"min": 50.0,
"max": 60.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 6",
"category": "Grade 6",
"min": 60.0,
"max": 70.0,
"severity": 3,
"severityAsString": "high"
},
{
"code": "Grade 7",
"category": "Grade 7",
"min": 70.0,
"max": 80.0,
"severity": 3,
"severityAsString": "high"
},
{
"code": "Grade 8",
"category": "Grade 8",
"min": 80.0,
"max": 90.0,
"severity": 3,
"severityAsString": "high"
},
{
"code": "Grade 9",
"category": "Grade 9",
"min": 90.0,
"max": 100.0,
"severity": 3,
"severityAsString": "high"
}
],
"resultScoringSystemFacets": [
{
"facet": {
"name": "Acne lesion density",
"description": ""
},
"valueToDisplay": "None (0)",
"rawValue": 0
},
{
"facet": {
"name": "Number of lesions",
"description": ""
},
"valueToDisplay": "Mild (0-10)",
"rawValue": 5
}
]
}
]
}
}
Fundamental fields
id
: A unique identifier of the Diagnostic Report.url
: link to visualize the diagnostic report inside Legit.Health's interface.extraData
: A string value passed as a query parameter when you loaded the iframe.createdAt
: Timestamp indicating the time of creation for this diagnostic report.
Body site and pathology
These fields contain information about the location (bodySite
) and type (pathology
) of the lesion captured in the image. These fields are populated when the likelihood of the most probable conclusion surpasses a predetermined threshold or if it was set during image submission.
"bodySite": {
"code": "HEAD_FRONT",
"name": "Face and neck"
},
"pathology": {
"name": "Acne",
"code": "Acne"
}
Anamnesis questions
The anamnesisQuestions
field is an array of questions and their corresponding answers. These questions are asked to the patient before the image is submitted for analysis and their objetive is to gather information about the patient's medical history:
"anamnesisQuestions": [
{
"question": "What is the reason for the consultation? How did the problem start? Describe the origin.",
"answer": "I have acne on my face and neck. It started 2 months ago."
},
{
"question": "Do you have any allergies, especially to medications? If yes, list allergies."
"answer": "No"
},
{
"question": "Are you taking any medication or treatment? If yes, explain what treatment you are taking.",
"answer": "No"
},{
"question": "Do you have any major illness? Have you had anything operated on?",
"answer": "No"
},
{
"question": "Is there a history of any major illness in your family?",
"answer": "No"
}
]
Diagnostic result
The result
field encapsulates the comprehensive results of the diagnostic process. This includes:
metrics
: Measures of sensitivity and specificity of the diagnostic process.
"metrics": {
"sensitivity": 83.31,
"specificity": 99.53
}
preliminaryFindings
: An array of preliminary suspicions and their likelihoods, including the probability of malignancy and the requirement for a biopsy.
"preliminaryFindings": {
"hasConditionSuspicion": 100,
"isPreMalignantSuspicion": 0.02,
"isMalignantSuspicion": 0,
"needsBiopsySuspicion": 0,
"needsSpecialistsAttention": 100
}
iaSeconds
: The processing time consumed by the AI for image analysis.
Observations
The observations
field is an array of medias, each containing two fields: originalMedia
and explainabilityMedia
.
originalMedia
: the media sent to the algorithm to be analyzed. It includes:
type
: The format of the image.modality
: The context or manner of the image capture.diqaScore
: The Dermatology Image Quality Assessment (DIQA) score.url
: The direct S3 URL to the image. It is a time-limited signed URL; download it within 30 minutes of generation if you plan to use it later.
explainabilityMedia
: the processed image highlighting the area of the lesion analyzed by the AI. Like the original image, this is also a time-limited S3 URL, so remember to download it within 30 minutes if needed. The explainabilityMedia
contains either null
or the URL of an image that demonstrates what their severity estimation algorithms have "seen". Here's a detailed explanation:
- If there's no conclusive diagnosis for the analyzed image, this field is set to
null
. - If there is a conclusive diagnosis for the analyzed image, but it belongs to a group of pathologies for which severity is not yet measured, this field is again
null
. - Finally, if there is a conclusive diagnosis for the analyzed image and a trained algorithm to measure severity, this field contains the URL to an image that shows the analyzed signs.
"observations": [
{
"originalMedia": {
"type": "Image",
"modality": "Clinical",
"diqaScore": 86,
"url": "https://legit-dev.s3.eu-west-3.amazonaws.com/diagnostic-report-medias/bbb.png"
},
"explainabilityMedia": {
"url": "https://legit-dev.s3.eu-west-3.amazonaws.com/diagnostic-report-medias/ccc.png"
}
},
{
"originalMedia": {
"type": "Image",
"modality": "Clinical",
"diqaScore": 86,
"url": "https://legit-dev.s3.eu-west-3.amazonaws.com/diagnostic-report-medias/bbb.png"
},
"explainabilityMedia": null
}
]
Diagnostic conclusions
The conclusions
field is an array of diagnostic outcomes, each containing a pathology type and its associated probability.
"conclusions": [
{
"probability": 99.65,
"pathology": {
"name": "Acne",
"code": "Acne"
}
},
{
"probability": 0.06,
"pathology": {
"name": "Varicella",
"code": "Varicella"
}
},
{
"probability": 0.05,
"pathology": {
"name": "Impetigo",
"code": "Impetigo"
}
},
{
"probability": 0.03,
"pathology": {
"name": "Rosacea",
"code": "Rosacea"
}
},
{
"probability": 0.02,
"pathology": {
"name": "Dermatitis",
"code": "Dermatitis"
}
}
]
Scoring systems
The scoringSystems
field houses one or more scoring models for the identified pathology. These models come into play when the likelihood of the most probable conclusion surpasses a certain threshold.
"scoringSystems": [
{
"scoringSystem": {
"name": "Acne lesion estimation grading index",
"code": "ALEGI"
},
"score": 8,
"scoreCategorySeverity": 1,
"scoreCategories": [
{
"code": "None",
"category": "None",
"min": 0.0,
"max": 0.0,
"severity": 1,
"severityAsString": "low"
},
{
"code": "Grade 1",
"category": "Grade 1",
"min": 0.0,
"max": 10.0,
"severity": 1,
"severityAsString": "low"
},
{
"code": "Grade 2",
"category": "Grade 2",
"min": 10.0,
"max": 20.0,
"severity": 1,
"severityAsString": "low"
},
{
"code": "Grade 3",
"category": "Grade 3",
"min": 20.0,
"max": 30.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 4",
"category": "Grade 4",
"min": 30.0,
"max": 40.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 4",
"category": "Grade 4",
"min": 40.0,
"max": 50.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 5",
"category": "Grade 5",
"min": 50.0,
"max": 60.0,
"severity": 2,
"severityAsString": "moderate"
},
{
"code": "Grade 6",
"category": "Grade 6",
"min": 60.0,
"max": 70.0,
"severity": 3,
"severityAsString": "high"
},
{
"code": "Grade 7",
"category": "Grade 7",
"min": 70.0,
"max": 80.0,
"severity": 3,
"severityAsString": "high"
},
{
"code": "Grade 8",
"category": "Grade 8",
"min": 80.0,
"max": 90.0,
"severity": 3,
"severityAsString": "high"
},
{
"code": "Grade 9",
"category": "Grade 9",
"min": 90.0,
"max": 100.0,
"severity": 3,
"severityAsString": "high"
}
],
"resultScoringSystemFacets": [
{
"facet": {
"name": "Acne lesion density",
"description": ""
},
"valueToDisplay": "None (0)",
"rawValue": 0
},
{
"facet": {
"id": 108,
"inputAdornment": null,
"allowsInputFromUser": false,
"name": "Number of lesions",
"description": ""
},
"valueToDisplay": "Mild (0-10)",
"rawValue": 5
}
]
}
]
In each scoring system:
scoringSystem
includes the name and code of the scoring methodology.score
indicates the calculated score according to the system's rules.scoreCategorySeverity
signifies the severity associated with the computed score. It has three possible values:1
: low2
: moderate3
: high
resultScoringSystemFacets
is an array of facets used in score calculation, with each object containing the facet's information and the corresponding raw and displayed values.
Comprehensive scoring systems information
For an exhaustive understanding of scoring systems, their identifiers, and facets, you can download the detailed documentation:
- Preproduction Environment: Download here
- Production Environment: Download here
Overwriting callback URL
During the configuration process, the integrator must provide a callback URL to which to send the diagnostic reports. This URL can be customized at the iframe level through the parameter companyCallbackUrl
, for example:
https://iframe.legit.health/?company=XXX&companyCallbackUrl=http://someserver.dev
Obtaining a PDF version
You can generate a PDF of the report using our Deep Link API or by accessing the pdf
property in the JSON returned by the callback.
https://back-{pre}.legit.health/s2s-api/v2/anonymous-diagnostic-reports/{encryptedId}?format=pdf&locale=es|en
You can find the endpoint documentation here: getAnonymousDiagnosticReport
.
To choose the report language, include the query parameter locale
with the value es
for Spanish or en
for English.
Scoring systems
This is a work in progress
Examples
Case in which confidence in the diagnosis has exceeded the threshold
You can download an example of the JSON from this link: download
This case corresponds to the upload of 3 images of psoriasis on the elbow. In this case, our diagnostic support algorithm has calculated that it is psoriasis with high confidence, so the application displays the associated questionnaire (PASI) to calculate the severity.
The important thing here is that, although the user has uploaded 3 photos, the severity of the injury can only be calculated on one of them for logical reasons: each of the 3 photos can show different perspectives of the injury by omitting or adding parts, Therefore, we choose the most representative one for the calculation of severity.
Once the user completes the questionnaire, you receive a JSON like the one I attached where the most important fields are:
- "observations", an array containing a single element: the image that has been used to estimate the severity.
- "result.explainabilityMedia", an object containing the image with the analysis layer over the image used to calculate the severity
Case in which confidence in the diagnosis has not exceeded the threshold
You can download an example of the JSON from this link: download
In this case, the user has uploaded 3 images but our prediagnosis algorithm has not been able to determine the type of injury with a confidence that exceeds the threshold we have defined. Therefore, the severity is not calculated.
In the example JSON all the images are found under the "observations" property since the severity has not been calculated and, therefore, the "result.explainabilityMedia" and "supportingInfo" fields are empty.
Messages posted from iframe
Integration instructions
iOS
The iframe will send messages via the webkit bridge. You can listen for these messages to close the iframe or direct the user elsewhere in your application.
Below is the corresponding Swift code that allows you to display the iframe in your app and respond to the events posted.
struct WebView: UIViewRepresentable {
@Binding var path: NavigationPath
class Coordinator: NSObject, WKNavigationDelegate, WKScriptMessageHandler {
var webView: WKWebView?
var onMessageReceived: (Any) -> Void
required init(onMessageReceived: @escaping (Any) -> Void) {
self.onMessageReceived = onMessageReceived
super.init()
}
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
self.webView = webView
}
// Receive message from WKWebView
func userContentController(
_ userContentController: WKUserContentController,
didReceive message: WKScriptMessage
) {
print(message.body)
self.onMessageReceived(message.body)
}
}
func onMessageReceived(body: Any) -> Void {
DispatchQueue.main.async {
path.append(body as! String)
}
}
func makeCoordinator() -> Coordinator {
return Coordinator(onMessageReceived: onMessageReceived)
}
func makeUIView(context: Context) -> WKWebView {
let coordinator = makeCoordinator()
let userContentController = WKUserContentController()
userContentController.add(coordinator, name: "bridge")
let configuration = WKWebViewConfiguration()
configuration.userContentController = userContentController
let _wkwebview = WKWebView(frame: .zero, configuration: configuration)
_wkwebview.navigationDelegate = coordinator
return _wkwebview
}
func updateUIView(_ webView: WKWebView, context: Context) {
let companyIdentifier = AppConfig.companyIdentifier
let request = URLRequest(url: URL(string: "https://iframe.legit.health/?company=" + companyIdentifier)!)
webView.load(request)
}
}
This Swift code creates a WebView
struct that conforms to UIViewRepresentable
, allowing for communication between your web content and native app through the bridge
message handler. The WebView's Coordinator
class listens for events from the iframe and responds to them accordingly.
Android
In case you are developing an Android application, you should pass an object called legitHealthJsObject
to our iframe using WebViewCompat
You have also to give the right permissions to the application, so the camera and file selector is displayed properly. You can view an example in this repository:
https://github.com/Legit-Health/android-iframe-integration
Analysis Completed Message
When the analysis of the image has been completed and the result is available, the iframe will post a message through three different channels depending on the type of integration.
The posted message contains the anonymousDiagnosticReportId
, which is the identifier of the generated diagnostic report. You can use it to retrieve the complete report by consuming the endpoint described here: getting an Anonymous Diagnostic Report.
Web
In case you are embedding our iframe in a web-based application, the iframe will send a message via the postMessage
after the image is processed.
window.parent.postMessage(
{
message: "analysis_completed",
id: "anonymousDiagnosticReportId",
},
"*"
);
You can listen for this message with a regular event listener:
window.addEventListener("message", function (event) {
if (event.data.message !== "analysis_completed") {
return;
}
console.log(event.data.id);
});
iOS
The iframe will send a message via the webkit bridge after the image is processed.
if (window.webkit?.messageHandlers?.bridge) {
window.webkit.messageHandlers.bridge.postMessage(
JSON.stringify({
message: "analysis_completed",
id: "anonymousDiagnosticReportId",
})
);
}
Android
The iframe will send a message via the legitHealthJsObject after the image is processed.
if (window.legitHealthJsObject) {
window.legitHealthJsObject.postMessage(
JSON.stringify({
message: "analysis_completed",
id: diagnosticReportId,
})
);
}
Invalid Company Key
When the iframe cannot be loaded because of an invalid company key, the iframe will post a message through three different channels depending on the type of integration.
Web
In case you are embedding our iframe in a web-based application, the iframe will send a message via the postMessage
if the company key is invalid.
window.parent.postMessage(
{
message: "invalid_company_key",
id: companyKey,
},
"*"
);
iOS
The iframe will send a message via the webkit bridge if the company key is invalid.
if (window.webkit?.messageHandlers?.bridge) {
window.webkit.messageHandlers.bridge.postMessage(
JSON.stringify({
message: "invalid_company_key",
id: companyKey,
})
);
}
Android
The iframe will send a message via the legitHealthJsObject if the company key is invalid.
if (window.legitHealthJsObject) {
window.legitHealthJsObject.postMessage(
JSON.stringify({
message: "invalid_company_key",
id: companyKey,
})
);
}
Of course! Here’s a similar documentation for the image_rejected
message:
Image Rejected
When an image is rejected due to insufficient quality, the iFrame will post a message indicating the rejection through three different channels depending on the type of integration.
Web
In case you are embedding our iframe in a web-based application, the iframe will send a message via the postMessage
if the image is rejected.
window.parent.postMessage(
{
message: "image_rejected",
id: "",
payload: [
{
position: 0,
name: "hasEnoughQuality",
pass: false,
diqaScore: 30,
},
],
},
"*"
);
iOS
The iframe will send a message via the webkit bridge if the image is rejected.
if (window.webkit?.messageHandlers?.bridge) {
window.webkit.messageHandlers.bridge.postMessage(
JSON.stringify({
message: "image_rejected",
id: "",
payload: [
{
position: 0,
name: "hasEnoughQuality",
pass: false,
diqaScore: 30,
},
],
})
);
}
Android
The iframe will send a message via the legitHealthJsObject if the image is rejected.
if (window.legitHealthJsObject) {
window.legitHealthJsObject.postMessage(
JSON.stringify({
message: "image_rejected",
id: "",
payload: [
{
position: 0,
name: "hasEnoughQuality",
pass: false,
diqaScore: 30,
},
],
})
);
}