I have a mean-stack application that hosts an Excel website and add-in. html5 included and it has
<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script> <script src="https://cdn.rawgit.com/devote/HTML5-History-API/master/history.js"></script>
In the Excel add-in, I have a button that opens a page on the Dialog API website:
$scope.openDialog = function () { Office.context.ui.displayDialogAsync("https://localhost:3000/preview/tmp/6wr-4PqdBrYQwjp3AAAD", {}, function () {}) }
When I click on this button in Excel Online in Chrome, a dialog box opens with the following URL (note that # and several %2F systematically added), but this does not interfere with the page displaying well.
https://localhost:3000/preview/tmp/6wr-4PqdBrYQwjp3AAAD?_host_Info=excel|web|16.00|en-us|b6f37f78-e519-7d03-0069-b9c4317a362c|isDialog#%2Fpreview%2Ftmp%2F6wr-4PqdBrYQwjp3AAAD%3F_host_Info=excel%7Cweb%7C16.00%7Cen-us%7Cb6f37f78-e519-7d03-0069-b9c4317a362c%7CisDialog
However, when I click on this button in Excel Online in Firefox, the URL quickly changes to the following URL, which displays the website’s homepage:
https://localhost:3000/home#%2Fpreview%2Ftmp%2F6wr-4PqdBrYQwjp3AAAD%3F_host_Info=excel%7Cweb%7C16.00%7Cen-gb%7C919fff78-e51f-dc20-0c3c-871b7d0ec25d%7CisDialog
So my questions are:
1) Why Office.context.ui.displayDialogAsync systematically add # and %2F to my website url? Is it possible to prevent this?
2) Is it possible to create a URL (regardless of # and %2F ) that Firefox accepts?
Edit 1: It seems that if I do not use html5-history-api , it will work. So I don’t know how to disable html5-history-api for this displayDialogAsync ? (The reason why I should use html5-history-api after office.js here .)