Kasus: meng-embed halaman dari web lain (TSIS) ke dalam web kita (TS.LIA) menggunakan iframe.
Masalah: akan muncul error cross domain
Solusi:
Iframe di TS.LIA meng-embed dari url TS.LIA, url tersebut me-load content dari TSIS.
[code language=”javascript”]
iframe = document.createElement(‘iframe’);
$(iframe).addClass(‘fullwidth’).prop(‘id’, ‘project-iframe’);
$(iframe).addClass(‘fullwidth’).prop(‘frameBorder’, ‘0’);
iframe.onload = onFrameLoad; // before setting ‘src’
iframe.src = ‘@Url.Action("Iframe")’;
//iframe.src = ‘http://localhost:1513/dummy/iframe’;
$(‘.board-body’).append(iframe);
function onFrameLoad() {
//kamus
var iframe = $(‘#project-iframe’).contents();
var iframeHeight = $(‘#project-iframe’).get(0).contentWindow.document.body.scrollHeight;
var projectId;
//algoritma
$(‘#project-iframe’).prop(‘height’, iframeHeight + ‘px’);
iframe.find(‘.project-slider a’).click(function () {
projectId = $(this).data(‘project-id’);
viewItem(projectId);
});
}
[/code]
[code language=”csharp”]
public string Iframe()
{
string baseUrl = ConfigurationManager.AppSettings["TSISUrl"];
string serviceUrl = "/Dashboard/Iframe";
string fullUrl = baseUrl + serviceUrl;
string content = null;
//algoritma
using (var client = new WebClient())
{
client.Headers.Add(HttpRequestHeader.ContentType, "application/json");
content = client.DownloadString(fullUrl);
}
return content;
}
[/code]
Jika dibutuhkan, tambahkan setting berikut di Web.config TSIS, di dalam
[code language=”xml”]
<httpProtocol>
<customHeaders>
<clear />
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
[/code]