1

I'd like to load the following Tableau Javascript Code within Salesforce Visualforce. Although it works, in a browser (see codepen here), I get the below error in the console when I put it in Salesforce Visualforce.

I utilize Tableau Online and not Tableau Server.

<apex:page >
<script type='text/javascript' src='https://10ay.online.tableau.com/javascripts/api/viz_v1.js'></script><div class='tableauPlaceholder' style='width: 1444px; height: 673px;'><object class='tableauViz' width='1444' height='673' style='display:none;'><param name='host_url' value='https%3A%2F%2F10ay.online.tableau.com%2F' /> <param name='site_root' value='&#47;t&#47;curalate' /><param name='name' value='test&#47;Sheet1' /><param name='tabs' value='no' /><param name='toolbar' value='yes' /><param name='showShareOptions' value='true' /></object></div>
</apex:page>

Error:

Failed to load resource: the server responded with a status of 404 (Not Found)

Refused to display 'https://10ay.online.tableau.com/&#47;t&#47;curalate/views/test&#47;Sheet1?:…reOptions=true&:display_spinner=no&:loadOrderID=0&:increment_view_count=no' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

I've also tried uploading the javascript here as a static resource called 'Tableau_Javascript_API and ran the below code but that didn't work:

<apex:page >

<apex:includeScript value="{!$Resource.Tableau_Javascript_API}"/>

<div class='tableauPlaceholder' style='width: 1444px; height: 673px;'><object class='tableauViz' width='1444' height='673' style='display:none;'><param name='host_url' value='https%3A%2F%2F10ay.online.tableau.com%2F' /> <param name='site_root' value='&#47;t&#47;curalate' /><param name='name' value='test&#47;Sheet1' /><param name='tabs' value='no' /><param name='toolbar' value='yes' /><param name='showShareOptions' value='true' /></object></div>


</apex:page>
  • You will still get the error you posted previously if you leave the script tag in place in the page. Check the browser's console to see if a resource has been loaded. – battery.cord May 4 '16 at 19:29
  • I see what you mean, I've updated to remove the script tag and updated my question above with what I tried. It's sitll producing the error around x-frame to same-origins – Chris May 4 '16 at 21:46
0

You will need to upload any scripts you are using to salesforce, as a static resource. These can either be a single javascript file, or a zipped directory of javascript files. You will then have to access the resource in your visualforce page. Salesforce does not allow loading scripts across domains (Which is the SAMEORIGIN error you are getting).

Once the files are uploaded as a static resource, you can use a <apex:includeScript> to access these files.

<apex:includeScript value="{!URLFOR($Resource.ZippedJS, '/base/subdir/file.js')}"/>
<apex:includeScript value="{!$Resource.SingleFileJS}"/>

You can read more about a method of accessing static resources on the developer site.

  • I tried that by turning this (10ay.online.tableau.com/javascripts/api/viz_v1.js) into a javascript file and then uploading as a static resource. I then replaced this (<script type='text/javascript' src='10ay.online.tableau.com/javascripts/api/viz_v1.js'></…) with this (<apex:includeScript value="{!$Resource.Tableau_Javascript_API}"/>). I'm still getting the same error though – Chris May 4 '16 at 18:33
  • I just added the script to my developer org, and added it to the page without errors. Can you check the console, and make sure its that script, and not another script on the page, which is producing the error? – battery.cord May 4 '16 at 18:43
  • Do I have write both <apex:includeScript value="{!URLFOR($Resource.ZippedJS, '/base/subdir/file.js')}"/> and <apex:includeScript value="{!$Resource.SingleFileJS}"/>, because I only uploaded JS file as a Static Resource and called it SingleFileJS – Chris May 5 '16 at 12:06
  • Just the line <apex:includeScript value={!$Resource.StaticResourceName}"/> is required to load the resource. If you've removed all other script references from your page, you should no longer be receiving a SAMEORIGIN error, and you will be able to find the resource loaded in your browsers console. – battery.cord May 5 '16 at 14:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.