We have embeded an iframe inside a suitelet. I ne...
# suitescript
r
We have embeded an iframe inside a suitelet. I need to add below functionality to it. How can I achieve it?
Copy code
window.addEventListener("message", function (e) {
  if (e.data.type === "SESSION_CREATED" && e.data.authenticated === false) {
    window.location.href = "some URL";
  }
  if (e.data.type === "SESSION_LOGGED_OUT") {
    window.location.href = "some URL";
  }
});
b
depends on how you implemented your suitelet
in general, the same way you added the iframe would be how you add a script element
minor warning, there are security concerns with the code you shared, expect to do more than just what is copied here
r
Copy code
/**
 * @param {nlobjRequest} request Request object
 * @param {nlobjResponse} response Response object
 * @returns {Void} Any output is written via response object
 */
function suitelet(request, response) {
  if (request.getMethod() == 'GET') {

    var context = nlapiGetContext();
    var form = nlapiCreateForm("Test Frame");
    var url = '<https://www.tidio.com/panel/settings/live-chat/chat-page>'
    var content = '<iframe width=600px height=100% style="height:640px;" src=' + url + '></iframe>'

    var newField = form.addField('content', 'inlinehtml', 'TEST IFRAME');
    form.addField('extra', 'inlinehtml', '')
    form.setTitle("TEST");
    newField.setLayoutType('outsidebelow');
    newField.setDefaultValue(content);
    form.addSubmitButton('Submit');
    response.writePage(form);
  }
}
Note: URL is different
b
you can add another inline html field to add your own script element
or you can setScript
r
I was also thinking about creating a client script and using setscript. Can you just copy and merge those 2 codes and reshare, to explain to me how it's possible with another inline html field ? And thank you for that security concern, I will look into it.
b
you add scripts to html using script elements
r
@battk having hard time with both 1. Tried creating Setting a client script 2. Tried creating Inline HTML in suitelet itself. If you have the time, can you test it out and let me know the solution.
b
what does your code look like
r
Suitelet
Copy code
/**
 * @param {nlobjRequest} request Request object
 * @param {nlobjResponse} response Response object
 * @returns {Void} Any output is written via response object
 */
function suitelet(request, response) {
  if (request.getMethod() == 'GET') {
    var context = nlapiGetContext();
    var form = nlapiCreateForm("Test Frame");
    form.setScript('customscript_iframe_check');
    var url = '<ifarme url>';
    var content = '<iframe id="checkid" width=600px height=100% style="height:640px;" src=' + url + '></iframe>';

    var newField = form.addField('content', 'inlinehtml', 'TEST IFRAME');
    form.addField('extra', 'inlinehtml', '')
    form.setTitle("TEST");
    newField.setLayoutType('outsidebelow');
    newField.setDefaultValue(content);
    form.addSubmitButton('Submit');
    response.writePage(form);
  }
}
client
Copy code
function pageInit(context) {
   console.log('Hello0');
   var wow = document.getElementById('checkid');
   wow.contentWindow.body.addEventListener('click', iframechechk1());
}

function iframechechk1() {
   console.log('hello1');
   window.addEventListener("click", function (e) {
      console.log('clicked1');
      if (e.data.type === "SESSION_CREATED" && e.data.authenticated === false) {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
      if (e.data.type === "SESSION_LOGGED_OUT") {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
   });
}
b
would do you expect that code to do
and what is it doing
i personally would only expect it to log and throw errors when you start clicking places
r
We are trying to integrate service now chatbot to netsuite. Service now will provide the chatbot url Which we have to embed in an iframe. This part is done no issue. The window.addeventlistener part is doing the sso authentication.
b
none of what you described is being done by your code
r
Copy code
if (e.data.type === "SESSION_CREATED" && e.data.authenticated === false) {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
      if (e.data.type === "SESSION_LOGGED_OUT") {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
Applying addeventlistener to the iframe. SSO authentication check will be taken care by service now team. In netsuite a user has already logged in with an sso role, and once he goes to the suitelet to raise some query or a ticket. The same credentials will be passed onto service now redirect uri, which will enable the chatbot to work.
b
lets be specific
Copy code
wow.contentWindow.body.addEventListener('click', iframechechk1());
window.addEventListener("click", function (e) {
you are adding click event listeners
so your code is trying to do something related to clicking
r
Ah my bad, I was doing some testing to see if the eventlistener is being called or not in a suitelet. originally its 'message'
Copy code
window.addEventListener("message", function (e) {
Service now team has provided the html <script> code to go with that iframe. This is for reference. https://community.servicenow.com/community?id=community_article&amp;sys_id=05289784db7d3cd0ddb1d9d9689619ed
b
share all the code
not just a portion of it
r
this is all the code for now. I have only removed the URLs. nothing else
b
Copy code
function pageInit(context) {
   console.log('Hello0');
   var wow = document.getElementById('checkid');
   wow.contentWindow.body.addEventListener('click', iframechechk1());
}

function iframechechk1() {
   console.log('hello1');
   window.addEventListener("message", function (e) {
      console.log('clicked1');
      if (e.data.type === "SESSION_CREATED" && e.data.authenticated === false) {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
      if (e.data.type === "SESSION_LOGGED_OUT") {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
   });
}
that means i think your code looks like this
r
yes
b
your pageinit function is adding a click event listener to the iframe's body
so you should be expecting something to happen whenever the iframe's body is clicked
in this case, every time your iframe's body is clicked, you should expect a log
and a message event listener should be added to the iframe's window
its not particularly sane to add an event listener every time you click the body
r
Copy code
function pageInit(context) {
   console.log('Hello0');
   var wow = document.getElementById('checkid');
   wow.contentWindow.body.addEventListener('mesage', iframechechk1());
}

function iframechechk1() {
   console.log('hello1');
   window.addEventListener("message", function (e) {
      console.log('clicked1');
      if (e.data.type === "SESSION_CREATED" && e.data.authenticated === false) {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
      if (e.data.type === "SESSION_LOGGED_OUT") {
         window.location.href = "<redirect_uri>"
            + encodeURIComponent("<our suitelet deployment ID>");
      }
   });
}
message has been deleted
b
that would be your iframe preventing you from running code in it
r
I am unable to a dd eventlistener to that specific iframe element. that click part I added for testing purposes, it was either click in both or message in both
b
cross origin iframes arent usually allowed to run code in other frames
its why Window.postMessage exists
in this case, the window that you control needs to be listening for messages posted by a window that someone else controls
your code is trying to make a window that someone else controls listen to messages
thats the reverse of the relationship and is not allowed
r
hmm anyway to make the whole thing work? as in service now will provide the chatbot, and we have to display it in netsuite. The backend coding of chatbot is done by service now. We only have to provide a placeholder for that iframe that contains the chatbot as well as the code for authentication.
b
depends on how much you understand about messages
r
not much, I can read up about it, if you can just guide me on how to approach this problem.
b
you need to understand how posting messages work
start with that link i gave on posting messages
if you dont understand, you may want to create your own window that posts messages and listen for them in your suitelet's form
r
I will check it out and get back to you. Thank you.